Assets, Metadata, and CSS

The second page we added currently does not have styling. Let's add some CSS to style the page.

Next.js has built-in support for CSS and Sass. For this course, we will use CSS.

This lesson will also talk about how Next.js handles static assets like images and page metadata like the <title> tag.

What You’ll Learn in This Lesson

In this lesson, you’ll learn:

  • How to add static files (images, etc) to Next.js.
  • How to customize what goes inside the <head> for each page.
  • How to create a reusable React component which is styled using CSS Modules.
  • How to add global CSS in pages/_app.js.
  • Some useful tips for styling in Next.js.

Prerequisites

  • Basic CSS knowledge. This course will go over how to add CSS in a Next.js app, but it won't cover CSS fundamentals.

If you’re looking for detailed documentation on Next.js styling, take a look at the CSS documentation.