Think! FrontEnd #8 開催レポート

サムネイル

はじめに
Think! FrontEnd とは？
研修で学んだリクエスト毎にページのレンダー方法を変える小技
TypeScriptで型レベルJSONパーサー
Marpで学ぶHTML/CSS
パネルディスカッション
懇親会
おわりに

はじめに

こんにちは！「Think! FrontEnd」運営の井内（@pengin_engineer ）です。普段はライブコミュニケーションサービスのフロントエンド開発を担当しつつ、新卒研修や一部の技術イベントの運営にも携わっています。

今回は、先日 9/18(木)に開催された「Think! FrontEnd by DMM #8」について、開催レポートをお届けします。

Think! FrontEnd とは？

「Think! FrontEnd」は、DMM グループのフロントエンドおよび JavaScript における開発現場の【今】を話しながら、皆であらためてフロントエンドや JavaScript のことを考えようという趣旨で立ち上げたコミュニティです。

第8回では新卒回と題し、新卒1年目の方々に登壇していただきました！当日の様子についてはYouTubeにアーカイブがありますので、現地で参加できなかった方はぜひそちらをご覧ください。

youtu.be

研修で学んだリクエスト毎にページのレンダー方法を変える小技

1人目は、LC開発部の一ノ瀬裕斗さん(@dimyasvariant)による登壇でした。

ユーザーアクセスやクローラーなどのリクエストの種類に応じてCSR・SSRを動的に切り替える手法を紹介し、実際の導入事例をもとに、パフォーマンス最適化・SEO改善・リソース効率化を両立させるための実践的な工夫が解説されていました。

speakerdeck.com

Think!Frontend セッション

TypeScriptで型レベルJSONパーサー

2人目は、電子書籍開発部の加藤豪さん(@eraser5th)による登壇でした。

TypeScriptの型レベルでJSON文字列を解析し、型安全なオブジェクト型に変換する“型レベルJSONパーサー”の実装が紹介されています。トークナイザーやパーサの設計、型演算の工夫、テスト戦略などを通じて、型システムだけでJSONを解釈する実践的なアプローチが解説されています。

speakerdeck.com

Think!Frontend セッション

Marpで学ぶHTML/CSS

最後は、DMM TV開発部の平良昂也さん(@__ayanoYuki__)による登壇でした。

MarkdownやHTML/CSSでスライドを作成できるツール「Marp」について解説されています。他ツールとの比較を交えながら、操作の手軽さや拡張性、PPTX出力で起こる問題点とその解決策まで丁寧に紹介されています。

speakerdeck.com

Think!Frontend セッション

パネルディスカッション

登壇セッションの後には、新卒登壇者3名によるパネルディスカッションを実施しました。テーマは「新卒研修の感想」「入社後のキャリアと目標」「各事業部に配属されてみて」など多岐にわたります。 4ヶ月間に及ぶ新卒研修で幅広い技術を学んだ彼らが、配属から1ヶ月半を経て感じたことを、率直かつ和やかに語ってくれました。

"Think!Frontend パネルディスカッション"