オープンエイト プロダクト開発部の有田です。
2021年4月、Japan Node.js Association などでも活動されている古川陽介さんがオープンエイトの技術顧問に就任されました。
この記事は、就任にあわせて古川さんが過去に発表された「エンジニアになる覚悟」を現在のフロントエンドエンジニアの周辺環境や、オープンエイトの技術スタックなども踏まえて社内勉強会での発表をお願いし、先日社内で実施された勉強会の内容についてご紹介させていただきます。
当日の資料は SpeakerDeck で公開していただいているので、本記事と合わせてお楽しみください。
フロントエンドエンジニアはUX(ユーザー体験)を向上するエンジニア
勉強会の導入として、フロントエンドエンジニアとはどんな人なのか、なぜ必要とされているのかについてお話しいただきました。
フロントエンドエンジニアという職種はそれほど歴史が長くなく、ここ数年でよく聞くようになった印象がありますが、それはここ数年のデバイスの進化や、それに付随して求められるようになった UI/UX の変化も要因になっていて、今日では「UXを向上する」という役割を担う人としてフロントエンドエンジニアが求められているというお話しでした。
UX を向上するために必要なこと
UX を向上するエンジニアという理解の上で、具体的に求められることはどのような知識や行動かについて、当日の勉強会では「ブラウザの体験を壊さない」「ブラウザとサーバについて知る」という2つのテーマで深堀していただきました。
ブラウザの体験を壊さない
ブラウザの体験を壊さないというと難しく考えてしまいますが、例としては更新、戻る、進むなどのブラウザの機能や、アドレスバーに表示された URL、フォーム入力時に Enter キーが入力されたときの挙動など、普段ブラウザを使っていて自然と利用する機能についてお話しいただきました。
ここでは例として、検索結果のような一覧性のある画面で複数ページにまたがるような表示があった際に、3ページ目を表示した状態でブラウザの戻るボタンをクリックしたとき、2ページに戻ると期待していたのに検索フォームに戻されてしまうようなケースをあげられていました。
ブラウザとサーバについて知る
常に変化し続けているフロントエンド関連技術ですが、Web アプリケーションはブラウザや JavaScript だけで成り立つことは少なく、サーバとのやりとりがほぼ確実に発生します。 そのため、UX を向上させるにはブラウザなどのフロントエンドに関連する知識とあわせて、サーバについても理解が必要になります。
ブラウザについて
フロントエンドエンジニア向けの発表ということもあり、おさらい的なものではありましたが、HTML などのリソース読み込みやレンダリングなど、画面表示までの基本的な動きについてあらためて紹介していただき、Web アプリのパフォーマンス指標としてよく利用される First Paint などの指標や、DOM と JavaScript の関連性についてもご説明いただきました。
サーバについて
サーバについては、フロントエンド開発では API の呼び出しなどで使用している HTTP(S) リクエスト・レスポンスがどのような手順や通信の上で成り立っているかを、普段サーバサイドやインフラからは少し縁遠いエンジニアでもイメージできるよう、DNS ルックアップ、TCP や HTTP(S) などについて図を交えてご説明いただき、自然に利用している通信処理は多くの手順や通信によって成り立っていることがわかるような内容となっていました。
フロントエンドエンジニアとしての心構え
フロントエンドエンジニアに求められる知識などについてのお話しいただいたあとには、古川さんのキャリアやこれまでのご経験をふまえて、日頃意識されている「知識に垣根を作らない」と「継続する」についてお話しいただきました。
「知識に垣根を作らない」については勉強会をお願いしたきっかけのひとつとなった「エンジニアになる覚悟」でも紹介されていましたが、フロントエンドエンジニアであっても、バックエンドや運用などに好奇心をもって取り組み、フロントエンドの知識を軸にしてスキルを広げていくことの面白さについて、「継続する」については技術や周辺環境の変化が激しいフロントエンドのエンジニアリングを学び続けるために「楽しむ」ことの大切さについてお話しいただきました。
射撃しつつ前進
最後に、プライバシ保護の対応や HTTP/3 のようなネットワークレイヤの変化など、フロントエンドエンジニア的には激動の時代が来ているなかで求められる素養は「変化を楽しみながら、時に苦しみながらも前に進む」ことを理解すること。というまとめの後に、Joel on Software の一節である「射撃しつつ前進」をご紹介いただき、発表は終了しました。
まとめ
最新のフレームワークや考え方、セキュリティやプライバシなどの周辺環境についても気を配りつつ、UX を向上させることが求められるフロントエンドエンジニアのキャリアは覚悟も求められる職種ではありますが、楽しみ・苦しみながらも前に進めるよう、技術顧問の古川さんにサポートいただきながら進んでいきたいと思います。
