Getting Started with Next.Js 13.

Diving into Next.js 13: A Beginner’s Guide to Building Next Applications”

In this series I will Teach Next.js 13 with fundamentals, experimental features, data fetching, routing, new server and client components, Layout, Error handling, API, Caching and many more.

So tighten your seatbelt we are about to fly.

What is new in Next.js 13?

1. App directory: App directory is most new and good feature of Next.js 13. It is currently in experimental feature.
2. Routing: The routing system is changed in Next.Js 13 as it is shifted to folder wise routes from file base routes.
3. Rendering: Rendering strategies has been changed in Next.Js 13 as it is now based on Client and Server Components.
4. Data Fetching: Data fetching is so simple with async/await support in React Components and the fetch() API that aligns with React and the Web Platform.
5. Caching: New Next.js HTTP Cache and client-side cache optimized for Server Components and client-side navigation.
6. Fonts and Image Optimization: Improved Next Image optimization with lazy loading and next/font for fonts.
7. Turbopack: Turbo is a rust based builder with 700x faster than webpack.

>Server and client components.

Next.Js 13 has server components which are hydrated at server and than delivered to client. Whereas Client Components are the components which are hydraeted at the client's side and can be created using use-client . Client compoents can be imported in Server components. We will deep down in them later .

source: NextJs

In next article will create a Next 13 app with app directory so stay tuned.

BYE.