Тёмный

React 18 - What's New, What Changed & Upgrade Guide 

Academind
Подписаться 912 тыс.
Просмотров 252 тыс.
50% 1

React 18 was released and since it's a new major version, the big questions is: What changed?
Indeed, React 18 lays a solid foundation for great future updates and introduces one very important new concept: Concurrency.
Nonetheless, updating is extremely easy and requires almost no work. You don't need to re-learn React, you don't need to change your entire codebase.
Full tutorial article: academind.com/tutorials/react...
My "Complete Guide" course is entirely up-to-date with this latest version of React!
Join now at a super-low price: acad.link/reactjs
----------
Join our Academind Community on Discord: academind.com/community
Check out all our other courses: academind.com/courses
----------
• Go to www.academind.com and subscribe to our newsletter to stay updated and to get exclusive content & discounts
• Follow @maxedapps and @academind_real on Twitter
• Follow @academind_real on Instagram: / academind_real
• Join our Facebook community on / academindchannel
See you in the videos!
----------
Academind is your source for online education in the areas of web development, frontend web development, backend web development, programming, coding and data science! No matter if you are looking for a tutorial, a course, a crash course, an introduction, an online tutorial or any related video, we try our best to offer you the content you are looking for. Our topics include Angular, React, Vue, Html, CSS, JavaScript, TypeScript, Redux, Nuxt.js, RxJs, Bootstrap, Laravel, Node.js, Progressive Web Apps (PWA), Ionic, React Native, Regular Expressions (RegEx), Stencil, Power BI, Amazon Web Services (AWS), Firebase or other topics, make sure to have a look at this channel or at academind.com to find the learning resource of your choice!

Опубликовано:

 

28 мар 2022

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 134   
@dvreddy007
@dvreddy007 2 года назад
Thanks you Max for quick and easy updates in a short video. Always love your explanations.
@kamilpalinski5639
@kamilpalinski5639 2 года назад
You can explain everything in easy way. Thanks :D
@prantomollick3559
@prantomollick3559 2 года назад
Thank you so much Maximilian Schwarzmüller:) It's really helpful tutorial.
@olowoniyidaniel
@olowoniyidaniel Год назад
Currently taking your react course... you're making it easy for me to learn react. Thanks max 😊 🙏
@santiagoguastavino346
@santiagoguastavino346 2 года назад
Thank you! Simple and understandable. I already made these changes in my projects. Looking forward to more videos of updates.
@sanzhar.danybayev
@sanzhar.danybayev 2 года назад
Thank you for updating! Much appreciated !
@Jambajakumba
@Jambajakumba 2 года назад
Thank you for this Max. I love your content, so simple to understand and internalize. Keep up the amazing work👏👏
@waseemsattar8340
@waseemsattar8340 2 года назад
Kmk
@sujitwarrier4857
@sujitwarrier4857 2 года назад
Great video Max
@indrasen9617
@indrasen9617 2 года назад
Thanks Max. You keep it so easy and precise.
@shyamkumar1016
@shyamkumar1016 2 года назад
Thank you soo much for your courses. They are super easy to understand and give in depth knowledge. It helped me to get my current job and I will try to teach others like you are teaching. Thanks a lot.
@kitchen-e-kausar9105
@kitchen-e-kausar9105 2 года назад
Thank you for the update Max, it's easy to follow up with just one video. What pain it would have been to read it on text.
@aleksandrawojcik2507
@aleksandrawojcik2507 2 года назад
You are amazing and always on time! Thank you!
@abedaarabi3014
@abedaarabi3014 2 года назад
Thank you 😊 you are the best in explaining ❤
@vimz92
@vimz92 2 года назад
Thanks for the information bro. I'll be checking updates on react from your channel from now on. Subscribed ❤️
@jongsunpark8954
@jongsunpark8954 2 года назад
Amazing! looking forward to using new featrures! Thanks, Max ✨✨
@amithbhagat
@amithbhagat 2 года назад
Thanks 🙏 for updating on React 18 features, sir.
@incubated
@incubated 2 года назад
great video max. your courses helped me out a lot with work.
@samislam2746
@samislam2746 2 года назад
I finished reading React 17 documentation 7 days ago. Now I saw you video I'm still in the mood to check their website again ✔ thanks for informing us 👍 👌
@apayrus
@apayrus 2 года назад
Max, thank you! You are the best!
@donxnik
@donxnik 2 года назад
Keep it up Max! You are awesome!
@hello-ff8hh
@hello-ff8hh 2 года назад
didnt need to see the title to know who the tutor is! Thanks Max!
@albertocastany
@albertocastany 2 года назад
that was quick! thank you Max
@kishoresaha297
@kishoresaha297 2 года назад
React Fullstack😍 coming, Thanks for the info
@meitoli
@meitoli 2 года назад
thank you for sharing your precious time and knowledge with us
@user-qs1tp1ll9i
@user-qs1tp1ll9i 2 года назад
Amazing explanation. Love React and Max.
@choudharysahabmusic3513
@choudharysahabmusic3513 2 года назад
You are one of best teacher on udemy. I 've learned Angualr, React and JavaScript from your Udemy courses. Thank you max 🙏
@firewatermoonsun
@firewatermoonsun 2 года назад
For me he's the best teacher.
@DineshVutukuru
@DineshVutukuru 2 года назад
Thank you Max, you taught millions of people.
@kllokoq
@kllokoq 2 года назад
Thank you!
@onee
@onee Год назад
At 0:40 you can also do this: ReactDOM.createRoot(document.getElementById('root')).render(); I've even seen somebody do this: import { createRoot } from "react-dom/client"; createRoot(document.getElementById('root')).render();
@IH-dk6mk
@IH-dk6mk 2 года назад
thank you!!😀
@edilsonfb
@edilsonfb 2 года назад
Great video. Thanks
@akcalder92
@akcalder92 2 года назад
I started your React course on Udemy two weeks ago. You are such a great teacher, so I bought several more courses. Thank you Maximilian.
@elsonjunior2112
@elsonjunior2112 2 года назад
When my friends ask me about how to learn React or Javascript, I tell them to buy Max courses on Udemy.
@timiawoniyi5168
@timiawoniyi5168 2 года назад
But people complain of it. They said it's not updated and other inconsistencies
@Almighty_Flat_Earth
@Almighty_Flat_Earth Год назад
React js is a shame to JavaScript community. Governments should ban the use of this stupid library. Same functionalities can be achieved with Angular and Svelte with less frustration, so what's the point of using the stupid react js which makes web development unnecessarily complicated.? Those who use react are slaves.
@jampietri583
@jampietri583 2 года назад
You’re amazing, dude.
@tatemuchi7372
@tatemuchi7372 2 года назад
Very useful, thanks mate.
@vaniad555
@vaniad555 2 года назад
Thank you for this great video!
@rishabhrastogi4220
@rishabhrastogi4220 10 месяцев назад
very well explained 👐
@nemanjadjoric8765
@nemanjadjoric8765 2 года назад
I bought your Udemy course (React), and it Is one of Best desitions i ever made! The way you explain things Is so amazing, the way you start with almost nothing and after one hour or two, I am lerning advanced stuff. Awesome. Thank you for existing!! :) Ps: seriously, thank you so much!
@roctanweer2265
@roctanweer2265 Год назад
Thank you sir!
@shubhammadankar6390
@shubhammadankar6390 2 года назад
Thanx max. It is helpful
@luizamendes
@luizamendes 2 года назад
Thank you, great video.
@colokid3
@colokid3 2 года назад
This was so much more helpful than the React docs for making this change 😁 Thank you good sir!
@adilmughal2251
@adilmughal2251 Год назад
Well explained.
@sportshome6504
@sportshome6504 2 года назад
Thank you Sir
@mohammadhosseinmoradi2021
@mohammadhosseinmoradi2021 Год назад
Thanks a lot.
@archmad
@archmad 2 года назад
when he said, it does not break your existing code, well it does. FC does not contain children anymore. Instead use it with PropsWithChildren
@maxd7228
@maxd7228 2 года назад
Always first on the news. Excellent
@moinulislammoin
@moinulislammoin 2 года назад
Thanks, Max
@walidzhani6093
@walidzhani6093 2 года назад
I took the #React certification from your Udemy Course, 1.5 year ago... Since that I am a huge fan of #React. #React is the best #JavaScript framework ❤️ ❤️ ❤️.
@durgaprasaddas6494
@durgaprasaddas6494 2 года назад
I was never excited about anything like this, after i saw the React 18❤️
@sealone777
@sealone777 2 года назад
I miss react since I use Angular. Just curious if new web courses are coming soon! Looking very much forward!
@muhammadtouhiduzzaman7491
@muhammadtouhiduzzaman7491 2 года назад
Thank you boss ❤. you are such a amazing man. Love from bangladesh
@yoshitaarora4180
@yoshitaarora4180 2 года назад
Woaaaaaah. This is bomb !
@Climb_Mountains
@Climb_Mountains 2 года назад
thanks!
@shashikantmarskole
@shashikantmarskole 2 года назад
Thank you Max, Short & sweet understandable. keep it up ,Great work
@adityatripathi1904
@adityatripathi1904 Год назад
One small correction at 2:47: React does batch process state updates if there are multiple updates happening. It doesn’t necessarily go one by one.
@tkdevlop
@tkdevlop 2 года назад
Interesting stuff
@jomaramomas7682
@jomaramomas7682 2 года назад
Great stuff.
@ronnieleon7857
@ronnieleon7857 2 года назад
Ich habe zu viel dingen gelernt. Danke schon Max. Back in the days when I was starting out development, I would look at your courses in Udemy and just wish I could access it. A few years down the line I got access to your courses and it has transformed me into a better developer. Be blessed Max!
@kevyyar
@kevyyar 2 года назад
Max is the greatest to ever do it. If you want to learn a new tech fully, reference Max courses
@yzhu
@yzhu 2 года назад
Omg I randomly come across this video and immediately recognized the voice! Had many courses on Udemy from Maximilian
@munteanurares1075
@munteanurares1075 2 года назад
Hello Max ! Are you going to update the React Native course as well ? Thank you !
@ashwanisahu8755
@ashwanisahu8755 2 года назад
Love you 😘😉♥️
@ignaciohenriquez8739
@ignaciohenriquez8739 2 года назад
Awesome thanks. Do you plan to update part of your React course?
@academind
@academind 2 года назад
The course is 100% up-to-date
@Pareshbpatel
@Pareshbpatel 2 года назад
Nice summary of React-18 Changes. Thanks, Max {2022-06-15}
@softmaxBasketball
@softmaxBasketball 2 года назад
Dankeschön
@izio4408
@izio4408 2 года назад
Looking forward to wversion 18
@EricCosner
@EricCosner 2 года назад
Does anyone know how to make “react-dom/client” work with a purely CDN implementation? I get a warning for not using the client but can’t seem to fix it without switching to something like webpack.
@perchinina
@perchinina 2 года назад
hello and thank you very much for the video! I know it's not stackoverflow but I have a trouble with newest version of React. I run into this error `index.js:1 Uncaught SyntaxError: Unexpected token
@angeloliver2825
@angeloliver2825 2 года назад
Now, we can get two or more independed react executions trees in the same page :O
@DuyTran-ss4lu
@DuyTran-ss4lu 2 года назад
Awesome
@deepakbhatt7494
@deepakbhatt7494 2 года назад
Hey Max, great job but something is not working with typescript , done same changes update react and react dom and types could you please made a video that is with typescript. redux toolkit I am using and react-query, something went wrong my app is not responding well
@edoardo7848
@edoardo7848 2 года назад
Got an error with Typescript though, when const root = ReactDOM.createRoot(document.getElementById("root")) I get "TS2345: Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element | DocumentFragment'.Type 'null' is not assignable to type 'Element | DocumentFragment'." I know why of course, but is that expected? Just put an exclamation mark? Seems a bit hacky...
@ifaduolasamuel7144
@ifaduolasamuel7144 2 года назад
Hi, please how can I use react-router@6 with the new React updated version@18
@mataal8770
@mataal8770 2 года назад
Hi i have implemented the changes in the code but why is it that when i click my links it is not rendering. I have to refresh the browser for it to render the components.
@MrDevecka
@MrDevecka Год назад
Max, I as a steady student of alll your courses on Udemy (react, next, django) am highly interrested about one thing: does the lazy loading, Suspense and code splitting this way nullify the ultimate need for a bundler like webpack or ViteRoll...? I hit my head to the wall everytime when working on a react project with that annoying webpack setup for minification and code splitting. Does lazy and Suspense and the lazy imports code splitting fully replace the webpack?
@Sidgd1987
@Sidgd1987 2 года назад
Redux was working weird, i tried everything to fix but at the end using reactdom's render method fixed all the issues.
@Thilina4321
@Thilina4321 2 года назад
❤️
@varadasaiprakash9998
@varadasaiprakash9998 2 года назад
great
@jeremy6843
@jeremy6843 2 года назад
Hi Max, would you recommend jumping into nextjs framework or reactjs and express framework for a fullstack developer?
@cuuy
@cuuy Год назад
I'm not Max, though I'd recommend learning express first. nextjs uses pretty much the same code as express for api routes. So instead of jumping into nextjs, you should learn express and the concept of a rest api first.
@joel9909
@joel9909 Год назад
I will be a React Sage someday!
@thiccboi6211
@thiccboi6211 2 года назад
Does this work without issues for 3rd party libraries. How will libs like redux work without upgrading?
@awetogaabraham2350
@awetogaabraham2350 Год назад
how can I use material-ui/core icons in react 18
@soultanmuhammadalbar2311
@soultanmuhammadalbar2311 2 года назад
is it implement-able on React Native?
@subhranshudas8862
@subhranshudas8862 2 года назад
If you are authoring. react component library what should be the dev & peer dependency versions for react, react-dom?? package --> devDep = [react 18, react dom 18], peerDep = [^17.0.0 || ^18.0.0] OR package --> devDep = [react = ^17, react dom = ^17], peerDep = [^17.0.0 || ^18.0.0]
@thebrain678
@thebrain678 2 года назад
🥇
@rosarioscarlata4178
@rosarioscarlata4178 2 года назад
i have problems with create-react-app with react v18
@devomor8731
@devomor8731 2 года назад
remix already has many of the features
@saikiranakula2167
@saikiranakula2167 2 года назад
react-redux is not installing in the 18th version.... How to overcome this situation??
@AndreSpecht
@AndreSpecht 2 года назад
Could you share the code for that first example? (The concurrency one). Thanks
@academind
@academind 2 года назад
You find a complete intro (incl. link to a GitHub repo with demo code) here: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-lDukIAymutM.html
@asemzk
@asemzk 2 года назад
It will be easier to digest if you compare these 2 lines: ``` const root = document.getElementById("root"); // React 17 ReactDOM.render(, root); // React 18 ReactDom.createRoot(root).render() ```
@AnilKushwaha-jn7kf
@AnilKushwaha-jn7kf 2 года назад
Hey MAX I wanna learn how to prepare yourself for any interview(IT) only from you, would you like to teach me and many of out there like me?? And last I LOVE YOU AND MANUEL FOR Everything I got from YOU AND MANUEL.
@raghavenderkuppireddy7158
@raghavenderkuppireddy7158 4 месяца назад
❤❤❤❤❤
@01_lethanhan89
@01_lethanhan89 2 года назад
react version 18 has not updated redux toolkit
@spikesolid622
@spikesolid622 2 года назад
The reaction of next js if react completely add server-side rendering 😂
@inrustwetrust25
@inrustwetrust25 2 года назад
So basically NEXT is laying foundation for core react features😂
@robinqu1062
@robinqu1062 2 года назад
material-ui not available in 18
@almostprofessionalrecords6651
@almostprofessionalrecords6651 2 года назад
Watching this video at night is painful due to white screen flashing between slides
@justincueva2294
@justincueva2294 2 года назад
can i use react 18 with redux/ react-redux??????
@abhim6380
@abhim6380 2 года назад
Will you update your udemy course?
@academind
@academind 2 года назад
If you watch the video, you’ll see that there basically is nothing I could update right now :) I’ll update a few videos from render() to createRoot()
@webcoder_vlogs
@webcoder_vlogs 2 года назад
@@academind please add one concurrency search part also
@_kpman
@_kpman 2 года назад
Thanks for sharing. Just want to feedback that the purple background color is a little uncomfortable for me when watching this video.
@ecomje
@ecomje 2 года назад
Heard concurrency and i am like wait is this asyn await... 😆 Me thinking I can now create a component like `const App = async () => {}`
Далее
useTransition() vs useDeferredValue | React 18
16:22
Просмотров 94 тыс.
Angular 18 is EXACTLY what we needed
9:15
Просмотров 58 тыс.
Игровой Комп с Авито за 4500р
01:00
Olive can see you 😱
01:00
Просмотров 6 млн
I tried 8 different Postgres ORMs
9:46
Просмотров 387 тыс.
7 React Lessons I Wish I Knew Earlier
7:30
Просмотров 54 тыс.
Goodbye, useEffect - David Khourshid
29:59
Просмотров 494 тыс.
Why Signals Are Better Than React Hooks
16:30
Просмотров 456 тыс.
You might not need useEffect() ...
21:45
Просмотров 151 тыс.
The Story of Concurrent React
11:59
Просмотров 159 тыс.
Every React 19 Feature Explained in 8 Minutes
7:35
Просмотров 112 тыс.
My opinion on Angular 18 & React 19
9:47
Просмотров 47 тыс.
Игровой Комп с Авито за 4500р
01:00