Nextjs + Tailwind CSS + Django REST Framework で学ぶモダンReact開発

🚀 [最新技術] Next.js + Tailwind CSS + Django REST Framework で学ぶモダンReact開発 🌟

コース概要

このコースでは、2022年11月までHerokuの無料プランが利用可能でしたが、その代わりに Renderの無料プランでのDeploy手順を導入しました（詳細はlecture 24に記載）。

更新情報

• 2022/08/27: Heroku無料プランの廃止準備として、Render無料プランでのDeploy手順追加。

Next.js と Tailwind CSS を駆使して、ホームページ、ランディングページ、ブログなどを開発するためのスキルを学びます。これらの技術は、SEO対策と高速レンダリングを実現するのに最適です。

注意: 本コースでは、Django REST Frameworkへの解説は簡略化しております。Next.jsの核心機能を深く理解するため、主にNext.jsに焦点を当てています。

学習内容

• Next.jsプロジェクト作成
• Tailwind CSSの導入と設定
• Client-side-navigationによるナビゲーション
• Layoutコンポーネントの効果的な使用
• useRouterを利用したURLへの対応
• Static Site Generation (SSG) と Incremental Static Regeneration (ISR)の理解と実装
• Stale While Revalidation (SWR) とその適用方法
• fallbackとrevalidateの仕組み
• Dynamic routingの設定
• getStaticPropsとgetStaticPathsの使用
• useContextを活用したState Management
• VercelへのDeploy手順
• JWT認証機能の実装
• universal-cookieの導入
• Django REST FrameworkによるREST APIの実装と管理
• REST APIとNext.js間の連携 (node-fetchやclient side fetch(useSWR)を用いた取得手法)
• SSG + ISR + CSR (useSWR)を組み合わせた、SEO対策とリアルタイムデータ取得の手法

実践的なプロジェクトを通じて学ぶ

1. Project 1: 簡易ホームページ（外部APIのブログ記事をpre-rendering）
2. Project 2: 認証機能付きブログ＋Todos（オリジナルREST APIと連携してSSG+ISR+useSWRを適用）

このコースを通じて、Next.jsの専門家となり、モダンなReact開発のスキルを磨き上げることができます。 🚀 現在、学び始める為の第一歩を踏み出しませんか？ 🌐