まぁ Next.js 使って SPA 作るなよって話かもしれないけどさ…
Dynamic Routes
app/blog/[slug]/page.tsx
export default function Page({ params }: { params: { slug: string } }) {
return <div>My Post: {params.slug}</div>
}| Routes | Example URL | params |
|---|---|---|
| app/blog/[slug]/page.js | /blog/a | { slug: ‘a’ } |
| app/blog/[slug]/page.js | /blog/b | { slug: ‘b’ } |
| app/blog/[slug]/page.js | /blog/c | { slug: ‘c’ } |
何も知らない初見の時、『おお－便利じゃん』とか思ってたんだけど SPA 構成 (next.config.js の output:export 指定時) は SSG (Static Site Generation) 前提になるって知ってがっくししたって話。
ちょっと調べてみた感じ、App Router だからとかじゃなくて前の Pages Router でもダメっぽかった感じ ?
だから有識者には『何言ってんだこいつ常識だろ』って話かも (´・ω・`)
本筋か分からないけど issue もあった
なんか見た感じ、SPA とか知らね－よフロントエンドサ－バ立てろ感を感じる。
いや良いんだけどさぁ…でも中には個人の名前とか住所とか電話番号とかのペ－ジもあるじゃん ?
SSG は事前に、そういうデ－タを取得して静的ファイルを生成してサ－バ上に設置してレスポンスタイムを早くする仕組みじゃん ?
個人情報てんこ盛りの静的ファイルを格納しておくの嫌なんですけど…
正しく実装・設定すれば、そういう静的ファイルへのアクセスも正しく行われるかもしれないけど個人情報漏洩にビクビクしてまで行いたくはない、なくない ?
SSR (Server Side Rendering) しろって言うかもしれないけど、その為だけにサ－バ立てるの嫌っていうか…今仕事でやってるの社内向けシステムだから SEO とか関係ないし…
バックエンドを TypeScript で実装するの嫌っていうか…そこまで作れる技量無いし…
正直、Next.js で SPA 作るのはお勧めしません的な注意書きが欲しかった (´・ω・`)
まぁじゃあ何使うのって話になるんだけどさ。