Frontend
framework
technology
Jenzy

Jenzy

web - developer

Next.js 15 Key Features

image.avif

To init project

npm install next@rc react@rc react-dom@rc

Reach compiler plugin

npm install babel-plugin-react-compiler

And then, add experimental.reactCompiler option in next.config.js:

const nextConfig = {
  experimental: {
    reactCompiler: true,
  },
};
module.exports = nextConfig;

Improve Hydration error

Hydration errors now display source code that help you to code in nextjs better semabtic tags of html. More specific error!. alt text

API catching

fetch Requests are no longer cached by default: Next.js uses the Web fetch API cache option to configure how a server-side fetch request interacts with the framework’s persistent HTTP cache:

fetch("https://...", { cache: "force-cache" | "no-store" });

The new homepage will goes to:

new homepage

Turbo Pack Update

Turbopack (beta) is an incremental bundler optimized for JavaScript and TypeScript, written in Rust, and built into Next.js.

When you do npx create-next-app@laest, they will ask for turbo pack for Yes or No. It will No by default. but we can skip this question by:

That’s the command that you can want turbo nextjs

npx create-next-app@rc --turbo

And then it will added to package.json

{
  "scripts": {
    "dev": "next dev --turbo",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  }
}

For empty everything, then wait for manual CLI.

npx create-next-app@rc --empty

Try Next.Js 15 RC, what you think about this new version? Comment down on our facebook post

Related Posts

Charts - Rechart

placeholder for testing imagme
technology

The chart library in Shadcn used Rechart under development style.

Disable CROS in Google Chrome

Disable cross origin in Google Chrome
technology

Disable Cross origin in Google Chrome for web development.

EJ2 editor for Text rich editor.

placeholder for testing imagme
technology

EJ2 (Essential JS 2) Editor from Syncfusion. The EJ2 Editor is part...