Webフロントの個人的にオススメ技術スタック

ここ半年ほどで、自分の中でベストだと思う技術スタックが固まりつつあるので、ざくっと共有をば。

フロントエンドフレームワーク

ほぼ Next.js 一強になりつつあるんじゃないかなという印象です。

確かにややこしい仕様や、小難しい便利機能もたくさんあるため、エンジニアとしての経験の浅い場合にはオススメしづらいのですが。

とはいえフロントエンドとバックエンドの領域を統合しつつも、書くべきスコープが明確に分かれているというのは、保守の観点ではかなり最強だと思います。

バックエンド側を Go や Rust で書かざるを得ないケースを除き、Node の一気通貫で完結してしまう状況は、もはや必然なんじゃないでしょうか。

React の書きっぷりに慣れていないうちは、まずは Vite から勉強していくのが良いとは思いつつ。

最終的には Next.js でゴリゴリ書いていくと、その快適さに気付けるのは時間の問題かなと。

スタイリング

shadcn/ui がなんだかんだで便利だなという印象です。

今でも CSS Modules 自体は好きですが、流石に toB 向けや Web サービスの開発となると、優位性が弱すぎると感じています。

アンチ Tailwind CSS なのは今でも変わっていないですが、そんな感情を上回って補うほどに shadcn のスタイリッシュかつ便利さには、流石に叶わないなと。

Material UI や Chakra UI とは一線を画すレベル感の違いがあり、なによりカスタマイズ性と保守性の観点はかなりの強みかなと思います。

とはいえ、CSS をきちんと理解しないままに Tailwind CSS や shadcn を使用するのは断固反対です。

まずは CSS Modules でしっかり基礎固めをすべきかなと、toC であれば今でも CSS Modules の優位性も強いと思ってはいます。

Linter、Formatter

まだまだ ESLint + Prettier が強いです、一方で Biome の実践投入はもう少し厳しい感じがします。

Biome 自体は軽量で便利なのは間違いなく、個人開発では結構使っているのですが。

規模感が上がってくると、やはり細かい Linter の設定ができないのが辛くなってきます。

結果として、保守性が下がってしまうケースも多そうなので、基本的には ESLint を使うことをオススメします。

インフラ

個人的には Vercel + Cloudflare 推しですが、ここは規模感に依るとも思います。

ただ個人開発だったり、小〜中規模プロジェクトであれば、何ら困ることはないのかなと思いつつ。

AWS とかゴッチャゴチャしすぎてて、個人的には使いたくない気持ちがありつつ。

バックエンド、他

Supabase がかなり強いのかなという印象です。

無料枠も大きいですし、ドキュメントもかなり整備されており、SDK もそこそこ使いやすく、文句らしい文句のつけようがない印象です。

以前 AWS を始めとし、Firebase あたりが追従しており、もう少し時代が進むと Neon や PlanetScale あたりが多少来ていた感じも受けましたが。

Supabase に慣れてしまうと、よほど大規模な開発でない限り、他の選択肢を取ろうという気持ちにはなれないなぁと。

オールインワンのくせに使いやすいって、結構異常です、かなり考えられて作られているなと。

ただし SDK の一部で融通が利きづらいところがあるのも事実で、何よりもパフォーマンス命！みたいなプロジェクトでは要件を満たせない可能性もあると思います。

とはいえ、大体のケースでは Supabase で完結するレベルだと思います。

デスクトップアプリ

Electron か Tauri かという感じです、どちらも一長一短かなと。

楽したいなら Electron、パフォーマンスを重視したいなら Tauri なんですが、意外と Tauri だと痒いところに手が届かない印象もあります。

とはいえバンドルサイズを比べると 5 〜 10 倍近く差が出るため、なかなか悩ましいところですね。

パッケージマネージャー

npm か pnpm で良いと思います、yarn や Bun は使う必要ないかなと。

pnpm も全然実践投入できるレベルで、かつ workspace のクオリティが高いので、そこは明確に npm より上回っている点だと思います。

とはいえ npm だとダメ、ということも全然なく、普通の開発であればなんら困ることはない認識です、最近は速度もかなり改善されていますし。

npm を理解してから pnpm に移っていく、くらいで十分かなと。

バイブコーディング

Claude Code 一強な印象です、今ではなくてはならない相棒ですね。

最近の開発は 95% 程度 ClaudeCode にやってもらって、残りを手動で書く、といった感じになっています。

開発環境は Cursor ですが、別に VSCode でもさほど困らない印象です。

そんな感じです。

テストには触れませんでしたが、基本的には Vitest + Playwright で十分だと思います。

色々と書いてきましたが、概ね Frontend Developer Roadmap に沿って技術選定を行ったら問題ないよ、という感じです、Astro が推されているのはあんまり納得がいっていないですが…。