Course curriculum

    1. 本講座で学ぶこと・デモ

    2. 本講座の学習の流れ

    1. Next.jsって何？なぜ必要なの？

    2. プリレンダリングって何？

    3. SSGとSSRって何？

    4. 【追加教材】SSGのより分かりやすい説明

    1. VSCodeをインストールしよう

    2. Node.jsをインストールしよう

    3. 開発用フォルダを作ってNext.jsのひな型を作成しよう

    4. Next.jsファイル群の中身の説明

    5. Next.jsの開発効率が上がるプラグインをインストールしよう

    1. はじめに：完成品デモ

    2. Next.jsにおけるホットリローディングを体感しよう

    3. pagesフォルダでルーティング設定をしてみよう

    4. Linkコンポーネントでページ遷移をしてみよう

    5. 静的な画像ファイルの取り扱いについて(publicディレクトリ)

    6. Headコンポーネントを使ってメタデータを追記しよう

    7. 複数ページに共通して使えるレイアウトコンポーネントを作成してみよう

    8. Next.jsにおけるcssスタイリング適用方法を学ぼう

    9. タイポグラフィに関するCSSモジュールを用意しよう

    10. _app.jsにグローバルスタイリングを適用させてみよう

    11. トップページのレイアウトを更新しよう

    12. トップページのスタイリングを調整しよう

    1. はじめに

    2. Next.jsでプリレンダリングを実感してみよう

    3. ブログ投稿用データを準備しよう

    4. マークダウン解析のためのライブラリを作成しよう

    5. getStaticPropsでSSGを実装してみよう

    6. propsで受け取った静的データをmap関数で出力して表示しよう

    7. getServerSidePropsの書き方も知っておこう

    1. はじめに

    2. Next.jsにおける任意のURLを動的ルーティングとして設定する方法

    3. 各ブログファイル名(id)のオブジェクトを返す関数を作成しよう

    4. getStaticPathsを実際に使ってみよう

    5. 外部から一度だけデータを取得するSSGを実装しよう

    6. ブログIDに応じた記事内容を返す関数を用意しよう

    7. 実際にgetStaticPathsとgetStaticPropsを実感してみよう

    8. ブログ記事のレイアウトを訂正しよう

    9. フォールバックについて補足

    10. 404 Not Foundページをカスタマイズしてみよう

    11. ブログの細かい訂正をしよう(その１)

    12. ブログの細かい訂正をしよう(その２)

About this course

  • 20,000円
  • 49回のレッスン
  • 3.5時間の動画コンテンツ

Discover your potential, starting today