What is Next.js?

React is a library for building user interfaces.

It's not feasible to create a fully-featured application ready for production.

We need to make decisions about other features such as routing, data fetching and more.

Next.js uses React for building user interfaces.

It provides additional features that enable you to build production-ready applications.

These features include routing, optimized rendering, data fetching, bundling, compiling and more.

You don't need to install additional packages as Next.js provides everything you need.

Opinions and conventions should be followed to implement these features.

Why do we learn Next.js?

Next.js simplifeis the process of building a web application for production

1. Routing

2. API routes

3. Rendering

4. Data fetching

5. Styling

6. Optimization

7. Dev and prod build system

React Server Components(RSC)

React Server Components is a new architecture introduced by the React team in version 18 which was quickly embraced by Next.js

The architecture introduces a new way of creating React components, splitting them into two types:

Server components and Client components

Server Components

In Next.js, all components are Server components by default.

They have the ability to run tasks like reading files or fetching data from a database.

However, they don't have the ability to user hooks or handle user interactions.

Client Components

To create a Client component, it's necessary to add "use client" at the top of the component file.

Client components can't perform tasks like reading files, but they have the ability to use hooks and manage interactions.