Next.js 15 has FINALLY been released and I couldn't be more hyped. THANK YOU CLERK FOR SPONSORING soydev.link/clerk SOURCE nextjs.org/blo... Check out my Twitch, Twitter, Discord more at t3.gg S/O Ph4se0n3 for the awesome edit 🙏
Here’s a summary of the key points from the video with timestamps: ****00:00** - Introduction to Next.js 15** - Next.js 15 released just before Next Conf. - Major focus on making the framework easier to use, with much-needed changes. ****00:22** - Sponsor: Clerk** - Discussion on how Clerk simplifies authentication (SSO, multi-factor, passkeys). ****01:08** - Stable Release of Next.js 15** - Next.js 15 is stable and ready for production. - New `next@codemod` introduced to help update codebases automatically for async changes. ****01:35** - Breaking Changes (Async)** - Some breaking changes related to async behavior. - Example: Previously, calling `cookies` did not require `await`, but now it does. The codemod automates these updates. ****02:27** - Caching Defaults** - Caching behavior changes: `fetch`, `get` route handlers, and client routes are uncached by default. - Explicit caching must now be specified. - New caching options: `no-store`, `force-cache`, and `static`. ****03:45** - Page Components No Longer Cached by Default** - Page components are no longer cached by default, ensuring fresh data when navigating. ****05:07** - React 19 and Compatibility** - React 19 (RC) is used with Next.js 15. Pages Router remains compatible with React 18. - React Compiler is out of beta. ****06:22** - Next.js 15 Aligns with React 19** - Next.js aligns its release with React 19 to minimize future delays. - Backward compatibility with React 18 remains. ****07:32** - Pages Router Support Continues** - Pages Router will continue to be supported for new and existing projects. ****08:22** - React Compiler Eslint Plugin** - React team’s eslint rules were refined during the creation of the React Compiler. Recommended for all React apps. ****09:16** - Hydration Errors Improvement** - Hydration errors are now more informative, providing detailed diffs to identify issues. ****10:30** - Turbo Pack for Dev Mode** - Turbo Pack is the new default for faster development builds. It's not yet ready for production builds but will be soon. ****12:45** - Static Route Indicator** - New static route indicator helps developers understand which routes are static or dynamic during development. ****14:02** - `waitUntil` and `after` for Async Operations** - `waitUntil` and `after` help handle asynchronous background tasks more efficiently on platforms like Vercel. ****16:21** - Instrumentation.js for Error Management** - Introduction of `Instrumentation.js` to improve error tracking and logging, especially for platforms like Sentry. ****17:16** - Form Component** - The new form component supports prefetching and client-side navigation with progressive enhancement. ****18:39** - TypeScript Support for Next Config** - Next config files now support TypeScript, making it easier to see keys and experimental flags. ****19:56** - Sharp Package Included for Image Optimization** - Sharp is now included by default in Standalone output mode, simplifying image optimization. ****21:26** - Server Actions Security Drama Resolved** - Security concerns with server actions were addressed through encryption and randomized IDs. ****24:44** - Bundling of External Packages for Servers** - External packages are now bundled server-side to improve performance, particularly in serverless environments. ****26:04** - Server-Side Optimization** - Next.js now allows control over bundling external server-side dependencies for improved cold start times. ****27:47** - Improved Static Generation** - Static generation speed has been improved, and fetch cache sharing across multiple pages is now possible. ****29:28** - Concurrency Controls for Static Generation** - Advanced controls over static generation, including worker concurrency, are introduced to speed up resource-intensive tasks.
@@Joshua.Developer remix doesnt give you much fancy things, its route based data loading and route based actions just like a traditional server rendered app but most people just hear this and assume that you would have to just prop pass everything to components but tbh its a skill issue. Remix has some great hooks like useMatches for that problem and error boundaries are so great, you get to learn so much about the web like http caching and how easy it is to cache. For example, I implemented my own route cache that allows me to cache which ever route i want to, not like next js route cache that you cant change. Honestly, only things remix lacks is middleware and type safety in actions easily.
@@hello19286How did using an unstable version of React work out for Next in v14? I imagine it’s not quite that straight forward with re: FB and Instagram.
Thanks for this video! Would love to see a video that shows you upgrading a real project that uses ShadCn/UI. For me, it does not work at all as the radix-references fail. As a relatively new NextJS developer, this would be very helpful to see how to deal with "third party" packages when upgrading.
This is like putting new tires in your car that the manufacturer didn't approve yet. It must be insane to install and use that package for now. Now try explaining to the Jr of your team why he can't depend on alpha/beta/rc now haha
Thank god they are finally getting rid of their ridiculous caching by default BS. That was such a bad decision on their part. The other thing that annoyed and shocked me was when I was doing a build and it was trying to connect to my database. I was like WTF, why are you trying to access my DB at build time?
Looks like I will have to wait some time to upgrade since framer-motion code breaks after upgrade. Won't even build. Complains that className is not valid anymore on motion elements. Might be a simple fix but I would rather not risk breaking the live env.
You need to update framer motion to v12 canary to fix that className type issue. Still not recommended to upgrade to Next v15 since React 19 stable isn’t out yet
29:05 ...can someone help me how to zoom like this? is it some bind of recording software you are using (probably OBS?) or is it something i could achieve with basic macos screen recording?
clerk is doing evil shit with their pricing lately. you need to pay for their super premium tier in order to impersonate users - something which is tablestakes in other auth provdiers
18:30 ok sure, but that is really not difficult code…. looks like every form data submission function I ever wrote back in vanilla JS and jQuery days 23:50 “weird concerns”? Really? This is one of the most popular react metaframeworks out there, with massive adoption by junior devs and total n00bs…huge target for malicious actors looking to affect a large number of sites with a single exploit. Nothing “weird” about such concerns.
@@developer217 There's the `objectFit` style, the `fill` prop, and if you want your image as background, you can do it with the `getImageProps` function. What else is missing?
There's the `objectFit` style, the `fill` prop, and if you want your image as background, you can do it with the `getImageProps` function. What else is missing?
From a mere technical and un-opinionated pov it seems that for the most part they just fixed some "dumb" bugs or weird decisions/assumptions they have made in the last 14 versions... (14!!). I'm not blind: I can see why a lot of peoples are using Nextjs and why there is a lot of hype everytime they just "fix" something that in another stack regular devs will throw a pile of s...t against, but from a dev which is actively in the industry for 20 years sorry, but I still don't buy it (but this is just imho): when they release Next16 maybe they will point at all the mistakes done in Next15... However I recognized that is still a framework with a lot of features, especially for modern frontend (but I do not understand why not using Vite as default btw) when other "batteries included" solutions don't have such solid concepts (or at least into the core and maintained by core team members). Happy coding everyone!
I was so hyped about 13 and 14 but it really is painful. Especially the default caching in 14. Vercel made programming stupidly more complicated. If they want devs to experience the cool things of Server Components, Server Actions, then just implement it and hide from us. I'm switching to Remix and I hope they will do RSC better than Vercel's
Maybe I’m in “enemy territory” here, but NextJS just feels like the continuation of “web dev is a hot mess”. Crappy dev tooling and DX. Is there a better framework for someone building SaaS apps and “not building facebook”?
