エイチーム × レバレジーズフロントエンド勉強会を開催しました

エイチームグループの子会社のエイチームライフデザインでフロントエンドエンジニアをしております、小堀輝(@anneau)です。

少し前になりますが、3/24 にエイチームとレバレジーズ株式会社様でフロントエンド勉強会を開催しました。
本記事では、弊社の発表を振り返りつつ、私の感想も付け加えてご紹介したいと思います。

ビギナー向けエッジランタイムのすすめ | エッジランタイムを意識した開発をはじめよう

変化の大きいフロントエンド領域ですが、昨今、Next.js や Remix をはじめとして、色々なライブラリやフレームワークがエッジコンピューティングへの対応を進めています。
本セッションでは、そんなエッジコンピューティングを駆使したエイチームのサービス事例やまだ活用されたことがない方向けに手軽なはじめ方をご紹介しました。
これから活用事例が増えてくる領域になるかと思いますので、もし使ったことがないという方は、この機会に是非触ってみてください！

Next.js におけるサーバーサイドアクセスコントロール

@anneauより

資料はこちら

認証・認可を必要とするサービスや AB テスト、IP 制限等、アクセスコントロールを必要とするサービスも多いかと思います。
本セッションでは、アクセスコントロールを Next.js でどのように実現するのかというお話をさせていただきました。
Next.js の Middleware により、エッジサーバー上でアクセスコントロールを行う事例についてもご紹介させていただいておりますので. アクセスコントロール周りでお困りの方は是非チェックして見てください！

Svelte/SvelteKit を採用した理由とその魅力

@oekazumaより

React を用いたアプリケーションが多いエイチームですが、実は一部で Svelte を用いたサービスも展開しています。
最初に採用をした時はエコシステムや日本語のドキュメントも少なく色々な苦労がありましたが、
徐々に採用実績も増え始め、恩恵が得られるようになってきました。
本セッションでは、エイチームでの事例や苦労したこと、得られた恩恵についてご紹介しております！

React Hook Form と Zod を使ったフォーム作りの注意点

@junpai_codeより

React Hook Form と Zod を使うときの注意点 by @junseinagao

最近、React 界隈では人気な 2 つのライブラリ React Hook Form と Zod を組み合わせたエイチームでの事例と注意点を紹介しています。
私自身、この 2 つのライブラリを使ったサービスに携わっておりますが、アップデートが激しく、最新のドキュメントが少ないため、ハマる時が多くあります。
いくつかの注意点をちゃんと理解していれば、スムーズに実装できるかと思いますので、これから採用しよう！という方は是非参考にしてみてください。