先日、Frontend Conference 2019に参加したのでそのレポートを記事にしました。
私自身も本編最後のLightning Talkで発表させていただきました。
概要
2019/11/02 グランフロント大阪にて
- 10:30〜17:50（本編）
- 18:30（懇親会）
参考情報
- wifiはプレミアムチケット購入者のみ提供
- 飲食可
- 休憩ブースあり
- スポンサーブースにて飛び込み発表のアンカンファレンス
- Angular,React,Vue.jsのハンズオン
参加セッション
モダンJavaScript再入門
尾上 洋介さん
JavaScriptのモダンな書き方についてコードを交えての解説
実例と解説がとても丁寧だった。また「モダンJavaScriptを使って良いか」という補足ページがとても良いと思う。JavaScript = 最新のECMAScriptが使える、だと思ってどんどん新しいシンタックスを使ってしまうと特定のブラウザで考慮不足の例外が発生する。快適な開発環境のためにモダンを追求するのではなくてアプリを使うユーザー側の環境も考慮しなきゃいけないよねっていう視点は、当たり前のようでいてまだ暗黙の共通認識までは至っていないと思うので、そのフォローも含めてのモダンJavaScriptの内容紹介だった事が素晴らしいと思った。
ディレクトリ構成ベストプラクティス 〜 Angularアプリを作り続けてわかったこと
okunokentaroさん
7年の実務から見出したディレクトリ構成のベストプラクティスの紹介
この方のセッションを聴くのは2回目になる。話の展開のうまさ、テンポの良さ、紹介する内容の裏側にある説得力、どれを取っても抜群でとにかく愚直に「すごい」と思う。 発表内容で一番心に残っているのは「組織にマッチした答えは判断力を身につける事で磨いて行く、このセッションでのベストプラクティスも組織のベストプラクティスとは限らないが取り入れる事でひとつの判断材料となる」という部分（…そんなニュアンスだったと記憶）。良いディレクトリ構成は良いアプリケーションである、本当にその通りで、次のプロジェクトからすぐに使える実例が聞けて良かった。
レガシーなフロントエンドをリプレイスする
小島大基さん
AngularJSとVue.jsが共存するプロダクトをどのように改善していったのか、技術選定などの話
コンポーネントをテンプレートのレンダリング専用と捉えたところ、いつかコードを捨てる事を意識する、等々、次を見据えてのリプレイス戦略である事がすごいと思った。複雑な画面を後回しにした判断やテストをスキップする勇気もとても参考になった。質疑応答にもあったが、複数人の開発者の中でどうやって話し合って指針をまとめていったのか、その突っ込んだやり取りも次回聞いてみたいと思う。
高齢者でも使えるプロダクトUIの挑戦
神保 嘉秀さん
高齢者向けの問診アプリのUIの難しさと試行錯誤の紹介
場所移動のタイミングを逃してセッションは聴けなかったのでスライドだけ見た。エンジニアが当たり前のように選ぶUIが一部のユーザーにとっては使いこなせないものである事、そしてどんな理由で使いこなせないのか、説明に説得力がある。相当苦労してUIを模索したんだろうと思う。開発者目線でなくアプリを使うユーザー目線に落とし込んでUIを改善していく過程にアプリ開発の原点を見た気がする。
私たちはなぜ SPA で開発するのか
花谷 拓磨さん
何気なく使っているSPAについて本当に必要なのかを再考する話
UX要件とDX要件の視点が新しかった。技術選定がエンジニアのエゴになっていないか、という問いかけには正直にそうなっていたかもなあと反省。品質・速度ではなく、プロダクトとアーキテクチャの規模がマッチしているかを見極める事、アンダーもオーバーも等しく毒になる事、その判断は難しいが目新しいモダンな手法に流されるのではなく、アプリの目的に沿った視点を持つことが大事なんだと教えられた。
フロントエンドエンジニアのためのセキュリティ対策
平野 昌士さん
XSSの具体的な内容と対策例
普段フレームワークに乗っかって開発しているとセキュリティの観点がフレームワーク任せになってしまうので、知らなきゃいけないよねという再認識になった。知識豊富でキャッチアップもたくさんされた上での具体的で正確な対策を紹介していたので、非常にためになる。発表で勧めていた書籍は早速購入した。
LT
脊髄反射でプロダクト作ることの学びとススメ
@scrpgil さん
ひらめきとスピード感あふれる自身で開発したツール紹介
とても面白かったし、開発に使ったツールを紹介してくれたのが嬉しい。真似して小さいツール作ってみたい！という気持ちになった。
Angularはいいぞ！フレームワークにAngularを採用した理由
@ringtail003（自分）
Angularのココがいい！話
エンジニアの方に囲まれて発表するのは2回目の経験。 「大阪という場所柄、用意したポイントで笑ってくれるし登壇者を死んだ魚の目で見ない」という前評判の通り、空気が柔らかかった。後日TwitterとかでAngularちょっと使ってみようかな、なんて感想を言ってくれた方もいて本当に嬉しかった。
TypeScriptでHTTPリクエストを型安全にする方法
@aspidajs さん
自身で開発したaspidaで型安全を実現しJSカーストに食らいつく話
めちゃくちゃ話が楽しくて、会場が笑いの渦だった。この方の登場でLTらしいほぐれた雰囲気に一気に加速した。面白さはさておき、内容はTypeScriptの型安全を披露するデモで、分かりやすさが抜群だった。5分で簡単に説明をしているが、自身でのパッケージ開発に苦戦もしただろうし、純粋にすごいなと思った。
コンポーネント管理の失敗と今後のやっていき
@yahooshiken さん
UIコンポーネントの失敗談とその打開策の話
StoryBookの失敗例はほぼ聞いた事がなかったので、やはりどこにでも落とし穴はあるんだと参考になった。コンポーネント名が共通認識されているか？にはまさに認識していなかったと自覚。LT駆動開発で決意を固めてプロジェクトに取り組むそうで、この心意気に共感した。
Automatic Test for Frontend Side
（スライド非公開のようです）
@woosyume さん
WEBサイトのe2eテストにAIを取り入れて自動化する話
登壇後に少しお話させてもらった。Seleniumは2年くらい前にe2eテストで使った事があるが、その後も進化を遂げていたのを知らなかった。今やWebDriverがブラウザ標準化されてSelenium勉強会も開催されていますよとの事。スライド中で見せてくれた動画でAIが人間と同じように購入ボタンを押してショッピングカートを覗くのが、人力に変わるすごい技術だなと感心した。日本出身ではないという事で「みなさん日本語が上手で…」と恐縮されていたが、聞き取れない箇所もなかったし、とても良い発表だったと思う。
まとめ
発表全体を通して「プロダクトの本来の目的を見据えた技術選定のあり方」という傾向だったように思います。今使っている技術が何をもたらしてくれるのか、そのアーキテクチャは本当に必要なのか、どんな失敗談があるのか、等々…。普段、ネットでスライド単体を見た時は技術名や結果に目が行きがちでそれ以外を補足情報として見てしまうのですが、会場で登壇者の生の声を聞くと全くの逆で「なぜそう考えたのか、なぜそれを選んだのか」を主体として見る事ができます。そこに共感するポイントがあれば自分も取り入れる事ができるし、今悩んでいる技術選定の判断材料にもなる、それがカンファレンス会場に足を運ぶ事の大きな魅力だと思います。
実際、今後新規開発していく上でフロントエンドにどういった設計手法を取り入れたらいいのか悩んでいたので、ディレクトリ構成やSPAの話、コードを捨てる事を前提にする考え方がピンポイントで心に刺さりました。
事前にTwitterやスライドの内容から「この人はすごい…ベテランでドライな人に違いない」と一方的に勝手なイメージを持っていた方もいるのですが、実際に発表を聞いてみるとちょっとはにかんだ表情が見えたりイメージとは真逆の面白い方だったり、親近感を感じられるのもいいですね。LT記念にTシャツいただいたたり、ng-kyotoブースでステッカーもゲットできたので「ヨーシまた仕事頑張ろう！またカンファレンスに来よう！」ってテンションがぐぐーんと上がりました。
また、会場のスタッフの方々に感謝を述べたいと思います。会場内、常に見えるところにスタッフ数名の方が待機されていて「何か困った事はありますか？」「この列はXXXの順番待ちです」等々声をかけていただきました。大きなイベントですのでいろいろなフィードバックがあるかと思いますが、私は感謝しかないです。開会から閉会までほぼ丸一日、気を配って声を掛け続けて帰りはクタクタだったと思います。みなさんの苦労に甘えて、フロントエンドカンファレンス2019、本当に楽しませていただきました。ありがとうございました！