フロントエンド開発の設計パターンを整理したかった…(残骸
公開日時:
以下のパターンになると思います。とりあえず、直接 HTML+CSS+JavaScript を使うのをやめようという感じ。 JavaScript フレームワークには全力で依存する。Laravel などを利用しているときは Blade コンポーネントに頼る。
- SSR or SSG
- (SSR or SSG) + script tag
- SPA
SSR or SSG
Form タグの取り扱い以外は SPA とそんなに変わらないはずなので、Next.js なり SolidStart なりを利用して、コンポーネント設計をしつついい感じに開発する。
(SSR or SSG) + script tag
SSR or SSG に一部だけ JavaScript の挙動を組み込むときは直接 JavaScript を作成してもいいかもしれません。 この場合の JavaScript は大体ページ単位で作成する…といいかもしれないですね。 SSR or SSG で一部 JavaScript を使うような場合は大体そういう取り扱いだと思うので。
SPA
SPA は世間で言われている通りコンポーネント設計をしてなんかいい感じにする。
CSS
CSS に関してはいまいち整理しきれてない。Every Layout に準拠したいなぁという気はする。 ただ、Next.js などのフレームワークに上手く Every Layout を適用する方法が整理できてないです。
後語り
フロントエンド周り、大まかな設計指針みたいなものがまとめきれてなくて難しい。
各パターンごとに何かしら作ってまとめてみたいです。