#React 18 Was Released!

React 18 was released and whilst it should only require one code change to update to this new version, it still introduces some exiting new concepts and lays a solid foundation for React's future.

Definitely take a look at the official release notes to learn about all changes and new features.

In addition, you may also want to go through my detailed video where I explore this latest update.

#Updating From React 17 to React 18

Updating from React 17 to 18 only requires two simple steps:

1) Install the latest version:

npm install react@18 react-dom@18

2) Go to your root entry file (typically index.js) and change the react-dom import from

import ReactDOM from 'react-dom';

to

import ReactDOM from 'react-dom/client';

Also replace the ReactDOM.render() method in that same file.

// ... imports etc.
ReactDOM.render(<App />, document.getElementById('root'));

should be changed to:

// ... imports etc.
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);

And that's it! This is all you have to do, no other code must be changed. React 18 also does not change the way you write React code, you therefore don't have to re-learn everything.

#New Features & Changes

React introduces one key new concept: Concurrency. I explain it in greater detail in my React 18 video and you can also learn more about all the new features and changes in the official release blog post.

Related Premium Courses