概要

今回は、フロントエンドのアーキテクチャ設計の工夫を語り合う会です！
Next.jsやNuxt.jsなどのフレームワークは浸透してきましたが、ディレクトリ構造やレイヤードアーキテクチャには、デファクトスタンダードと呼ばれるものはありません。
特に今回はNext.jsを本番環境で運用してきた4社が集まり、なぜそのようなアーキテクチャ設計なのか？どのような工夫があるのか？と言ったことをディスカッションし合います。
実際のフォルダ構成なども公開しつつ、過去に失敗したポイントや今後このように改善したいという展望なども語っていただきます。

LTテーマ一覧

登壇企業 ：ARアドバンストテクノロジ株式会社

LTタイトル：「ちょうど良い」フロントエンドアーキテクチャを求めて

ARI では、複数のクライアント様向けの Next.js アプリケーション構築から少しずつ知見を得ながら、フロントエンドのアーキテクチャを模索しています。今回は、なるべくシンプルな構成に留めたい方針のもとでの現時点での落とし所を、迷いや悩み、最低限押さえたいと思っていたポイントを含め、共有します。

登壇企業 ：株式会社ゆめみ

LTタイトル：まず Organism より始めよ

React のコンポーネント指向開発について、いくつかの誤解があります。（またはかつてありました。）これらの誤解を解きながら、「一つのコンポーネントが複雑で長大になる」「多くのコードジャンプを要して、全体像をつかみにくい」状況に陥らないためのコツを「ゴチャゴチャ」を引き受ける Container コンポーネントに着目して解説します。

登壇企業 ：株式会社ヘンリー

LTタイトル：React Suspenseを使って遷移体験を向上させる

ReactのSuspenseを使うことでコンポーネントを待機状態にできます。一般的にはローディングに使用されますが、再描画を防ぐ目的で使用することも可能です。本LTでは、Suspenseによる再描画を防ぐ仕組みを提案したReact Freezeというライブラリを解説し、WebアプリにReact Freezeを適用することで、前ページの描画状態を維持しながらページ間遷移を可能にするという話をします。

PharmaX株式会社

LTタイトル：「生活感のある」アーキテクチャ

PharmaXでは現在Refactoringを行なっております。長い間誰も手を加えていないプロジェクトではありますので、影響範囲が見えなかったり、ファイルが探しにくかったり、コードに隠れた仕様があったり、すでに廃棄された仕様だがコードとして残っていてノイズになったり...... 今回はそんな現状の課題を改善するため、ディレクトリー構成やcomponent設計など関する工夫を少し共有したいと思います。

こんな人におすすめ

• フロントエンドのテックリードをされており、アーキテクチャの設計に悩まれている方
• 自社のフロントエンドのアーキテクチャを改善したいと考えられているエンジニアの方
• CTOやテックリードをされていて、フロントエンドのアーキテクチャを改善したいと考えられている方

開催概要

日程：2023年9月27日（水）19:30〜21:00 （10分前から入室可能です）

開催場所：オンライン（Zoom・申込者にURLを後日ご案内します）

開催前日、メールにて視聴URLをお送りしますので必ずご確認ください（※connpassページの「参加者への情報」にも記載します）

タイムテーブル

登壇者プロフィール

ARアドバンストテクノロジ株式会社 BXD第1事業ドメイン クラウドネイティブデザインユニット ビジネスイノベーションサービス部 部長 原田 真裕 様

2012年新卒入社。TypeScript, React, Next.js, Node.js, Laravel など、フロントエンドからサーバサイドまでカバーする Web アプリケーションエンジニア。様々なプロジェクトでコードを書きながら、フロントエンドエンジニア部門のマネジメントにも従事する。

コーポレートサイト

採用ページ

株式会社ゆめみ マーケティングソリューション事業部（フロントエンド）エンジニア honey32 様

京都大学工学部建築学科卒業。2021 年に株式会社ゆめみに入社後、Web フロントエンドエンジニアとして受託開発に携わる。並行して「React 博士」（領域を限定したテックリード）として、コードレビューによる技術支援を行っている。技術記事を通して React のアーキテクチャへの理解を深める活動を行なっている。 https://www.bearwapps.com/

コーポレートサイト

採用ページ

株式会社ヘンリー 電子カルテチーム Webエンジニア 小林 直樹 様

筑波大学情報メディア創成学類卒業。2018年、新卒でウォンテッドリー株式会社に入社し、サービスのリニューアルや新規事業の開発に携わる。2023年6月に株式会社ヘンリーに入社。現在は、電子カルテの開発を行いつつ、フロントエンドの基盤改善やチームのプロジェクトマネジメントに従事。 https://www.wantedly.com/id/kobayang

コーポレートサイト

採用ページ

PharmaX株式会社 取締役・エンジニアリング責任者 上野 彰大

東京大学農学生命科学研究科卒業。大阪府堺市出身。新卒でIGPI（経営共創基盤）に入社し、2018年12月にPharmaX株式会社（旧・株式会社YOJO Technologies）を共同創業。全社戦略、エンジニアリング責任者。趣味でエンジニアリング勉強会を数年続けている。得意なのは、統計、機械学習、データ分析。

コーポレートサイト

採用ページ

PharmaX株式会社 エンジニア Jiaxin Cai

2013年に留学で来日。 web APPやRPAエンジニアを経て、2021年からヘルスケア業界に関わり始める。 2023年7月からPharmaXに参画し、今は主にフロントエンドとアーキテクチャを担当する。

モデレータプロフィール

PharmaX株式会社 エンジニア 古家 大

ニフティ株式会社にてベトナムのオフショア開発のマネジメントを経験後、フリーランスとして独立。ITスタートアップを中心に複数社のサービス開発に携わる。 「医療者と患者さんの日常を繋げたい」という想いが合致し、参画。当社では開発生産性が高く、強いエンジニアリング組織作りにチャレンジ中。

注意事項

• 講演内容やタイムスケジュールは変更となる可能性がございます。

• 当日のイベント内容は後日任意の媒体にて公開させていただくことがあります。

• 万一イベント開催が中止の場合、本サイトからのメッセージよりご連絡させていただきますのでご確認をお願いいたします。

プライバシーポリシー

ARアドバンストテクノロジ株式会社

株式会社ゆめみ

株式会社ヘンリー

PharmaX株式会社

※ご提供いただいた個人情報は、イベントの運営・管理、イベントの改善又は新規企画のための分析、当社および登壇企業の採用情報等のご案内で利用いたします。 また、当該個人情報・内容は、ご本人様の同意を得ずに、登壇企業以外の第三者への提供はいたしません。