Muddy Web #7 ~Special Edition~ 【ゲスト: 日本経済新聞社】

イベント概要

Muddy WebはMuddy = 泥臭いとして、Webフロントエンドの開発現場における話やケーススタディなど泥臭さのある話をもとに学びを得ることを目的として開催しています。

現場で遭遇した具体的な体験を元に実際に明日から使えるかもしれないWebフロントエンド的な技術や知識を参加者の皆さまと共有し合うことを通して、フロントエンド開発の糧になれればと思います。

7回目となる今回は、日本経済新聞社をゲストに迎えて開催します。

日時/場所について（ハイブリッド開催します！）

今回の Muddy Web はオンライン・オフライン同時開催いたします！

オフラインでご参加いただく場合は、セッション終了後に懇親会を予定しております。セッションでは話しきれなかった内容や、気になることなどぜひ一緒に語らいましょう！

• 開催日：2023年12月12日（火）19:00〜21:30
  ※オフライン参加の方はその後、任意で懇親会にご参加いただけます。
  ※懇親会のみの参加はできません。
  ※勉強会参加を目的とする方のみのご参加をお願いいたします。

• 形式：オフライン/オンライン
  ※オフライン：渋谷スクランブルスクエア 21階
  ※オンライン：YouTube Live 　　　　

• 参加費：無料
  ※オフライン参加の場合、交通費等は自己負担となります。

オフライン参加の申し込みについて

• 申し込み時に必要なアンケートはすべての項目をご回答ください
• アンケートにご回答が無い場合、確認のメールをお送りさせていただく場合があります
• 社会人の方は当日会場でお名刺を頂戴いたしますのでご持参ください
• 学生の方は当日会場で学生証を拝見させていただく場合がございます
• 懇親会のみの参加はできません

当日の進行について

• オフラインでご参加いただく場合 別途、入館方法をお送りいたしますので手順に沿ってご来社ください。
  ※当日、会場にてお名刺または学生証の提示をいただきます。

• オンラインでご参加いただく場合 非公開のYouTube Live視聴URLをお送りいたします。

登壇者・セッション詳細

プライベートクラウドのコンソール画面をNext.jsのApp Routerでフルリプレイスした話

CIUでは、プライベートクラウドのWeb UI開発にNext.jsを用いています。 今回はCIUのフロントエンド組織の現状についてお話した後

• なぜNext.jsを使うのか
• 古いNext.js製サービスをどのようにApp Router化したのか

以上を中心に、CIUのフロントエンド組織の今後の技術戦略などについて、Muddyな内容を織り交ぜながらお話します。

登壇資料・アーカイブ

登壇資料
アーカイブ（Youtube）

Shuta Hirai

2022年新卒。株式会社サイバーエージェント グループIT推進本部 CIU所属。Meguro.es 主催。

最近は卵の特売情報を追うのが趣味。

X：https://twitter.com/did0es　
GitHub：https://github.com/shuta13

Node.js v12 が使われているのはなぁぜなぁぜ？

日経電子版は７年以上前からマイクロフロントエンド構成です。そのうちrnikkeiと呼ばれている最多の世代がNode.js v12で動き続けていました。EOLを迎えたバージョンを使い続けるのはセキュリティー的に良くないので、1年以上かけてv20までバージョンアップを実施しました。

この発表ではv12->v20にあげるまでのつまづきポイントとその解消法、マイクロフロントエンド構成であったからこその辛さと助かったことを紹介し、サービスのメンテナビリティを考慮した設計やチーム構成について考えます。

登壇資料・アーカイブ

アーカイブ（Youtube）

Yuta Ide

日本経済新聞社 エンジニア

外食する日は昼を抜いている

開発から運用まで Muddy に向き合う ABEMA における LP CMS 開発

ABEMA の番組・キャンペーン・コンテンツまとめをお伝えするための LP CMS 開発を行いました。
SSR など SEO 要件から WebView で各ネイティブアプリに展開するためのブラウザサポート対応、ネイティブアプリのバージョン互換性を考えた実装などさまざまな要件がありました。
また、運用の際には運用者からの問い合わせ対応の解決や管理画面でカバーしきれなかった部分の運用カバーなどさまざまなサポートが発生します。
これらにいかに Muddy に向き合ったかをお話します。Muddy な Tips のおもしろさだけでなく、パフォーマンス最適化、アクセシビリティを意識したキーカラーの色調整など広い範囲の Web の事例を伝える機会にできればと思っています。

登壇資料・アーカイブ

登壇資料
アーカイブ（Youtube）

Ryuichi Sakagami

2020 年度に新卒入社後、株式会社AbemaTV に配属。

各種機能開発、Web におけるサービス内回遊を促進するチームのリーダーを経て、「事業成果のためならなんでもやるエンジニア」を標榜して開発中。

X: https://twitter.com/RyuichiSakagami
GitHub: https://github.com/Shagamii

Big “heart” of mud, 10000 lines VCL generated from .vcl.handlebars

日経電子版は創刊から10年以上続く Web サービスです。そんなサービスを開発する中でアプリケーション要件や技術的な情勢の変遷に合わせ技術の刷新, リアーキテクトなども行ってきましたが迂闊に手を出せない部分というのも存在します. その一例としてサービスの心臓部である CDN レイヤーがあげられます.

本トークでは電子版の CDN レイヤーの Muddy な開発や Muddy が故の脆さ, そして Muddy な心臓部と向き合い少しでも地盤を固めていくための Muddy な取り組みについて紹介させていただきます.

登壇資料・アーカイブ

アーカイブ（Youtube）

Shinobu Hayashi/Shinyaigeek

日本経済新聞社 エンジニア

新卒2年目, ひたすら AST いじったり VCL 書いたり VRT 撮ったりしている.

タイムテーブル

注意事項（必ずご確認ください）

• 会場内では、写真や動画撮影が行われる予定のため会場内のお客さまが映り込む場合があります。 それらは、弊社媒体やSNSなどで掲載される場合がありますので、あらかじめご了承ください。

• イベントスタッフは、このイベントに関わる全員が気持ちよく過ごせるように考えています。参加者の皆さまも、ほかの方を不快にさせるような発言・行動は謹んでいただくようご了承のほどお願いいたします。またそのような行動を目にした方は、connpassの「イベントへのお問い合わせ」フォームからお知らせいただくか、会場スタッフにお伝えください。

• 講演の録画および録音は禁止しております。録画した動画、音声などを無断で公開した場合、著作権の侵害となる恐れがあります。

• ブログやSNS等で当イベントに関する発信を行う際は、公序良俗に反する内容のないよう、ご協力をお願いします。

• 悪天候等により、運営事務局の判断にてイベントを中止する場合があります。

• 運営の状況によりスケジュール、内容は変更となる場合があります。

Code of Conduct

株式会社サイバーエージェントが主催する技術イベントには、以下のCode of Conductを適用しております。皆様が歓迎され、安心・安全なイベントとして楽しい時間を過ごせるよう、Code of Conductをぜひご一読いただき、ご協力いただけますよう、よろしくお願いいたします。

CA Tech Events - Code of Conduct

個人情報のお取り扱いについて

主催：株式会社サイバーエージェント

事前・事後アンケート、その他、当イベントを通じて取得した個人情報等の取扱いはプライバシーポリシーに従って取り扱います。

またイベント受付管理や各種ご案内（サービス・イベント・採用等）に利用させていただく場合があります。 ご同意の上、ご参加ください。

株式会社サイバーエージェント プライバシーポリシー：https://www.cyberagent.co.jp/privacy/

免責事項

• 本カンファレンス内において発生した一切の事故や怪我・病気などの責任を負いかねますことをあらかじめご了承ください。
• 貴重品の管理は各自でお願いいたします。万一盗難・紛失等の事故が発生しても、主催者は一切責任を負えません。
• 本カンファレンスから得られた情報により、何らかの損害を負った場合であっても、発表者並びに主催者は一切の責任を負いません。予めご了承ください。