Next.js App RouterのコンポーネントをVS Codeでサーバー・クライアント別に可視化する
Next.js v13でサーバーコンポーネントが導入されて以降、App Routerを用いた開発では、あるコードがサーバー側・クライアント側のどちらで実行されるのかを意識する必要が出てきました。この境界が識別しづらいことは、開発者にとって新たな課題となっていると思います。 実行される環境を見誤ると、クライアント専用のAPIをサーバーコンポーネントで呼び出してしまったり、反対にサーバーコンポーネントのみで行いたい処理をクライアントサイドへ露呈してまいセキュリティーリスクへ繋がったり、またバンドルサイズが気づいたら想定をはるかに上回る大きさへ膨れ上がっているかもしれません。 この記事ではこの課題に対して、各コンポーネントのファイルがサーバーコンポーネント・クライアントコンポーネント・もしくは両方になり得るかをVS CodeのUI上で可視化することにより課題の解消を目指した取り組みを紹介します。
静的サイトジェネレータとしてのNext.js App Router | Memory ice cubes
ふと気になったので試してみた。 これまでも、ただのBetter webpackとしてしかNext.jsのことを見てなかったり、とことんマイノリティなユースケースに生きてる。 やりたかったこと クライアントでJSを使わない、複数の静的なHTML+CSSを出力したい LinkもImageもなにも使わない テンプレート言語としてReactもといJSX そして、CMSやローカルのコンテンツを取得する部分に、RSCの書き味を使えないか Markdownを変換したり、ハイライトしたり やる前からなんとなく結果は見えてるけど、まあ一応ね・・・。 コード leaysgur/next-app-router-as-ssg https://github.com/leaysgur/next-app-router-as-ssg outディレクトリもまとめてコミットしてある。 特記事項としては、 next.confi
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
July 2026 Security Release
