Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Learn Working with CSS Modules | Setting Up a Next.js Project
Next.js 14 Mastery for Building Modern Web Apps
course content

Course Content

Next.js 14 Mastery for Building Modern Web Apps

Next.js 14 Mastery for Building Modern Web Apps

1. Introduction to Next.js
2. Setting Up a Next.js Project
3. Building Pages and Layouts in Next.js
4. Deploying a Next.js App and Setting Up a Database
5. Fetching and Displaying Data in Next.js
6. Advanced Next.js Features and Optimizations
7. Implementing Authentication in Next.js

book
Working with CSS Modules

CSS Modules automatically create unique class names, allowing CSS scoping to a specific component and eliminating style collisions. Simple CSS rules can be written inside the CSS Modules.

Back to the Project

Let's create a CSS module called home.module.css inside of the app/ui folder and paste the following CSS rules:

We should import the home.module.css file into the app/page.tsx file and then apply the styles.circle class to the div element we created earlier.

In Practice

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 2. Chapter 6
We're sorry to hear that something went wrong. What happened?
some-alt