プレゼンスライド公開！リクルート × BASE × バイセル 【第1回フロントエンド勉強会】React & GraphQLを開催しました！
2023年3月15日、株式会社BuySell Technologies（以下、バイセル）本社オフィスにて、株式会社リクルート、BASE株式会社との第1回フロントエンド勉強会を開催しました！
今回はその模様をレポートします！
オープニング
吉森 健成（よしもり・けんせい）
2023年1月に株式会社BuySell Technologiesへ入社。CTO室に所属し、技術広報とエンジニア育成を担当。
今回の勉強会は、2月末に完成したばかりの新オフィス「TECH STUDIO」にて開催されました！
新オフィスの様子はこちらの記事で紹介しています。
オープニングはバイセルCTO室 の吉森さんが進行。本日の概要などをお伝えしました。
イベント当日の感想はTwitterのハッシュタグ「 #BuySell_FE 」にて投稿されています！ ぜひ本記事と合わせてご覧ください。
また、バイセルの技術Twitterアカウント（ @Buysell_Dev）もぜひフォローをお願いします！
「React コンポーネント設計」 金子 直人さん（株式会社BuySell Technologies）
金子 直人（かねこ・なおと）
2022年6月に株式会社BuySell Technologiesへ入社。リユース事業の基幹システム開発に従事。 以前はフロントエンドのみならずバックエンドやインフラなど幅広い領域を担当していたが、近年フロントエンド一本に転向。Reactが好きで、最近はReactとGraphQLを用いた開発に多く携わる。
まず最初のセッションは、バイセルでテックリードを務める金子さん。
複雑度の高いReactのコンポーネント設計手法について実例をふまえて紹介。「コンポーネント分割」→「ツリー図」→「IF設計」という流れで段階的に設計する方法をお話しいただきました。
▼金子さんの登壇資料はこちら！
「カート UI のフォーカスを可視化する」rryさん（BASE株式会社）
rry（りりぃ）
SIer -> Web デザイン受託 -> 自社 Web サービス開発 という流れでエンジニアに。マークアップ出身 Rails 育ちで主に Ruby / Vue 界隈でわいわいしている。前職は STORES EC のバックエンドエンジニア。 2021年4月より BASE株式会社へフロントエンドエンジニアとして入社。VueもReactもどちらも好きだが、最近ではフロントエンドよりもバックエンドを書く機会のほうが多い。
次に発表されたのは、BASE株式会社にてフロントエンドエンジニアを務めるrryさん。
カート UI のフォーカスの可視化をするにあたり、どのように進めていったかを発表。実際にフォーカスの可視化を行う上で大変だった点についてお話しいただきました。少しずつアクセシビリティを進められているそうです。
▼rryさんの登壇資料はこちら！
「GraphQLにおけるクライアントキャッシュ戦略」早瀬 和輝さん（株式会社BuySell Technologies）
早瀬 和輝（はやせ・かずき）
リユースプラットフォーム：出品管理システム・フロントエンドエンジニア。
2021年に株式会社BuySell Technologiesへ新卒で入社。リユース事業の基幹システムや商品撮影アプリの開発に従事し、iOSからインフラまで幅広く担当。現在はフロントエンドエンジニアとして、リユースプラットフォームの出品管理システムの開発を担当。アーキテクチャや設計について考えるのが好き。
続いて、バイセル早瀬さんの発表。
GraphQLのクライアントライブラリには強力なキャッシュ機構が備わっており、活用することでアプリケーションのパフォーマンスを向上させられるという話とともに、具体的な方法としてページ単位でのキャッシュの最適化と、データを3種類に分類するという2つのアプローチを紹介されました。
▼早瀬さんの登壇資料はこちら！
「GraphQL Gateway を実質無料で手に入れる」和田 祐汰さん (@ywada526)（株式会社リクルート）
和田 祐汰（わだ・ゆうた）
スタディサプリのウェブエンジニア (backend 8 : frontend 2 くらい)
2018 年からスタディサプリの開発に携わる。主に新規サービスの開発に従事。TypeScript, Node.js, Prisma, React, GraphQL あたりの技術に親しんでいる。プライベートでは最近子供が生まれ、育児と仕事で生活の9割が構成されている。
最後に、スタディサプリの開発をしている、株式会社リクルートの和田さん。
通信が複雑になることからフロントエンドエンジニアはマイクロサービスに消極的になりやすいという仮説があるそうです。
この通信の複雑さを解決するアーキテクチャとして GraphQL Gateway パターンを紹介されました。更に GraphQL Gateway Framework を利用することで Gateway の開発を低コストに抑えられることをお話しいただきました。
▼和田さんの登壇資料はこちら！
発表の後はオフラインならではの懇親会で交流
登壇者の発表が終わった後は、オフラインならではの懇親会で参加者同士の交流を深めました！
参加者に行ったアンケートでも「他社のエンジニアの方々と交流できて楽しかった」「同じような課題を持つ参加者が揃っていたので、懇親会の時間がもっと欲しかった」と大変好評でした。
今後も継続的に勉強会を実施していきます！
バイセルでは、今後もフロントエンドやバックエンドの技術勉強会を実施していきます！
次回の日程が決まりましたらconnpassやTwitter等でお知らせしますので、ぜひアカウントをフォローしていただけますと幸いです。
新しい快適なオフィスで一緒に働く仲間も引き続き募集中です！
この記事が気に入ったらサポートをしてみませんか？