|
2 | 2 | title: The road to React 19 and Next.js 15
|
3 | 3 | keywords: ['Next.js', 'nextjs', 'React', 'react 19', 'Next.js 15', 'Server Components', 'react compiler', 'Server Actions', 'server functions', 'upgrade', 'update', 'migrate', 'codemods']
|
4 | 4 | published: 2024-08-12T11:22:33.444Z
|
5 |
| -modified: 2024-12-17T03:12:12.333Z |
| 5 | +modified: 2025-01-03T03:12:12.333Z |
6 | 6 | permalink: https://chris.lu/web_development/posts/road-to-react-19-next-js-15
|
7 | 7 | section: Web development
|
8 | 8 | ---
|
@@ -80,13 +80,18 @@ Meaning that prior to the release of the first RC for React 19, if you had sever
|
80 | 80 |
|
81 | 81 | * In early december 2024 the react team announced the release of [React 19 stable](https://react.dev/blog/2024/12/05/react-19) 🎉, the release included the Suspense fix from the previous RC as well as all the features I highlighted in the previous announcements. If you want to try out React 19 you could use the [Next.js 15](https://nextjs.org/) framework, which already used some of the React 19 features (under the hood) for some time, but now you too can set React to v19 in your package.json (React 19 with Next.js 15 works in both the pages and the app router). Or if you prefer you could use new [vite v6](https://github.com/vitejs/vite) to quickly spin up a dev server and try out the new React 19 client features like actions
|
82 | 82 |
|
83 |
| -I really liked that the React maintainers paused their release to address the concerns around Suspense and come up with a good solution. I can wait to experiment more with React 19 actions in combination with the 2 new hooks useActionState and useOptimistic to see for myself if I want to start using them in "real" projects |
| 83 | +> [!NOTE] |
| 84 | +> now that version 19 is stable, you can still use canary version, Next.js for example uses a canary for frameworks. To get an idea of what canary is currently available you can check out the [npm (react) versions page](https://www.npmjs.com/package/react?activeTab=versions) or in your package.json set react (and react-dom) to `"react": "canary"{:json}` and then run `npm update{:shell}` to tell npm to install the latest canary it can find |
| 85 | +
|
| 86 | +I really liked that the React maintainers paused their release to address the concerns regarding the **Suspense problem** and come up with a good solution. |
| 87 | + |
| 88 | +It will be interesting to see how in 2025 projects start using the new React 19 features, like for example actions in combination with the 2 new hooks useActionState and useOptimistic |
84 | 89 |
|
85 | 90 | > [!MORE]
|
86 | 91 | > [react.dev "React 19 (beta)" post](https://react.dev/blog/2024/04/25/react-19)
|
87 | 92 | > [react.dev "React 19 migration" guide](https://react.dev/blog/2024/04/25/react-19-upgrade-guide)
|
88 | 93 | > [react.dev "React 19 RC" post](https://react.dev/blog/2024/04/25/react-19)
|
89 |
| -> [react.dev "React 19 stable" post](https://react.dev/blog/2024/12/05/react-19) |
| 94 | +> [react.dev "React 19 stable" post](https://react.dev/blog/2024/12/05/react-19) |
90 | 95 | > [react.dev "React Compiler" documentation](https://react.dev/learn/react-compiler)
|
91 | 96 |
|
92 | 97 | ## New features in Next.js before v13
|
|
0 commit comments