Coursera Plus Annual is 40% Off — Ends July 13.

Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

LinkedIn Learning

Learning Next.js (2022)

via LinkedIn Learning

Write review
DataCamp Ad

PowerBI Data Analyst - Create visualizations and dashboards from scratch

Learn More → Coursera Ad

Learn AI, Data Science & Business — Earn Certificates That Get You Hired

Learn More →

Overview

Google, IBM & Meta Certificates – 40% Off
One plan covers every Professional Certificate on Coursera.
Unlock All Certificates
Learn how to speed up your workflow with Next.js, the popular, React-based framework that lets you build web applications quickly, easily, and effectively using JavaScript.

Syllabus

Introduction
  • Speeding up your workflow with Next.js
  • What you should know
  • The exercise files and what you need
1. Why Choose Next.js
  • Learning the building blocks of an application
  • What is a web framework?
  • Discovering the Next.js framework
  • Learning the benefits of Next.js
2. Getting Started and Learning the Basics
  • Getting started with the Next.js tooling
  • Creating new pages
  • Building a file-based routing system
  • Creating links to navigate between pages
  • Setting up dynamic routing and URLs
  • Challenge: Set up a file-based system with zero config
  • Solution: Set up a file-based system with zero config
3. Pre-rendering and Data Fetching
  • Discovering the rendering strategies
  • Discovering the rendering strategies with getStaticProps
  • Pre-rendering at build time with static generation
  • Pre-rendering super fast and super SEO-efficient content
  • Discovering the rendering strategies with getServerSideProps
  • Using dynamic routes and user's input to query content
  • Search, request, and pre-render content with SSR
  • Discovering the rendering strategies with getStaticPaths
  • Pre-rendering at build time with static paths
  • Handling errors with a fallback page (404 not found)
  • Customizing an error page
  • Challenge: Pre-rendering at build vs. runtime
  • Solution: Pre-rendering at build vs. runtime
4. Styling Your Next.js Application
  • Adding global styles
  • Using scoped CSS with CSS modules
  • Styling Next.js with styled JSX
  • Loading static images
  • Challenge: Add global and scoped styling
  • Solution: Adding and maintain CSS globally
Conclusion
  • What to learn next?

Taught by

Sandy Ludosky

Reviews

4.6 rating at LinkedIn Learning based on 666 ratings

Start your review of Learning Next.js (2022)

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free
Someone learning on their laptop while sitting on the floor.