Next.js version 13 was announced recently and it brings huge changes to the framework. They collaborated directly with the React team to create the ultimate web framework and a new webpack replacement built with Rust... let's take a first look.

js 13 offers revised file routing with the new directory. The optional app directory brings a new layout structure with several additional features and improvements. The directory structure has undergone minor changes due to the new routing mechanism. Each path in the route has a dedicated directory with a page

NextJS Version 13, What's new?

- Priority to Server Components:
NextJS is betting big on Server Components. If you have been catching up on React version 18, you might already be familiar with how React components now have the ability to render themselves as both Client & Server side Components.
- Making Data Fetching Simpler
NextJS version 13 has completely changed the way of fetching data in your React apps. If you have been working with Next for quite some time, then you might be familiar with the data fetching methods like getServerSideProps(), getStaticProps(), getInitialPath() etc as we also have talked about these earlier. Starting NextJS 13, these methods are considered an anti-pattern and hence deprecated to use.
- Making apps the new pages directory
One of the most talked about change in the NextJS ecosystem is the introduction of a new app directory. While you can still create a good old pages directory and can set up all your pages in it but while doing so, you will miss out on all the latest and exciting features offered by NextJS version 13.

- Change in APIs
There are a few surface APIs that are being improved in the NextJS version 13 :
Image Component: If you have worked with NextJS, you know that the Image component is the defacto API for rendering images and is preferred over the native img tag. In NextJS 13, the Image component would ship less javascript to the client side and has some performance improvements.

@next/font:
Next 13 Announcement https://nextjs.org/blog/next-13
Turbopack Announcement https://vercel.com/blog/turbopack

🐦 Twitter: https://twitter.com/tkssharma
🐦 Github: https://github.com/tkssharma
🐦 Website: https://tkssharma.com
🐦 Blogs: https://blog.tkssharma.com

I’m Tarun, I am Publisher, Trainer Developer, working on Enterprise and open source Technologies JavaScript frameworks (React Angular, sveltekit, nextjs), I work with client-side and server-side javascript programming which includes node js or any other frameworks Currently working with JavaScript framework React & Node js 🚀 with Graphql 🎉 developer publications.

I am a passionate Javascript developer writing end-to-end applications using javascript using React, Angular 🅰️, and Vue JS with Node JS, I publish video tutorials and write about everything I know. I aim to create a beautiful corner of the web free of ads, sponsored posts,