2月から3月にかけて。
こんにちは、Yumihikiです。
ご無沙汰しております。
久しぶりにブログを更新します。
2月から3月15日まで何をしていたか？なのですが、この期間は色々と悩んでいました。
その中16日現在、決まったことと言えば・・・
・転職はしよう。しかし焦って就職するのではなく、慌てず焦らずにプログラミングをしつつ、自社サービスまたは受託の企業へ就職しよう。
・明日メンタルヘルスマネジメントという資格の試験を受けます。
・ポートフォリオサイト作るぞ。
・WordPressでブログも作るぞ。
といった感じです。
ざっくりですね。
プログラミングは、勧められたN予備校を行っていきますが、4月には終わらせられると良いなと思っています。
日々、ゆっくりと焦らずにやっていきたいと思います。
1/7-31 行ったこと振り返り
こんにちは、Yumihikiです。
今日は1/7から31にかけて行なったことの振り返りを行いたいと思います。
隙間時間に読書 内訳
・メモの魔力
・お金2.0
・FACTFULNESS(31日現在読書中)
計３冊読みました。
継続して行なっているLaravel掲示板では
・ログイン認証機能の付け方を学ぶ
・投稿時のカテゴリを新たにつける
・画像のアップロード機能をつける
・登校時に投稿者の名前を表示させる
ことができました。
他のプログラミング関係では
・もくもく会へ２回参加
・LaravelLTへ聴講者として参加
しました。
色々な方とお目にかかる機会もあり交流ができて楽しかったです。
また、人生については
・そうだんドットミーで面談する
・自分がこれから取り組んでいきたいことが見つかる
・新婚旅行の話、結婚式の話などを詰めることができた
という大きな前進（？）がありました！！
それらはまたの機会に記事にしたいと思います。
総合的にみて、色々と勉強や活動できたような気がします。勉強会に関しては先月に色々と手を広げすぎてしまった節があるので集中的にしたのもよかったかと。今まであまり勉強していなかったことを考えると良い習慣が身についてきたかなと思います。
しかし、Laravelの機能についてはまだまだまだまだ理解できていない点が多いのと、
掲示板を1月に終わらせるという目標が未達成で終わってしまったのが非常に残念です。
明日から2月になるのですが、2月はポートフォリオサイト作りと自作アプリ作りの２点（優先度はポートフォリオサイトが高め）に注力したいと思います。
自分、口下手だなぁと思うことがあるので代わりに説明してくれるものを用意したい、という感じですね。
他にはタイピングしていて腕が痛くなることも多かったので身体面についてもケアを行なっていきたいです。余談ですが最近毎日30分歩くようにして健康に気を使い始めました。
ざっくばらんですがこれにて今月の振り返りを終えたいと思います。
12/25-1/6振り返り
こんにちは、Yumihikiです。
一週間空いてしまいましたが、行なったことの振り返りを行いたいと思います。
- PHPフレームワーク Laravel入門を終わらせる(12/14-31)
- 地元に戻る・餅つきをする(12/29,30)
- Gitの操作方法など見つめ直す(1/2-4,Qrunchに残しました)
- Laravelで掲示板を作成する(1/2-4)
- 偏頭痛起こる(1/3)
- 未来に先回りする思考法を買って読み終える(1/3-5)
- 妻の実家で法事を終える(1/4,5)
- 合間に家の大掃除を終える(1/1-6)
それなりに長い休暇を取ることが出来たので、やりたかったことをたくさん出来ました。家の掃除なんて普段あまり出来ていなかったので...
Macの細かい設定を調べたりAmazonで買おうと思っているものや欲しいなと思ったものを買ったり出来ました。休みで意思決定力が少し回復出来たのは良かったです。
逆に出来なかったことは
- 転職について見つめ直す
でした。現職・今のままではいけないと考える気持ち、自分の中で漠然とした気持ちはあるのでそれを言葉にしなくてはならないのですが、それが出来なかった。
エンジニアになりたい、なんて言っていますがそれがゴールになってしまっていて結局のところエンジニアになって何がしたいのか？を明確に出来ていない以上今のまま（何にしても）転職したところで駄目だなと感じています。
この辺りをもう少し、手を動かしながら向き合っていきたいと思います。
2018/12/17-24まとめ
定期的に行なったことのアウトプットを行なっていこうと思い、とりあえず雑多に書いていきたいと思います。
今週やったこと
PHPフレームワーク Laravel入門 - 秀和システム あなたの学びをサポート
のP119 チャプター4-1 ミドルウェアの利用からP223 チャプター5-4 マイグレーションとシーディングまで終了。この調子で今月中には終わらせる。
リックテレコム 書籍情報 いきなりはじめるPHP~ワクワク・ドキドキの入門教室~
人からお借りしていた本。全て終わらせる。内容も平易なものが多かったためサクサク進んだ。ただmac環境では途中からうまく進まなかったのでWindows環境に切り替えた。
今後の目標を立てる。
今月中に青本を終わらせて、来月中に掲示板を作成、２、3月にオリジナルアプリを作成します。
大枠でこんな感じです。
忘年会を３回挟んでいなかったらもう少し進んだのでは？と言う印象ですがそれなりにやれていたんじゃないのかなと言う感じ。
あとはもう少し、やったことに対する感想を持っていきたい。
マイグレーションが、シーディングが、などなど自分が何を学んで何をできるようになったのか？と言うアウトプットが下手くそだと感じるのでこれらをもう少し書きたい。
個人的に勉強になったのはクエリビルダ。DBと接続して表示させる仕組みは今後Webアプリを作っていく中で非常に重要になっていくが、その記述を平易にしてくれる仕組みがあるんだと驚いた。今までPDO(SQL文を書いて)で接続しかしたことがなかったが、Laravelではもう少し直感的にSQLを書かなくて良いのが慣れたらとても良さそう。
このような感じで色々とまとめていきたい。
今週は色々と考えること、実りがあったように感じる。
一度呟いたのだが、弓を引いてない奴がどうしたら上手くなれるか何て言ってたら片腹痛いので自分がプログラミングしてないのに出来るようになりたいなんて言ってるのは変わっていかないといけないと思う。
正直わかっていないことが多すぎるのだが、とりあえずやってみる。その後からでも理解を深めるのは遅くないだろうなと腹をくくることができた。
あとは眠くなると、手の疲れもあって文体が崩れがちなのを何とかしたいです、何とかしていきます。。。
第10回 ALAKI ◯◯ Lab -Webセキュリティ超入門- に参加した
11/28に行われた、ALAKI株式会社様主催の第10回 ALAKI ◯◯ Lab -Webセキュリティ超入門- に参加しました。
自分で何かポートフォリオ等作成する前に、一度セキュリティについて勉強しようと思ったのがきっかけです。
内容としては、XSSとCSRF、SQLインジェクションについての勉強会でした。
XSS,SQLインジェクションは過去に少し聞いたことがあった程度、CSRFは一度も聞いたことがなかったレベルですが、それぞれについて理解できたかと思います。
1.XSSについて
2.CSRFについて
3.SQLインジェクションについて
の順に説明をしていただいたので、まとめていこうと思います。
(メモ書きを基にしているので文体、句読点の有無など非常に汚いですが申し訳ございません）
1.XSSについて
正式な読み方：クロスサイトスクリプティング
外部からの入力内容に応じて、表示内容が変化する動的Webページの脆弱性、
もしくはその脆弱性を利用した攻撃のこと
検索窓 お問合せフォームなど 操作が入るページが当てはまる
どのような影響があるか？
攻撃者の用意したスクリプト実行によるクッキー値の盗難及び、なりすまし被害
例 代わりにログインされてしまう
サイト利用者の権限、Webアプリケーション機能の悪用
Webアプリケーション内でHTML,JAvaScriptを生成している箇所全て。
PHPのGET,POSTは特に注意
脆弱性に対する対策は、最初に作り始めた時にしておきべき。
次のような理由から脆弱性をつかれてしまう。
・XSS脆弱性が発生する原因はメタ文字(<,>,’,”)を正しく扱っていないため
・不用意に$_GETを利用しているため（PHPを利用している場合）
$_GETは送られてきたデータをチェックするのが大変
判断のしにくいものを送ってしまうと良くないので数値くらいに留めておいたほうが良い
< や & をエスケープして表示する
エンコーディングを統一する
$_GETを利用する場合は、エラーチェックが容易な場合に限る
できる限りリンクタブを作らない
対策
htmlspecialchars、ENT_QUOTESを利用
htmlspecialcharsとは？
HTMLとして意味を持つ文字を意味のない文字に変更する処理を行う関数
http://php.net/manual/ja/function.htmlspecialchars.php
string htmlspecialchars ( string
$string [, int $flags = ENT_COMPAT | ENT_HTML401[, string $encoding = ini_get("default_charset") [, bool $double_encode = TRUE]]] )
第一引数に変換したデータ名
第二引数にどういったメタ文字を潰すか
ENT_QUOTESは’,”共に潰す処理
<>も。
第三引数に文字コード
受け取ったものを表示させるところには特に注意する。
2.CSRF対策
正式な読み方：クロスサイトリクエストフォージェリ
フォージェリ = 盗む、奪う といった意味
利用者が意図せず 重要な処理 を実行させられる脆弱性、もしくはその脆弱性を利用した攻撃のことを言う
例えば、勝手にWebサービスを退会、パスワードを変更、SNSや問い合わせフォームへ書き込みされるなど。
重要な処理をクッキーのみのセッション管理を行って処理しているサイト
Basic認証などのHTTP認証やTLSクライアント認証のみに頼った識別を行っているサイトが攻撃の対象になる。
原因は二つほど挙げられる
From要素のaction属性にURLが指定できるため
クッキーに保存されているセッションIDは、対象サイトに自動で送信されてしまうため
脆弱性への対策
利用者が意図した処理かどうかを確認できる様にする
秘密情報の設置、
パスワードの再入力、
Referrerのチェック
→Webサイトはリンクを辿っているものを記憶している
一つ前のページをきちんと確認して、利用者の意図したアクセスかどうかを確認する
トークンを持っている人でないと参加できない様な仕組み
→トークンの設定を行う
トークンが一致しているかどうかチェックするのが必要
Laravelはデフォルトでフォージェリしないとデータを送ることができない。
脆弱性については対処法を知った上で取り組むことが必要
大規模になればなるほど、後でやると大変
最初から対策するのが必要
3.SQLインジェクション
上述じた二つは対処しきるのは難しいがSQLインジェクションは必ず対処する様に書かれている
SQLインジェクションとは？
もしくはその脆弱性を利用した攻撃のことを言います
あった場合どうなるか？
DB内の情報漏洩、改ざん、（攻撃者が自由に設定）
ログイン認証を回避
DBの破壊
SQLインジェクションの対策範囲
SQLの呼び出しをしている箇所、全て
特に外部入力を必要として動くSQLは要注意！
検索キーワードに一致するものを取得するもの。
SQLインジェクションが発生する原因
文字列、数値の値（リテラル）が正しく処理されていないため、
SQLとして処理される文字を入力されてしまうため
PDOを利用してSQLインジェクション対策を行う
‘の中に変数を入れてはいけない。
もともとあったSQLをなかったことにして、実行してしまう
対策
リテラルを正しく構成できる様に制御する
https://www.ipa.go.jp/files/000017320.pdf
PDO:MYSQL_ATTR_MULTI_STATEMENTS => false,
複文（１回の問い合わせで複数実行すること）を禁止する。
PDO:静的プレースホルダ設定。「true」にすると動的プレースホルダ設定になる
ここをfalseにすると良い。
プレースホルダを利用するのが２種類あって、
符号付きと名前付きの二つ
バインド設定
$ps->bindValue(‘:author’, $author, PDO:PARAM_STR)
静的プレースホルダを使うのが勧められている
動的で取得すると全て文字列型で取得してしまう
静的だと型を維持したまま取得できる
今回学んだことを実際に落とし込むことが大事だと思うので、明日からはセキュリティ対策を進めていこうと思います！！
RAKUS Meetup OSAKA 大阪開発チームの”チャレンジ”紹介に参加した
2018年11月27日、楽々清算で有名なラクスさんのイベントに参加しました。
恥ずかしながら最初は社名にピンと来なかったのですが、調べてから横澤さんが出演されているCMの企業さまか...!と思い出した過去があります。
さて、そんなこんなで勉強会参加メモです。
今回は次の３セッションを聴講しました。
チャットディーラーの高速開発を支えるLaravel
Why Mob Programming? - モブプロという働き方 -
トウダン・ジャーニー
全体を通して様々な発見・学びがありました。例えば、Why Mob Programming? - モブプロという働き方 -の中のモブプロ を参考にして普段の仕事の効率化を計ってみました。
私の場合、普段の業務ではAdobe IllustratorとPhotoshopを使用していますが、個人によって用いるツールや持っているスキルも異なるので人によって、「これ使っている」「あれ知らなかった」など出てきてしまうのですが、それを解消する手助けになりました。
残念ながら急に全員巻き込むのは難しそうだと思ったので、隣の席の人と「この作業を一緒にやってどっちが早くできるか勝負しましょう！！」と話して楽しみながら取り組んでみました。まだ活動としては全く普及できていませんが、これからも学んだ内容を取り組んで行きたいと思います。
さて、それでは登壇内容についてのメモです。
まずは
チャットディーラーの高速開発を支えるLaravel
吉元和仁（よしもとかずひと）さん
今年夏に開催された PHPカンファレンス関西 2018 の登壇内容をベースにお話しします。10年以上PHPでノンフレームワークで開発・運用されてきた主力サービス（メールディーラー）の開発チームが、新規に姉妹サービス（チャットディーラー）を立ち上げる際に Laravel を選択をしました。 開発期間半年というスピードが求められる中で、Laravel での新規サービス立ち上げのチャレンジをご紹介します。
とのことです。PHPカンファレンス関西2018で別の方がお話されており下記に掲載のスライドはその時のものになります。
ラクスさんのサービスにメールディーラーというサービスがあるのですが、2001年にサービスの提供を開始してPHPを用いノンフレームワークで開発されたとのこと。
15年以上改修を続けられ、グローバル変数が数千個あったり、何を返すかわからない共通関数がたくさんあったりとしたそうです。
そのような状況で課題感を持つチームが新規開発にチャレンジされた時の話を教えていただきました。
チャットディーラーはWebページに専用スクリプトを埋め込んで利用するWebチャットシステムで、PHP,Laravel,Node.js,Express,Socket.IOを用いて開発されています。
＊ここから箇条書きメインです。
バックエンドとフロントエンド３名ずつ
２０１７年要件定義 開発基盤整備
新サービスの立ち上げに関しての課題
フレームワークを選定するにあたって
長期サポートと機能性を選定
シェア率が高くて人気がある、活発なコミュニティなど
ルーティング、テンプレートエンジン、ミドルウェアやライブラリなど
機能性もあり選択
Laravelでよかったこと
オールインワンでスピード開発に向いていた
バンドル？準備コストがかからなかった
簡単設定でどんなものにもつながる
PosrgreSQL,Redis,Postfixをミドルウェアでしよう（一例）
標準ライブラリが使いやすい
ルーティング
URLとコントローラの紐付けが直感的にかけてわかりやすかった
Middleware
事前・事後処理を追加したい ルーティング設定をgroupメソッドで加工だけ
バリデーション
-Requestクラスに追加するだけ
ノンフレームワークではそうはいかない
ノンフレームワークではcronが増えていく
ドキュメントが充実していた
Laravelで困ったこと
Vue.jsは思ったより難しかった
{{}} マスタッシュ記法という
$nameがマスタッシュ記法で囲まれている
Bladeはマスタッシュ記法をエスケープできず
{{ }}の文字間に半角空白を挿入
一見簡単そうだが、プロダクトで使うにはコンポーネント化が必須とのこと
jQuery熟練者への配慮 慣れ親しんだ人には左手で箸を持てといっている様なもの
質問
今振り返るとVue.jsで作っておいてよかったのか？ もう一度作り直すならjQueryで作った方が？
Vue.jsはゴリゴリDOMの操作をする必要がなかった。
SPAでなければVue.jsで作った方が良いがシングルページならjQueryの方が良いとのこと。無理に使う必要はないのでは？という結論だった（気がします。。。）
Why Mob Programming? - モブプロという働き方 -
大平直宏（おおひらなおひろ）さん
大阪の楽楽精算の開発チームでは、スクラム開発を取り入れて新機能の開発に取り組んでいます。急成長するサービスの開発を支えるためこの1年間で4人のメンバーが増えており、メンバー同士の知識共有が課題となっています。アジャイルな開発を推進するために取り入れているモブプログラミングのチャレンジをご紹介します。
終わらないタスク
経理知識などがないとダメ
文書化されておらず暗黙知 すぐに聞ける相手がいない、実装してレビュー待ち、
モブプロへの期待感
開発メンバーの増員に対応
技術スキルだけでは足りない、、、
モブプロとは？
モブ（集団）でのプログラミング
ペアプロの複数人バージョン
同じ時間に、同じ場所で、複数人でPCを使う
ナビゲーター（指示を出す人達）とドライバー（PCを触る人）に分かれる。
よかった点
1,意思決定の高速化
確度の高い意思決定を小さく繰り返す
-全員その場にいるので「あとで相談」がない
-設計・実装方針の合意が早い
2.リードタイムの短縮
・待ち時間がなくなる
-質問や相談するのを待っている時間
レビューしてもらうのを待っている時間
・レビューの大きな差し戻しがなくなる
タイムロスがなくなる
3.暗黙知の共有
・文書化されていない業務知識
会社やチームの開発ルール
CIツールの設定や外部連携SDKなど属人化しがちな知識
マニュアルチェックのフロー
・自分の知らない便利ツールやショートカット
-IDEの便利機能
REST APIの動作確認ツール
Gitコマンド
人がやっているのを見て、あ、こんなのあるんだってわかる
チームの価値基準を合わせられるなど他にもメリットがあった
よくなかった点
1.他人のPC辛い
キーボード配列、InteliJのキーマップ
自分のPCを持ち込む様にしたが、ドライバーの変更があまりなされなくなった
2.心理的プレッシャー
見られている/終わらせなくちゃという焦り
→一時間ではなく二時間枠にトライ
3.費用対効果
リソース効率は悪い
ウォーターフォールとは相性が悪い
同じ期間のトータルの生産量は下がる
効率より効果
アジャイルとは相性が良い
トータルの生産量よりもリードタイムを重視したい
まとめ
定性的には効果がある
モブプロという手段の獲得
モブプロ力はまだまだ
トウダン・ジャーニー
川並裕（かわなみゆう）さん
今年の夏に開催された PHP カンファレンス関西 2018 で、会社として初めて技術イベントに協賛し、2 名のエンジニアが登壇しました。開発組織を横断した登壇推進チームが業務として登壇プロジェクトを推進したチャレンジをご紹介します。
@kawanamiyuu
PHPが好き
業務はJavaを利用
PHP Kansai 2018に登壇するまでの流れ・裏側
背景
組織として
人材の育成
車外へ情報発信していく文化の情勢
車外へのエンジニアリングのアピール
採用活動の強化
個人として
業務として取り組むために
プロジェクト化し、横断チームで推進
３サービスから合計５人が集結
題材サービスの開発メンバー３人
工数を見積もってスケジュールか
経験がないので「えいや！」で見積もり
今後のモデルケースにする
インクリメンタルな資料作成
発表練習
３回 + 公開リハを行い、そこで事前に質問を聞いたりした。（最後の事前質問ではそれまでの３回で上がらなかった様な疑問が出てきたとのこと）
所感
担当サービスを横断したメンバーで業務として取り組みを推進できた
自社のエンジニアが登壇している姿を見て感動した
我々はもうできる。やるか、やらないか、あとは我々次第だ。
（登壇に関する）
Q.各メンバーがどのくらい乗り気だったのか？
A.はっきりとは言えないが、いやいやな人はいなかった様。
このような感じでチャレンジをご紹介いただきました。
最初に述べましたが、業務に取り入れられる点など学びも多く参加して良かったです。他にもLaravelのメリットの確認であったりカンファレンスに登壇するまでの裏側（？）だったりと知ることができました。今後も勉強会、またもくもく会も開催予定とのことで機会を作って参加したいと思いました。
FRONTEND CONFERENCE 2018に参加してみた！
進化を続けるフロントエンドの「今」をテーマに
11/24(土)に開催されたFRONTEND CONFERENCE 2018に参加してきました！
フロントエンドって？と言われたら
HTML,CSS,JavaScriptなどを使ったWebサイトの表に出てくる側...（？）程度のことしか答えられない程度の初学者ですが
お名前を存じ上げる方が登壇されるのであったり、まぁ分からんのは当たり前やしとりあえず参加してみようという気持ちでした。
参加してみての感想を3つ挙げると、
1.Webの世界は知らないことだらけ。さらに新しいことが出続けるので色んなことを学びつづける必要がある。
2.アプリを1から自作するという点に拘りすぎず、他で代替できるものがあればそれをベースに行った方が良い（車輪の再発明を防ぐ？ この単語が直接出てきた訳では無いですが...）
3.実際の開発現場、業務について何も知らなかった。これから飛び込んで行こうとする世界だからこそしっかりと学んでおく必要がある。
この3点に集約されます。あまり感想としてのまとまりはありませんが...
どうしてこれらを感じたか？は最後にまとめるとして、
ひとまずは何のセッションを聴講してどういうことをお話されていたかを記載します。
Webアプリを作らない選択肢 初心者向けGAS講座
Web Music では何ができるのか
Chrome Dev Summit Recap
10名越えのスクラムでフロントエンド開発する現場の声
業務システムでこそ使えるPWA
タイポグラフィ ベーシック
フロントエンドで作る理由
以上の計７つを聴講しました。
それでは順に。
Webアプリを作らない選択肢 初心者向けGAS講座
by 株式会社ハマヤ Wakai Shinichiroさん
WEBアプリを作らない選択肢 from Shin Wakai
正確にはWEBアプリを一から作る必要が無いのでは？という話でした。
話す内容を5つに分けられており、順に
1.1からのWebアプリは時間がかかる
2.GASができること
3.事例紹介
4.使う上での注意点
5.まとめ
という感じでした。
1.1からのWebアプリは時間がかかる
一から作成するのを想像すると…
エディタ、実行環境、サーバー、
スプレッドシートや言語知識、バックエンド、技術選定、基礎知識…
色々なものが必要。
それを全てGASは解決。
GASは誰でも簡単に扱える。
ちなみにGASにはContainer BoundとStandaloneの２種類が存在するとのこと。
2.GASができること
4点ほどある
・シート情報の取得
・セルからデータを取得、貼り付け
・独自関数の定義
データ操作
Create,Read,Update,Deleteができる
スクレイピング、画像のバイナリ
トリガー
Webアプリ開発
HTML,CSSを用いて作成することもできる。
また、Gsuite Developer Hubでトリガーの設定が可能
3.事例紹介
楽天ランキング調査システム
楽天商品管理システム 楽天に商品を出したりしているからこういう機能が必要だった
ランキング調査システム
1日１回楽天 APIを叩きスプレッドシートに書き込み、CSV出力
WEBアプリを公開
画像をアップロードして、商品マスタを更新
それを楽天に商品情報を追加・更新
4.使う上での注意点
GASには処理時間とトリガーの制限があるので注意。
5.まとめ
このようなお話でした。
GASは利用したいな、と思いながらも実際に利用できていなかったので実際に触ってみたいと思いました。
次に
Web Music では何ができるのか
by Crescware okunokentaroさん
Angularユーザコミュニティ ng-kyotoのオーガナイザなどをされていらっしゃる方。
こちらは詳細についてはスライドを参照して頂くとして、
自分の感想は「えっ、ブラウザ上で鍵盤弾けるの！？」でした。
Web Music Developers JOという開発者コミュニティ、
Web Audio API,Web MIDI API,MIDI... まっっっっっったく知らない単語ばかりでしたが、こういうこともできるのか...とただただ驚いていました。
Webでは自分の知らない出来ること、まだまだたくさんありそうです。
Chrome Dev Summit Recap
by Google 宇都宮さん
サンフランシスコで行われたChrome Dev Summit のおさらいということでお話いただきました。こちらは発表資料の公開が無いとのことで他の方のセッション紹介に比べると長文になります。
今年はPerformanceというテーマが活発だったとのことです。
全てのセッション共通のメッセージは"Performance Budget"
Webサイトにおけるパフォーマンス指標のこと。それをチェックするためにhttp archiveというサイトをオススメされていました。
ImagesとJavascriptは特に改善すべきポイントとのことです。
そのため各環境に応じたBudgetを用意することを推奨されていました。
パフォーマンス診断を行ってくれるツール(?)
Learnするとパフォーマンスを上げるためにはどうやったら良いか教えてくれる wev.dev
こちらは日毎に改善内容を教えてくれるそうです。
また、ベータ版なので何かあればフィードバックが欲しいとのことでした。
ChromeでNative Lazy Loading出来るようにしているとのこと。
Lazy Loadも例によって詳しく無いのですが次のサイトがわかりやすかったです。
パフォーマンスを上げるために、画像を遅らせて読み込む技術（？）のことみたいですね。ちなみに、サイトをスムーズに動かすためにレスポンスは100ms以内、アニメーションは60FPS以内が良いとのこと。
文字の周りをキラキラさせるようなものはDOMを直接操作するよりも効率的に実装できるPaint Workletを勧められていました。JavaScriptで記述できるみたいです。
画像を最適化（軽く）した際にどう見えるのか実際に比較しながら見ることができるサイト。トップページ左下のLarge Photoを実際にデモで圧縮していましたが、結構軽くしてもそこまで大きな違いが無いことを確認できました。
Webサイトに掲載する画像はそこまで高品質出なくても十分だと感じ、自分もWebに掲載するときは必要以上に綺麗なものにしなくても良いのかなと思いました。
Google、Webコンテンツ表示を高速化する「Web Packaging」「Portals」を推進 - Computerworldニュース：Computerworld
Webの画面遷移の体験をシームレスにできるPortal
となりのヤングジャンプを例に挙げて説明されていました。リンク（別漫画）をタップして読み込む時に読み込む画面が表示されると思うのですが、読み込み画面を表示せずにすぐ移動できるような技術みたいです。
かなり濃いお話でした。メモしきれていないのでYouTubeでサミットの情報を入手された方が良いかもしれません。。。
設定をいじれば日本語に自動翻訳してくれるので私でも理解できそうです。
10名越えのスクラムでフロントエンド開発する現場の声
by 株式会社ゆめみ 上原さん
タイトルの通りなのですが、10名越えのスクラムでフロントエンドを開発されている実際のお話を語っていただきました。スクラムとは？という点から余り知らなかったのでこの機会に学ぼうと聴講しました。
スクラムはアジャイル開発手法の1つだそうです。ただし、10名を超えた場合チームを分割するものだとか... そこで、実際にどうやっていらっしゃるのかとお話いただきました。私自身開発の流れだとか、プロジェクトの流れだとかを知らなかったので「自分が入りたい、興味があるものを知らないのダメじゃん！！！」と一人こっそりと思っていました。
それ以外にも色々と株式会社ゆめみさんの事などお話されていらっしゃり、
新しいものが出てきたらとりあえず試して見る空気など素敵だなーと思いました。
スライドには掲載されていませんが、10%ルールという業務時間の10%以内であればどんなことでも時間を使っても良いというルールがあるらしいです。
業務システムでこそ使えるPWA
by 株式会社MOONGIFT 中津川さん
PWAとは？
Progressive Web App の略。
Googleが絶賛推奨中のWebアプリケーションをよりネイティブアプリ風、高機能にするための技術、テクニックの総称のこと。
一定の位置技術を指し示すキーワードではありません。
いかにユーザーのことを考えるか？といった点が大事なのかなと。〇〇しなければならないと考えることが多いですが、そのしなくてはならないことは本当にユーザーのことを考えているのか？踏まえた上で取り組むべきだと感じました。
タイポグラフィ ベーシック
by 株式会社キテレツ カイトさん
タイポグラフィ とは？ 文字を読みやすくするため、あるいは魅せるための技術。
文字を読みやすくするためには？という話を中心にお話いただきました。
私は普段チラシを作ったりしているので、文字を詰めるコツなどあるのなら一度プロの話を聞いてみたいなと思って聴講しました。ある程度まとめて調整できる機能があるとは知りませんでした。
フロントエンドで作る理由
by 株式会社chatbox 後藤さん
フロントエンドで作っていこう、とお話いただきました。
Vue.jsやNuxt.jsなどの技術を色々とご紹介してもらって、なるほど、こういうメリットがあるのかと感じました。個人的にはLaravel + Vue.jsの組み合わせを後々試してみたいなと思っています。
Vue.jsのとっつきやすさ、学びやすさは最高レベルという説明で心がグッと惹かれました。chatboxさんで勉強会などされていらっしゃる（Lec Cafeというイベントを開催されている）ので色々参加しようと思いました。
実はすでに一つイベントに参加予定なので今後も色々と参加しようと思っています。
以上でFRONTEND CONFERENCE 2018の勉強会メモを終わります。
公開するまでに一週間時間を要した上に大したことは書けていませんが、なんとか書けて良かったです。
間違いなど多々あるかと思いますので、その時は教えていただければ幸いです。
