/acme-dashboard

Learn the main features of Next.js App Router by building a dashboard app, following the official course.

Primary LanguageTypeScript

ACME Dashboard

Learn the main features of Next.js App Router by building a dashboard app.

Chapter 1: Getting Started

Create a new Next.js application using the dashboard starter example and explore the project.

Chapter 2: CSS Styling

Let's create your home page and discuss the different ways you can style your application.

Chapter 3: Optimizing Fonts and Images

Continue working on your home page by adding a hero image and a custom font.

Chapter 4: Creating Layouts and Pages

Let’s create your dashboard routes using layouts and pages!

Chapter 5: Navigating Between Pages

Learn how to navigate between pages using the <Link> component.

Chapter 6: Setting Up Your Database

Let's create a database to start fetching real data!

Chapter 7: Fetching Data

Let's discuss the different ways you can fetch data from your database, including using SQL and alternatives.

Chapter 8: Static and Dynamic Rendering

Learn about how you can use to further optimize data fetching with PPR and Streaming.

Chapter 9: Streaming

Learn how to improve your user's experience by adding streaming.

Chapter 10: Partial Prerendering (Optional)

An early look into Partial Prerendering - a new experimental rendering model built with streaming.

Chapter 11: Adding Search and Pagination

Learn how to implement search and pagination with Next.js APIs.

Chapter 12: Mutating Data

Learn how to mutate data with Server Actions.