はじめに ”Deploying a Next.js App”が最後のレッスンになります。 ということで今回が最終回にしたいと思います。 セットアップ 前回の引き続き 構築 package.jsonの中身に追加をしていきます。before { "scripts": { "dev": "node server.js", "build": "n…

はじめに 今回は"Styling Components"をやっていきましょう。実はこの次のレッスンはデプロイについてなので、かなり終盤に近付いてきました。 ゴールに向かって頑張りましょう！ セットアップ 前回同様引き続き使っていきます。 ページをスタイリングする p…

はじめに 今回は”Fetching Data for Pages”を進めていきましょう。 セットアップ 今回も変わらず前回の続きを使っていきます。 ページのデータを取得する さすがアメリカといいますか、今回はバットマンテレビ番組のリストを表示していきたいと思います。番…

はじめに 今回は”Server Side Support for Clean URLs”をやっていきたいと思います。 セットアップ いつも通りに前回の続きを使っていきたいと思います。 カスタムサーバーを作成する 前回のルートマスキングではリロードするとエラーを吐き出してしまいまし…

はじめに 今回は”Clean URLs with Route Masking”をやっていきましょう！ セットアップ いつも通りに前回の続きを使っていきます。 ルートマスキング ルートマスキングはNext.jsの独自の機能です。 アプリで見る実際のURLとは異なるブラウザ上のURLを表示す…

はじめに 今回は"Create Dynamic Pages"を進めていきましょう！また、今回は簡単なブログアプリを作成していくのが目的なので、かなり面白くできると思うので楽しみにしていてください！ 投稿のリストを追加する また、いつも通り新しくアプリをダウンロード…

はじめに 今回は”Using Shared Components”を進めていきたいと思います。 ヘッダコンポーネントを作成する 公式ではサンプルコードをダウンロードして進めていますが、より実感がわくように前回の続きを使っていきたいと思います。まずはコマンドプロンプト…

はじめに 今回から”Navigate Between Pages”というレッスンをやっていきたいと思います。また前回のプロジェクトの続きからやるので、まだやっていないかたはそちらを参照してみてください。 リンクの作り方 pagesフォルダの中にあるindex.jsの中身を書き換…

はじめに 今回で公式の”Getting Started”という名前のレッスンを終わらせていきたいと思います。 内容 前回作成したpagesフォルダにindex.jsを作成します。index.jsに下のコードを打ち込みましょう。 const Index = () => ( <div> <p>Hello Next.js</p> </div> ) export defaul…

はじめに Next.jsの公式で学習用のサイトを無料で公開してくれています。https://nextjs.org/docsnextjs.orgただ言語がおそらく英語のみなので、少し読み進めるのが厄介です。そこで、自分への備忘録としての意味合いも込めてある程度の流れを残しておきたい…