【Next.js入門】ReactフレームワークのNext.jsでマイクロブログを構築しながら基礎と本質を学ぶ講座
Next.jsフレームワークでマイクロブログを実際に構築しながら、Webアプリ読み込み速度やWebパフォーマンスを最大化するSSG/SSRプリレンダリング手法が学べる講座。モダンなフロントエンド技術をキャッチアップしてみよう。
Created by Shin Code
What you'll learn
- Nextjsの基礎と概念が理解できるようになる
- なぜNextjsを使うのか?その理由が理解できる
- ReactとNextjsの違いが理解できる
- Nextjsを使って簡単なブログを1から構築できる
- SSG(静的生成)のプリレンダリング手法が学べる
- SSR(サーバーサイドレンダリング)のプリレンダリング手法が学べる
- SSGとSSRの違いが理解でき、実装できる
- SSGとSSRの使い時が理解できる
- プリレンダリングの概念が理解できる
- プリフェッチングの概念が理解できる
- 動的ルーティングを構築できる
- ハイドレーションが理解できる
- CSSモジュールの使い方が理解できる
- グローバルスタイリングが理解できる
- ファイルシステムにデータを保存し、それを取得できる
- getStaticProps関数の意味が理解できる
- getStaticPaths関数の意味が理解できる
- Vercelを使ってデプロイができるようになる
- DPSワークフローが体験できる
- SEO対策の必要があるウェブアプリが構築できる
- マークダウンファイルの取り扱い方が理解できる
Requirements
- Reactの基礎の学習を終えている方
- なんとなくJavascriptについて知っている方
- 基本的なJavascriptの知識(変数や型宣言など)
- 基本的なプログラミングの文法(if文やfor文など)
- 簡単なHTMLやCSSを書いたことがある方
- 他のプログラム言語を使ったことがある方
Description
Reactフレームワークの「Next.js」を初めて触る人に向けたコース構成になっています。
※Next.js13の最新バージョンには対応しておりませんのでご了承くださいませ。Next.js13以前のNext.jsを学ぶことができます。
■ 本コースの対象者
・Reactは一通り学んだから次のステップとしてNext.jsを学びたい方
・Next.js完全初心者の方
・Next.jsを学んでReactの違いを明確に理解しておきたい方
・Next.jsの公式ドキュメントを読んでもイマイチ理解が深まらない方
・公式ドキュメントよりも動画でサクッと理解したい方
・CSRではない最新のレンダリング手法のSSG・SSRを学んでみたい方
Reactよりも最適化されたアプリやサイトを構築できます。
Next.jsフレームワークを学べば高速化されたWeb開発が可能に。
モダンなフロントエンド技術に乗り遅れたくない方は必見の内容です。
■ 本コースを受講する際の注意点
・HTML/CSS/JavaScriptの基本的な文法とルールは教えていません。
・Next.jsの公式ドキュメントに沿った内容で講座を構成しています。
・Next.js13の最新バージョンには対応しておりません。
・すでにNext.jsの公式ドキュメントを読み終えて理解済みの方は、
この講座では新しい学びがないので受講しないようにしてください。
・ISRについては取り扱っておりません。
Who this course is for:
- Reactの学習を終えて次のステップに進みたい方
- 流行りのNextjsの基礎と本質をさらっと学習したい方
- Nextjsで簡単なマイクロブログを作れるようになりたい方
- 実際のプロジェクトを通してNextjsのメリットを享受してみたい方
- ウェブページ/アプリのSEO対策に興味がある方
- ウェブページ/アプリの読み込み速度を向上させたい方
Instructor
Webエンジニア
皆さんはじめまして。Shinと申します。
休みの日はプログラミングばかり触っているちょっと変わった人です。便利なアプリや好奇心をくすぐられるようなアプリを作るのが趣味です。
動画レクチャーは分かりやすいように作成するように心がけています。
どうぞよろしくお願いします。