From the course: Master Next.js: Elaborate Hands-On Web Development, React Basics, Advanced Next.js, and Deployment

Unlock this course with a free trial

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

CSS modules and Next.js optimizations with layout

CSS modules and Next.js optimizations with layout

Okay, so let's talk about styling, looking sharp. You know, life is all about presentation. It's all about looking good and being good looking, or as Zoolander says, really, really ridiculously. Ridiculously good looking. So if we go into our styles folder that Next.js gives us, does give us a styles folder. We talked about this global CSS in the home module. Now make sure that you have these. If not, go back to the first video in the section where you can download the project. All right, so the CSS module basically allows us to locally scope CSS at a component level by creating these unique class names. That's what the modules does. So you can use the same CSS class name in different files without worrying about class name collisions. That's kind of brilliant because now we're accessing the modules specifically from those specific files, and we don't have to worry about the names collisions, which can tend to happen when you're writing a lot of CSS. So in addition to CSS modules, we…

Contents