フロントエンド情報共有会議事録 2022/11/07
こんにちは、ラクス フロントエンドチームの亀ノ上です。
弊社ではエンジニアに関わらず、社員の誰でも参加が可能なフロントエンドニュースの共有会を定期的に開いています。
今回は11月7日に行われたフロントエンド情報共有会の議事録を公開します。
Zod気になってるんで軽く話してほしい
メンバーが記事を書いてくれました！
情報共有会で集まったネタをナレッジ化するアプリをシルバーウィーク引きこもって作ってた話
せっかく情報共有会をやっているので、ナレッジ化しようとアプリを作った。
社内で使うときはサブ端末にのせて使う
技術選定
FE: Next.js(CSR)
UI: Chakra UI
データフェッチ: SWR
フォーム: React Hook Form + Zod
API: Next.js(API Routes)
ORM: Prisma
DB: PlanetScale
Next.js + Vercel + Supabase を用いた高速アプリ開発
新卒メンバーが書いた技術ブログ
Twitterでも話題になっていろんな人にみてもらえた
Supabaseは最近のサービスなので知らない人も多いとおもう
<質問>苦労した点はあったか
<執筆者>あんまり苦労していない。すぐに終わった。
<質問>なんでこの記事を書こうと思ったか
<執筆者>先輩社員に相談したら提案してもらった
<先輩社員>ほんとはPrismaもやってもらおうと思ったけど、それだと内容が重すぎると思った。
<質問>費用は？
<執筆者>無料枠あるから問題なかった。さわらないと一週間で無効化される。無効化される前はメールもくるし、軽く触るにはいい。
海外製ライブラリを使用すると、IMEを考慮していないことが原因でのバグが起こることがある
入力中にカンマ等を勝手にいれてくれるライブラリ
半角入力等は問題ないが、テンキーで入力すると二重で入力される。
海外はIME考慮してないことも多いので、IME絡みは注意した方がいいかもしれない。
Qwik
新しいフロントエンドのフレームワーク
Next.jsはハイドレーション遅いのが課題
Qwikはハイドレーションをしないというアプローチ
ユーザーの操作が行われた時にJSを取りに行く
初期表示は早くなる
結局クリックしてからJSをとってパースして…となるのでユーザー操作のタイミングでは動作が遅くなる
作者はAngular作った人。コンセプトはGoogleで使われているフレームワークと一緒
Astroなど、最近は部分的にサーバーからとってくるというのをよく聞く
Astroは部分的にハイドレーションしないという選択肢
参考