From the course: Master Next.js by Building Scalable Apps with Routing, Databases, and Performance

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

RQ: Styling—global CSS and CSS modules

RQ: Styling—global CSS and CSS modules - Next.js Tutorial

From the course: Master Next.js by Building Scalable Apps with Routing, Databases, and Performance

Start my 1-month free trial Buy for my team

RQ: Styling—global CSS and CSS modules

“

Let's talk about a few questions related to global CSS and CSS modules. So first is, what are the advantages of using the CSS modules in Next.js? Now in previous lecture, we learned how to use the CSS modules in the Next.js application. Let's go through a few benefits. So first is scoped styles. CSS modules automatically create locally scoped class names, so that the styles are only applied to specified components. Then we have avoiding global conflicts benefit. So by using the CSS modules, the classes also follow the scope that is, they are local to the module in which they are declared. Due to this, it can avoid conflicts with same named classes in different components, and maintainability. So using the CSS modules, we can wrap the styles within the components. So it's easier to manage the styles associated with each component. Next question, how to apply global styling in Next.js. So as discussed, to apply global styling in Next.js application, we can give the styling in the global…

Contents