Next.Js

The page is the route

Static routing

If you create a file named pages/about.js and export the React component as shown below, you can access it via the /about path.

Dynamic routing

Next.js supports pages with dynamic routing. For example, if you create a file named pages/posts/[id].js, you can access it via posts/1, posts/2, and similar paths.

style

Global style

These styles (styles.css) will be applied to all pages and components in your application. Because of the global nature of stylesheets, and to avoid collisions, you should only import stylesheets in the pages/_app.js file.

Component-level style

Next.js supports CSS modules through the [name].module. CSS file naming convention.

CSS modules restrict CSS locally by automatically creating unique class names. This allows you to use the same CSS class name in different files without worrying about conflicts.