Next.js | Crash Course for Beginners 2021
Learn all about Next.js, React's most popular Production Framework! Get Started with NextJS and make build amazing websites with ReactJS even more fun! Full Project included, 100% free 3 hours long course!
2021-05-19 19:00:00 - JavaScript Mastery
TIMESTAMPS:
00:00:00 - Welcome
00:00:46 - What is NextJS?
00:05:31 - Key Feature: Server-side (Pre-) Rendering of Pages
00:12:09 - Key Feature: File-based Routing
00:15:22 - Key Feature: Build Fullstack Apps With Ease
00:17:12 - Creating a NextJS Project & IDE Setup
00:22:52 - Analyzing the Created Project
00:25:44 - Adding First Pages To The Project
00:31-50 - Adding Nested Pages / Paths
00:35:37 - Creating Dynamic Pages
00:39:13 - Extracting Dynamic Route Data
00:43:21 - Linking Between Pages
00:50:34 - Onwards To A Bigger Project!
00:54:07 - Preparing Our Project Pages
00:57:49 - Rendering A List Of (Dummy) Meetups
01:02:52 - Adding A Form For Adding Meetups
01:06:47 - The "_app.js" File & Wrapper Components
01:13:04 - Programmatic Navigation
01:16:51 - Adding Custom Components & Styling With CSS
Modules
01:26:51 - How NextJS Page Pre-Rendering Actually Works
01:32:43 - Introducing Data Fetching For Page Generation (getStaticProps)
01:41:39 - More Static Site Generation (SSG) With getStaticProps
01:47:23 - Exploring getServerSideProps
01:53:50 - Working With Dynamic Path Params In getStaticProps
01:59:04 - Dynamic Pages & getStaticProps & getStaticPaths
02:06:21 - Introducing API Routes
02:12:41 - Connecting & Querying a MongoDB Database
02:22:13 - Sending HTTP Requests To API Routes
02:29:02 - Getting Data From The Database (For PagePre-Rendering)
02:36:12 - Getting Meetup Detail Data & Paths
02:45:53 - Adding "head" Metadata To Pages
02:55:12 - Deploying NextJS Projects
03:07:38 - Working With Fallback Pages & Re-Deploying
03:11:52 - Summary