Next.jsを使う必要がない小規模なSPAの最小構成を考えてみた

はじめに React開発におけるNext.jsのプレゼンスが日に日に増している今日この頃ですが、Next.jsを使う必要がない小規模なSPAを作る場合の型が欲しくなり、色々調べて技術選定をした上で実際に作ってみるところまでやったので、その技術選定理由とセットアップ手順を共有したいと思います。 フロントエンドの移り変わりは速いとはいえ、割とホットな技術を選定できたと思うのでしばらくは使っていけそうです（そう思いたい…）。 前提 趣味で小規模なSPAを作る場合を想定 ルーティングなしの単機能アプリ SSRが必要ない モーダルなどの動きのあるUIが必要ない 技術スタック Vite Preact TypeScript Tailwind CSS Cloudflare Pages 技術選定理由 Vite 少し前まではこういうケースではcreate-react-appを使用していましたが、Viteに置き

[remonoil]

最小構成っていうより最小設定な感じ。生のReactではダメなの？

[Rishatang]

「生のCSS書くの大変だからTailwind」って言ってる人たまに見るんだけど、ここで言う大変さというのは具体的に何なんだろ。Tailwindは詳細度問題に悩まされなくて済むだけで後は普通にCSS書くのと同じイメージがあるので

[ultimatebreak]

貧相なHTML、スパゲティ待ったなしなCSS、トランスパイルしないと動かないJS(TS)、これらを動かすブラウザが複数種類あり実装状況がバラバラ。要求の高度化と複雑化にハゲないためにツールの選定に時間を使っている

[highgrenade]

こういう構成を考えるのが嫌な人は、脳死でNext.jsを使っとけば十分だと思う。

[nao-bt]

フロントエンドのフレームワークライブラリーの技術選択の際によくでる「大規模」「小規模」というワードに戸惑いを感じて早数年。未だにその線引わからず。

[miguchi]

“Preact”

[taguch1]

ここらへんの毛刈りの塩梅をつかむのは自分でやってみるしかないんだろうなぁ。めんどくさいなぁ。年末温泉合宿して一気にやるか。

[kinushu]

“Chakra UI”

[programmablekinoko]

hyperappとか2KB以下で滅茶苦茶軽くて良いゾ。何ならコンパイルなしでもいいくらい。まあ最近は努めてSPA使わなくていいなら使わない方向でやっている

[Shinwiki]

根本的なとこがおかしい

[munyaX]

Web開発めんどくさくなったよねぇ（老人感）

[joltkun]

preactって状態管理はどうするのが良いんだろうか…🤔

[hylom]

全然最小ではなかった

[mayumayu_nimolove]

nextから削ると言う手は考えず構成を変えるのか。なるほど。

[razokulover]

あとでやってみよ