Frontend Conference Fukuoka 2019に行ってきました 各種まとめ
フロントエンドカンファレンス福岡に参加してきましたので、ちょっとしたセッションの感想と、公開されている登壇資料のまとめおば。
久しぶりにnoteレポート芸人の活躍ができる・・・
会場は九州産業大学でした（会場提供ありがとうございます）
私は大学を出ていないので、大学に入るたびにちょっとワクワクします。
セッションはルームA、ルームB、ハンズオンがルームCという形で行われておりました。私は終始ルームAにおりました！
便利質問ツールslido
当日のセッションへの質問はsli.doを使ってセッション中に質問を随時回収。
マイクの受け渡しや、シャイが故に質問がないなどの回避が行われていて、非常にスムーズでした。
セッション１
HTML Optimization for Web Performance
株式会社メルペイ 泉水さん(Twitter)のセッション
ページ高速化（最適化）するのにできることって、まずはHTMLだよね
という内容で進められて行き、クリティカルレンダリングパスの理解、JSの読み込みとCSSOMの関係性、UXを測るためのページ表示の指標、CSSの読み込み位置、JSの読み込み位置などHTMLの雛形、計測ツールなどの説明をいただきました。
印象的だったのは、昨今のようにCSSを一本にまとめなくても、10本位だったら管理しやすい分けたCSSの読み込みでもいいんじゃないか？という話でした。
最後に泉水さんの書かれた著書を
セッション2
世界を変えるためのデザインシステム
freee株式会社の山本さん（Twitter）のセッション
もともとfreeeでエンジニア（バック・フロント・なんでも）をされていたところからデザインシステム「Vibes」をご自身で構築、やりきるためにUXデザインチームに内部向け転職エントリ（！？）も書いて異動されたそうです！
デザイナーの一貫性の担保や、それをエンジニアが爆速で再現できる環境があるのはやっぱりサービスを提供する組織にとって必要な要素ですよね。
でも、プロジェクトによってはこのシステムが採用されないパターンもあるそうなので、そこ質問すればよかったなと・・・
また、freeeには全盲のエンジニアの方もいらっしゃって、アクセシビリティに相当に力を注いでいるのも伺えました
セッション3
チームラボのフロントエンドアーキテクチャ
チームラボ株式会社の田村さん(Twitter)のセッション
スポンサーセッションでしたが、メディアアートのイメージが強いチームラボの受託案件の説明やフロントエンドアーキテクチャの採用の話が伺えました！
2018年に新卒入社されて、もうこういう場所で登壇なさってるとかすごい。アーキテクチャ採用の技術的な話が中心で（Pugを使うのにgulpじゃなくてWebpackで導入する話とか）、導入時つまづいたポイントなどのお話でした。percel推し！
セッション4
デザイナーにエンジニアから10の質問
今回のゴールドスポンサーである 株式会社ディーゼロの
デザイナー新津さん
エンジニア平尾さん
のお二人による対話式のセッション
質問だったので代わりに平尾さんのnote記事を
溝が生まれがちなデザイナーとエンジニアの間を質問形式で、ブートストラップじゃだめんなん？なんでそんなデザインにしたの？エンジニアに聞きたいことある？というような質問で埋めていくセッションでした。
お互いを尊重し合っている姿勢が垣間見れて良い組織のように感じました
オフィスおしゃれだし！実績多数だし！
https://www.d-zero.co.jp/
セッション5
Visual Regression Testing in Action
自称無職の倉見さん(GitHub)のセッション
前提知識が皆無だったので「えっとこれは構築したUIが描画されたものを画像で比較確認とるっていう話なんだよな？」とぼんやりマインドセットしてきいていたのですが
えっとこれは画像の？
おっ走ったこれで画像をみくら・・・べ？
ん？
と細かい技術の話が続き、難解な内容で私印のロースペックCPU(脳）ではちょっとコメントができません・・・
ただUI実装したのち、それをviewで確認するという作業を省かずやりましょうということは伝わりました！！（雑）
セッション6
音楽、数学、タイポグラフィ
株式会社シフトブレイン 鈴木さんのセッション
登壇資料は公開されていませんが、内容はこちらのブログに
資料公開されました！
明らかにタイトルが異質ですが、とても楽しみにしていました。
まずタイポグラフィとは何かを示されていて、よく誤解されるのはgoogleでタイポグラフィと検索するとでてくるレタリングのような飾り文字のことを指しているパターンだと。
アートの領域やデザイナーの出番に感じるが、実際のタイポグラフィというのはこういうことであると。
.text{
line-height:1.5rem;
margin-bottom:2rem;
}html/css コーディングをしていると出てくるなんの変哲もない指定ですが、これこそがまさにタイポグラフィであるということでした。
そして、本題は「人は何を美しいと感じるのか（調和）を歴史から学び取る」ために、音楽の比率から調和するタイポグラフィを紡ぎだそうという試みでした。
質問はバリアブルフォントになったらどうすべきか？
Dark Modeにした時に見た目上このルールから外れて感覚で調整すべきか？
文字のウェイトにもこれらの比率が用いられるものなのか？
と飛び、まだ数字だけで全てを定義というのは難しい様子でしたが、ベースとなる考え方、なにに美しさを学び取るのかという話においてはとても有意義でありました。やっぱ4ベース8ベース強い。
ルームBまとめ一覧
見られなかったルームBのセッションです
セッション1 歴史から学ぶ現代のフロントエンド
サイボウズ株式会社 外松さん
セッション2 フロントエンドにおけるアーキテクチャとの向きあい方
日本事務器株式会社 甲斐田さん
セッション3 明日からはじめるテストのあるフロントエンド開発
サイボウズ株式会社 向井さん
セッション4 SPAについてとVSCodeの実装について
株式会社Groovenauts 花田 さん
セッション5 JavaScriptの読み込みを考える〜場所、async、defer、その仕組みと使い所〜
株式会社オミカレの前川さん
ルームAセッション1の泉水さんは </body>前でしたが（deferの話も)
前川さんは<head>内でasync defer、案件によってという所見でした。
うーん。非同期読み込みを考えると確かにと思う。ケースバイケースですね。この辺の選定の知識やバランスが養えるといいのだけど・・・
セッション6 ウェブフォント今昔物語
株式会社FOLIO 大木さん
セッション7 これからのフロントエンドセキュリティ
株式会社セキュアスカイ・テクノロジー 長谷川さん
終わりに
HTML5 Conferenceでもそうですが、技術的な話になるとやっぱり一気についていけなくなる感じがあって、自分がいかになにも知らないかというのが毎回思い知らされます。自分なりに学ぼうと色々読むのですが、全然リテラシーが溜まっていく感じがしない・・
もちろん聞いてすぐ実装でき、体感できるものもあるのですが。
こういう技術について触れる時に、脳が情報取得を断絶してしまう仕組みたいなのを探求したいなと思いました（違）
登壇者のみなさま発表ならびに資料提供ありがとうございます、主催、ボランティアのみなさま貴重な経験をありがとうございました！！
なお、前夜祭でLTもおこなわれておりますので、Twitter #fec_fukuokaもご覧になられるとよろしいかと思います
よければサポートお願いします！ いいねも大歓迎！