Next.js

こんにちは、かつコーチです。前回までで、page.tsx によるファイルベースルーティングと、layout.tsx を使った共通レイアウトの作り方を解説してきました。ここまでは「固定のURL」しか扱ってきませんでしたが、実際のアプリでは /...

こんにちは、かつコーチです。前回はpage.tsxを使ったファイルベースルーティングの基本を解説し、フォルダを増やすだけでページが増えることを確認しました。ページが増えてくると、今度は「どのページにも共通するヘッダーやフッターを、毎回コピペ...

こんにちは、かつコーチです。前回はappディレクトリの中身を見ながら、page.tsxとlayout.tsxがどんな役割を持つファイルなのかを軽く紹介しました。今回はその中でもpage.tsxにフォーカスして、Next.jsの大きな特徴であ...

こんにちは、かつコーチです。前回はcreate-next-appを使って、実際にNext.jsのプロジェクトを作成しました。作成されたフォルダを開くと、見慣れないファイルやディレクトリがたくさん並んでいて、戸惑った人も多いのではないでしょう...

こんにちは、かつコーチです。前回はNext.jsとは何か、Reactとの関係を解説しました。Next.jsが「Reactにルーティングやサーバーサイドレンダリングを足したフレームワーク」だとわかったところで、今回は実際に手を動かして、自分の...

こんにちは、かつコーチです。これまでJavaScriptの基礎からTypeScript、React、Vue.jsまで、たくさんの記事を書いてきました。いよいよ今回から新しいシリーズとして、Next.jsというフレームワークを解説していきます...