Frontrend × Bonfire Frontend 開催レポート

WRITER: Ueni
このエントリーをはてなブックマークに追加

こんにちは！アメーバブログでWebフロントエンド開発をしている上西です。

今回は2019年4月15日（月）に開催された「Frontrend × Bonfire Frontend」の開催レポートをお届けします！

Frontrend × Bonfire Frontend とは

会場の様子
会場の様子

 

Frontrend × Bonfire Frontendは、サイバーエージェントのFrontrendとヤフーのBonfire Frontendがコラボして誕生したWebフロントエンドに関する勉強会/交流会イベントです。

初めてのコラボとなった今回ですが、ありがたいことに大変多くの方々に関心を持っていただき、定員93人に対して260人を超える応募をいただきました。会場は弊社新オフィスのAbema Towersでした。

今回のテーマは「新しい挑戦と学び」。両社の1年目からベテランまで計4人が、直近の挑戦をそれぞれの視点で振り返りました。

イベント当日は会場の様子がライブ配信されました。配信のアーカイブは以下からご覧いただけます。

Frontrend × Bonfire Frontend 配信アーカイブ

発表概要

それではここからは、各発表の概要をご紹介します！

AbemaTV 新卒1年目エンジニア実録

野口 直寛 @nodaguti / 株式会社AbemaTV 開発本部

発表する野口 直寛
野口 直寛

 

2018年4月に新卒入社し、研修を経て5月にAbemaTVへ配属されたエンジニアが、1年間をどのように駆け抜けてきたかについてのお話でした。

  1. 1年目エンジニア実録
    1. この1年間で1日平均400行くらい書いてきた
    2. 新卒研修でテストカバレッジ99%を達成した話
    3. 配属後は小さな機能から大きな機能まで実装を経験し、通常の機能なら独力で実装できそうという気持ちに
    4. 原因と施策を考え、実装するサイクルを始めた
    5. Chrome Dev Summit 参加（レポート : Chrome チームの推すこれからくる新しい Web API）
    6. 「学生エンジニア」から「事業プロダクトを作るプロのエンジニア」として成長することができた
  2. 2年目に向けて
    1. 今のところ考えているキャリアパスはテックリード
    2. パフォーマンスなどの改善が事業にどう影響するかを示して機能追加と同じ優先度でアプリケーション改善を行えるような「技術から事業に貢献できるエンジニア」になりたい
    3. ここまで成長できたのは、隔週の1on1や四半期ごとにOKRを決める目標管理、適切に引っ張ってくれたトレーナーなど、手厚いサポートがあったおかげ

こえのブログでのPWA 〜開発現場編〜

原 一成 @herablog / 株式会社サイバーエージェント メディア統括本部

発表する原 一成
原 一成

 

こえのブログはアメブロに追加された音声配信機能です。本セッションでは、新機能開発における技術選定、開発フローやドキュメント作成など「開発現場」に焦点を当てたお話をしていただきました。

関連ブログ: アメブロ2019: こえのブログでのPWA

  1. 新卒12年目
    1. 2008年、スタイリング要素の強いマークアップでフィーチャーフォン向けのサイトを作成したり、IE6だけで起きる表示崩れに対してパッチを当てたり
    2. 2010年、HTML5のテクニックでWebアプリケーションに近いものを作るように
    3. 2011年、初めてNode.jsに触れ、サーバーサイドも触るように
    4. 2016年、アメブロのフロントエンドシステムを刷新
    5. 2018年、CDNのキャッシュ機能を使ってサーバーサイドレンダリングに特化したアプリケーションを作成
    6. 2019年、こえのブログを作成
  2. こえのブログ
    1. モバイルが普及した現代におけるブログのコンテンツ価値を向上する方法の一つとして、ブロガーの声でコンテンツを提供する音声配信機能をリリース
    2. CSRの弱点に対応するために、PRPLパターンとCDNを活用した
    3. Web Components with LitElement
    4. 試行錯誤を繰り返すアプリケーションでは捨てやすさが特に大事「捨てやすさ > 再利用性」
    5. データ量削減を目的に、WebAssemblyを利用してクライアント上で音声をwav形式からmp3形式に変換
  3. 開発フロー
    1. 細かい粒度でプルリクエストを作成し、違ったらどんどん直す方針で開発 → 社内で「餅つき開発」と呼ばれるように
    2. Firebaseをフル活用して仕様が決まる前からプロトタイプを作成、結果的に品質の向上に寄与した
    3. アクセシビリティもアプリケーション品質のひとつと定義し、Ameba Accessibility Guidelinesに則って開発した
    4. システム性能の劣化に気付いて対策を練られるように、Performance Budgetを設定した
    5. 社内のプロダクトにOSSの良いところを持ち込むために、ドキュメントの配備や開発フローに気を配っている → 「体験してみたい方はぜひサイバーエージェントに入社してください」

新卒3年目、ヤフーで学んだ2年間を振り返る / Webフロントエンド&デザインで学んだ2年間を総括

濱田 唯 / ヤフー株式会社 メディアカンパニー マーケティングソリューションズ統括本部
内藤 秀彦 @innovate_7110 / ヤフー株式会社 ショピング統括本部

こちらの2セッションの発表概要は、ヤフー様のブログで詳しく書いていただきます！ぜひご覧ください！

私たち、来月もう一度コラボします！

Frontrend × Bonfire Frontendでコラボしたサイバーエージェントとヤフーが、5/18（土）に「Inside Frontend」で再びコラボします！

Inside Frontend 開催概要

 

以下の通り、Frontrend × Bonfire Frontendとはまた違ったスペシャルなイベントです。

  • 公募から厳選されたスペシャリストたちによる講演
  • 海外からお招きするゲストスピーカーによる講演
  • 特定のテーマについてブースのオーナーと話ができるAMA形式のセッション

残念ながら今回会場にお越しになれなかった方も、ぜひこちらへの参加をご検討ください！

最後に

おかげさまでFrontrend × Bonfire Frontendも大盛況のうちに幕を閉じました。

今回は特別なコラボでしたが、FrontrendもBonfire Frontendも、知識の共有や参加者同士の技術交流の場として今後も継続して開催していく予定です。もしかしたら、またいつか再びコラボする日が来るかもしれません。

今後開催されるイベントで、皆様とお会いできることを楽しみにしております！

ドメインモデリングワークショップに参加してみた
次の記事
Stackdriver Trace (OpenCensus)を導入してみた
前の記事