• Event
  • Frontend

【イベントレポート】フロントエンドのリアルな課題に向き合う【第10回Tech LT会】

tags
frontend
author
category
event
frontend
mainImage
20231136.png
publishedAt
May 28, 2024
published
published
slug
tech-lt-20240424
authorDisplayName
PR
notion image
 
こんにちは!令和トラベル エンジニアリング部です。
 
この記事では、2024年4月24日にオンライン・オフラインのハイブリッドで開催された、第10回LT会の様子をご紹介します!
 

Tech LT会とは

令和トラベルのエンジニアリングチームは『あたらしい旅行を、デザインする。』というミッションのもと、日々多くの課題を解き続けています。仕事に取り組む中で得た個々の知見をチーム全体に還元し、みんなで学び、成長するために、私たちは毎月Tech LT会を開催しています。
 
今回のLT会では”フロントエンドのリアルな課題に向き合う”と題し、社内の2名のフロントエンドエンジニアに加え、令和トラベルでPP(プロパートナー)として参画している@yosuke_furukawaさん、社外からの特別ゲストとして@Quramyさんにご登壇いただきました。
 
※PP(プロパートナー):令和トラベルでは、業務委託として事業の一端を担っているメンバーを「プロパートナー」と呼称しています。
 

社内エンジニアの発表内容

  1. Vercel AI SDK 触ってみた (松井 / @ippo_012
  1. Next.jsとTurborepoで挑む!マイクロフロントエンドのリアル(松本 / @_yamatsum
 

1. Vercel AI SDK 触ってみた 

LT1人目の松井からは、Vercelが提供しているAIを活用したユーザーインターフェースの構築に役立つツールのVercel AI SDKについて話がありました。
主なトピックスは以下になります。
  • プレーンテキストだけでなくカスタマイズしたUIをレンダリングできるGenerative UI
  • 各種LLMをして呼び出すためのインターフェースであるAI Core (experimental)
発表資料全体はこちら!
notion image
notion image
 
 

2. Next.jsとTurborepoで挑む!マイクロフロントエンドのリアル

続いて松本からは、マイクロフロントエンドをNEWTに実践した実例を紹介しました。
主なトピックスは以下になります。
  • iframeを利用した水平分割と、Next.jsのrewriteとbasePathを駆使した垂直分割の例
  • プロジェクトごとに独立した開発と、小さなデプロイが実現できる一方で、マイクロフロントエンド特有の課題が発生するので、その対処方法
発表資料全体はこちら!
 
notion image
notion image
 
 

ゲストの発表内容

  1. Node.js v22で変わること(@yosuke_furukawaさん)
  1. GraphQLとFragment Colocation(@Quramyさん)
 

1. Node.js v22で変わること

一般社団法人Japan Node.js Association 代表理事であり、令和トラベルにもPPとして参画いただいている古川さんより、Node.js v22の変更点について話していただきました。
主なトピックスは以下になります。
  • CJS から ESM が読めるようになったこと
  • node --run が使えるようになったこと
  • v8 の新しいシステムについて
発表資料全体はこちら!
notion image
 

2. GraphQLとFragment Colocation

TypeScript / React.js / GraphQL などを利用したアプリケーション開発に携わっている、WebフロントエンジニアのQuramyさんからは、GraphQLに関するお話をしていただきました。
主なトピックスは以下になります。
  • GraphQL使っているのにFragment Compositionしないのは損
  • フロントエンドのデータフェッチの方法について、パフォーマンスとDeveloper Experienceはトレードオフの関係になる。これを解決できるのがFragment Composition
  • 実装の例とチェック観点の紹介
  • バッドスメルの紹介
発表資料全体はこちら
notion image
 
 
当日の様子や発表内容を見たいという方は、こちらから視聴可能です!ぜひ詳細が気になった方は、Youtubeにて動画をご確認ください👀
 

懇親パートの紹介

発表後には、毎回恒例の懇親会を令和トラベルオフィスで開催しました。
オフライン参加者を迎え、登壇者への質問やエンジニア同士の交流が行われ、知識やアイデアを共有する場となりました。オフィスまで直接お越しいただいた皆様にとって、満足度も高く、充実したひとときとなりました。
今回もたくさんの交流が生まれていました!
今回もたくさんの交流が生まれていました!
アルコールとソフトドリンクも毎回ご用意してます
アルコールとソフトドリンクも毎回ご用意してます
 

まとめ

当日は悪天候にもかかわらず、オフライン・オンラインともにたくさんの方にご参加いただき、今回も無事にイベントを終えることができました!
 
今回のLT会で登壇した松井と松本にそれぞれ感想を聞いてみたところ…
松井:
「雨の中お越しいただきありがとうございました。技術顧問の古川さん、くらみさんの豪華ゲストがいらっしゃったので個人的にもとても学びがありました。次回以降も様々な企画を考えているので、ぜひご参加ください!」
松本:
「NEWTのフロントエンドのリアルを知ってもらって、少しでも興味を持ってもらえていたら嬉しいです!古川さん、くらみさんありがとうございました!」
とのことでした!
登壇お疲れさまでした!(左:松井、右:松本)
登壇お疲れさまでした!(左:松井、右:松本)
 

5月LT会のテーマ、エンジニアリングマネジメント!

令和トラベルでは、このように技術的な知識や知見・成果を共有するLT会を毎月実施しています。発表テーマや令和トラベルに興味をお持ちいただいた方は、誰でも気軽に参加いただけます。
次回は、「プロダクト進化を加速させるエンジニアリングマネジメント」をテーマに、社内のVPoEとEMが登壇予定です。また、今回は2枠を公募枠として、外部の登壇者をお招きします!
 
オフィスとオンラインのハイブリット開催となりますので、ぜひご参加ください!
 
 

令和トラベルでは一緒に働く仲間を募集しています

この記事を読んで会社やプロダクトについて興味をお持ちいただけましたら、ご連絡お待ちしています!フランクに話だけでも聞きたいという方は、カジュアル面談も実施できますので、お気軽にお声がけください。
 
 
 
今後も定期的に、令和トラベルの技術や組織に関する情報を発信するイベントを開催予定です。connpass のメンバー登録をしていただき、最新情報をお見逃しなく!
 
それでは次回のブログもお楽しみに!Have a nice trip!!