React JS Full Course 2024 | 6+ Projects | 15 Hours

Hi Everyone 👋,
In this video we will be learning A to Z concept of React JS.
⏰ ▬▬▬▬▬▬ T I M E S T A M P S ▬▬▬▬▬▬⏰
00:00 Introduction
05:15 ES6 concepts introduction
09:03 Template literals
11:00 Ternary operators
14:21 Object and array destructuring
20:05 Default parameters, spread operators and rest parameters
27:03 ES6 array methods
40:32 async await API call example
44:55 Installing react app using create react app and vite
59:00 class based components
01:04:10 functional components
01:07:55 Nested components
01:13:50 List and keys
01:17:15 Props
01:25:20 Styling react apps
01:32:55 conditional statements
01:40:00 state and setState
01:47:50 lifecycle methods in class components
02:01:30 useState hook
02:06:40 useEffect hook and manage dependency logics
02:15:50 data fetching using useEffect
02:23:20 manage loading state
02:27:33 useContext and react context api
02:45:15 useReducer hook
02:59:59 Todo list using material UI
03:28:52 Form handling
03:37:00 Form submission
03:50:25 dynamic form creation
04:16:35 React router dom introduction
04:18:00 BrowserRouter
04:20:20 Routes/Switch and Route component
04:22:15 useNavigate hook
04:24:00 Link component
04:25:15 dynamic route pages
04:28:00 useParams hook
04:29:00 useLocation hook
04:30:28 not-found page logic
04:32:00 Common layout using outlet component
04:38:00 useRoutes Hook creation
04:44:54 useFetch custom hook
04:57:00 useWindowResize custom hook
05:03:40 react hook form
05:16:15 useRef hook
05:23:10 useMemo hook
05:31:43 useCallback
05:37:13 React query/Tanstack Query
05:50:44 Shopping Cart
07:25:30 React firebase auth
08:35:50 Redux toolkit
09:38:30 React with Zustand
09:57:25 Unit testing using Jest and React Testing Library
11:01:40 MERN Stack task management app
⭐▬▬▬▬▬▬ PLEASE LEAVE A STAR :) 👋 ▬▬▬▬▬▬⭐
Source Code : github.com/san...
👋▬▬▬▬▬▬ BUY ME A COFFEE :) ▬▬▬▬▬▬👋
www.buymeacoff...
🔔▬▬▬▬▬▬ Subscribe for more! ▬▬▬▬▬▬🔔
/ @sangammukherjee
👋 ▬▬▬▬▬▬ CONNECT WITH ME ▬▬▬▬▬▬👋
Linkedin : / sangam-mukherjee-40048...
Instagram: / sangam_mukherjee

[@sangammukherjee]

⏰ ▬▬▬▬▬▬ T I M E S T A M P S ▬▬▬▬▬▬⏰ 00:00:00 Introduction 00:05:15 ES6 concepts introduction 00:09:03 Template literals 00:11:00 Ternary operators 00:14:21 Object and array destructuring 00:20:05 Default parameters, spread operators and rest parameters 00:27:03 ES6 array methods 00:40:32 async await API call example 00:44:55 Installing react app using create react app and vite 00:59:00 class based components 1:04:10 functional components 1:07:55 Nested components 1:13:50 List and keys 1:17:15 Props 1:25:20 Styling react apps 1:32:55 conditional statements 1:40:00 state and setState 1:47:50 lifecycle methods in class components 2:01:30 useState hook 2:06:40 useEffect hook and manage dependency logics 2:15:50 data fetching using useEffect 2:23:20 manage loading state 2:27:33 useContext and react context api 2:45:15 useReducer hook 2:59:59 Todo list using material UI 3:28:52 Form handling 3:37:00 Form submission 3:50:25 dynamic form creation 4:16:35 React router dom introduction 4:18:00 browserRouter 4:20:20 Routes/Switch and Route component 4:22:15 useNavigate hook 4:24:00 Link component 4:25:15 dynamic route pages 4:28:00 useParams hook 4:29:00 useLocation hook 4:30:28 not-found page logic 4:32:00 Common layout using outlet component 4:38:00 useRoutes Hook creation 4:44:54 useFetch custom hook 4:57:00 useWindowResize custom hook 5:03:40 react hook form 5:16:15 useRef hook 5:23:10 useMemo hook 5:31:43 useCallback 5:37:13 React query/Tanstack Query 5:50:44 Shopping Cart 7:25:30 React firebase auth 8:35:50 Redux tookit 9:38:30 React with zustand 9:57:25 Unit testing using jest and react testing library 11:01:40 Mern Stack task management app

[@codePracticeId]

Is this react 19

[@jagadeshvarmasvpkh7860]

Great effort

[@AAA-zz7gj]

Can anyone do web development at age 36?

[@asifmallick371]

React query , redux , zustand , jest and react testing library all in one video . Wow 🔥🔥

[@Arno-pv8bo]

bro you are the only teacher who gives different examples to make us fully understand a concept ... many know react but don't know how to teach it... let's hope you keep sharing your knowledge with us

[@iamvishu591]

great video , I am senior developer , the videos help me to revise quickly

[@user-ms4fv7cd7d]

hi there, i want to ask you a question. I am junior developer that currently learning new stacks such as React sometimes struggling to understand when learning this. Can I know your way how to learn and understand React effectively?

[@fastsainyt]

@@user-ms4fv7cd7d learn and practice

[@neonphoenix5159]

@@user-ms4fv7cd7d Of course you'll struggle because you are supposed to learn that way, these knowledge cannot be acquired that quickly, you'll need to practice a lot to even comprehend the logic. What i will recommend you do is; always try to code using your own logic and continuously work on different projects after learning a specific topic instead of just scrolling through different videos and confusing yourself. Happy coding and good luck :)

[@sandeepdeepu5052]

Thank you so much for your efforts bro, I'm 2023 passout student and currently working in frontend projects in my company. I've learned CSS,JS and did few projects from your react 25 projects part 2 video. Currently watching Next JS video and will complete in this week. If possible try to upload Next+TSX video in the future bro. Thank you so much for all your videos brother.

[@mjtech4243]

Bro can you suggest how did you get your first job ? I'm also 2023 passed out guy..

[@saikatmandal4099]

bro ur channel is very undiscovered and underrated , the amount of content u put u deserve a lot of appreciation , i have been watching chai and code and was looking for multiple projects so that i can get use to react and tailwind f, got ur channel and its awsome .

[@murali-krishnan]

Great tutorial man, 👏🏼I found your channel 3 days back. First, I watched the Next.js Full Course, and now this one. It's a great refresher for me. Eagerly waiting for your Next.js and React Advanced topics videos. Hope you will upload it soon. Much appreciate your effort 💪🏼

[@okworjoshua8157]

I just started watching this and I’m already enjoying it

[@cheems2254]

greate learning video i had not revised my react js since 1 month so this complete react js video is helping me like a charm your explaination is perfect thank your sangam

[@amarpisal8542]

I just watched the video completely. The immense amount of hard work you have done is clearly visible. Please guide us by making similar videos in the future 💖💖💖

[@vishalsinghshekhawat1954]

is it for complete beginner?

[@Vrjj129]

@@vishalsinghshekhawat1954 yea

[@InviAnuragPandey]

That's great !!!! Please Upload NodeJS also because whenever any job seeker goes for a job interview or hired as frontend developer for react profile or web development profile he/she will ask for backend also thats why it is mandatory to learn backend also in this recession. I believe you can definitely help us to exit this recession. Your content is premium and deserve to be paid also but it's your big heart that you are giving it for free👌👌💕💕 Trust me you will go in millions in terms of views/subscribers and money also.

[@MasterOP-m6q]

Great tutorial , learnt a lot .. waiting for the react 19 5:24:00 && the advance react video

[@izzahasalam8078]

From today 25/7/2024 I am Starting this course. I know Some React Basics But This is an eye catching course so definitely I have to do it. after Completing I will share my reviews. Thank you in advance...

[@amarjondhalekar2604]

Please share your review

[@SouravJana-zu7uj]

Supporting you from the beginning . You are awesome, liked your way of teaching .. this is very helpful 🙏. Please try to bring Node JS course 😢😢

[@user-hx6bt6fb9n]

Backend series also need combination this project

[@muhammadmuhammadkeni4093]

I'm impressed and convinced wth the comments read so far..... Kudus❤ we appreciate you 🙏

[@goutambhattacharyya6908]

Great tutorial, after a long search I have found a tutorial like this. Thank you...

[@rammummaneni1657]

worDs are small thing to express your Hard work brohh Just Rampp.... youuuu 🔥🔥🔥🔥🔥🔥

[@robertspidey8136]

I am already motivated by this. Your way of teaching is A+. Keep it Up!

[@armaanyusufkhan]

This is what we call a top notch react js!!!

[@ryuu5109]

Thank you so much sir, we really appreciated your effort to bring this wonderful full tutorial of react to us beginners, God bless and always stay safe sir!

[@yogeshgadhewal9840]

Today i am starting this course 22 july 2024

[@calmmusicclouds8787]

26 july 2024

[@user-uc1th1ty1n]

29 july

[@fernandezjasper]

29

[@yogeshgadhewal9840]

today is 08 Aug 2024 i have completed this course... to be honest mzaaaa ayaaa or ye mzaaa hume or chahiye... pls bhaiyaa ab backend ka bhi ek course la do.... and thank you so much bhaiya.... apke efforts dikhe apne 2 baaje 3 baaje raat me video ko banyaa h bhaiya thank you so much 🤗🤗😇

[@user-uc1th1ty1n]

@@yogeshgadhewal9840 hr din kitne hours kiye tumne ?

[@BytesRush]

Your content is an absolute masterpiece Sir ❤

[@mvut]

Highly productive. Keep up the good work. Thank you!

[@DanielrajA-o9p]

Thank a lot for this great work

[@pratik5115]

Backend needed

[@praveen.k70]

waiting for part 2, The explanation and the effort is really appreciable, great work sir.

[@memyselfandi7731]

subbed!! please next advanced ecommerse project with react or nextjs with firebase, shadcn charts(for admin)

[@FueGoFreak-u6t]

Hello sangam , I am from Nepa .Learning with you has been great . I appreciate your hardwok , I hope you continue similar for NextJS full course in same theme.

[@sylvanusfranklin7528]

thank you so much for this video especially the ES6

[@abdoulhakimali5930]

First thank him for this work instead of asking for backend series

[@mdrizwanuzzaman2021]

Keep making these kind of videos for backend and databases ....your teaching is awesome 👍🏻

[@pratikpanda889]

Thankyou. Much needed video

[@vrfEducation]

Good job man. I've been looking for such a complete course for a while. Thanks

[@yogeshgadhewal9840]

Of course

[@solarsystem9156]

I saw new video. I liked it simply because I know its gonna be LIT like your nextjs one shot video. thanks bhaiya

[@patricksaintmanuel6047]

thank you very much for this..... what a package!

[@Neha-oe9zr]

great video. thanks for all the hard work for making such informative material and explaining so well

[@AaronDelight]

Thank you bro for taking your time to explain this step by step, you the best teacher .

[@ndudirichinazaekpere533]

You sabi well Thank you for this👍🏾👌🏽

[@theophilus494]

Great content.. it really helped

[@mohammadasif5798]

Thank you for such a wonderful job brother. It's very helpful and you are doing it for free.

[@user-fl2ke1kg3x]

Thanks for providing this!

[@Anime-vk6xq]

Thank you Bro For teaching us what is going on in react.

[@davronmaxmudov3972]

15 hours 🔥🔥🔥 bro you are crazy, thank you so much ❤

[@Kikikuku2]

Wonderful video, many thanks!

[@user-wf4nu4jq6d]

Oh my god whahh the amazing content✨ Thank you for your hard work, I will take into my challenging on learning programming 💙

[@anushkachawla1019]

The way in you are teaching is just wowwww ❤️✨

[@tulasireddy6557]

Excellent React Tutorials, I have subscribed to your channel and liked the video, Please upload more great videos like this, Thank you very much for your valuable tutorial ❤❤👍👍👍

[@kirangudelli114]

this is really great teaching....big salute and big thanks to your great efforts. you are the one of the great teacher

[@swarashayman]

Great video for every dev. Please bring a video on backend as well.

[@manan09ful]

In the very first minute of logicwl operators I learned something new. I never knew that && skips the second argument if first argument is false.

[@mahadevjana7120]

I waited this video, much love you sir ❤

[@Leesdjo]

Thank you. Amazing content.

[@user-gk7um4cm1b]

Thanks for putting out a great effort for us.

[@armaanyusufkhan]

Your are doing greatest work 🔥💥

[@jagadeshvarmasvpkh7860]

Superb great effort can you do video deployment AWS build. Agile methodologies clear example demo that will be very helpful

[@callerreacts]

thanks bro for taking so much efforts

[@prashantswaroop4801]

Thanks For All The Hardwork you do.

[@user-xl9hc1ut4m]

MashALLAH Very good tutorial it is good like paid

[@NarendraK-ux3zz]

Bro, i am so happy with your effort and sharing knowledge...

[@sohanxsahoo]

Thank You A Lot Bro. Finally found what i'm looking for...

[@adityaverma4549]

Thank you , for this amazing video 🙏❤.

[@user-ul7ii4di2q]

This video deserves million views.

[@jatinnandwani6678]

Thanks Sangam, this is super helpful!

[@sangammukherjee]

@@jatinnandwani6678 thank you bro 😀

[@Give_bestengineer]

salam hai bhai aapke effort ko ,Love you bro

[@charlestoneoyoo]

This is epic bro🎉...thanks for your efforts and the content provided

[@udoka9260]

Thank you very much for your efforts.....

[@Light33966]

Thanks for sharing this

[@Gayamsaijahnavi-uh1gq]

every topic create in single file, each topic create different file so better. so no confussion, but explanation awesome

[@varaprasadsatti]

great tutorial man....loved it❤

[@Ilab_basketball]

Nice this is the tutorial I am looking for...❤

[@shrutirane9831]

the besttt!!! but could you pls make one tutorial for node.js?

[@shreyagd7747]

Woww loved ur patience I'll start now n say u at the end of the video 25th july 2024

[@adamuahmedaliyu]

Wow, Awesome You are the guy.... Thanks

[@Rambabubommidi]

Nice video !!😇 i got some knowledge from your video.

[@SubarnaPokharel]

Great Sir! But now next tutorial : TYPESCRIPT , please

[@discover201]

thanks for such a detailed tutorial

[@dreamvallyhasan4807]

Best of the best..Thanks Bro

[@jerriejd]

bro can u please give us the option to see the videos to view as chapter-wise it will be very helpful like you've had given for your previous videos.., it can make your videos easier to watch. can u allow the automatic chapters and key moments in your you tube settings for this video

[@Nareshvaithi]

Best react js tutorial in 2024

[@victormusaogima710]

thank you sir

[@himanshujain115]

thankyou so much bhaiya

[@cjt9150]

liked and subscribed, kindly add react advanced course using typescript.

[@jmarmedia3488]

This is really informative

[@Neha-oe9zr]

Thanks!

[@sangammukherjee]

@@Neha-oe9zr wow. Thank you 😀

[@venkatachakrapaninandi7045]

it would be great if you explain promise() in the ES6 basics.

[@manojarya7676]

Great tutorial ❤

[@aspis7609]

Gonna watch full video

[@sjsuniti9485]

Amazing explanation ❤

[@sangammukherjee]

thanks

[@kanhapise]

Amazing 🎉

[@Hamza__Sardar_Khan]

Perfect Literally Perfect ! 🥰

[@gourabbistu9426]

thnks man , please start a backend series

[@anushkachawla1019]

Bhaiya I request ki aap Hindi me b video bnaooo plz I request.... English me koi problem nhi h but merko Hindi me padhne me zyada smjh me aata h plz 😊

[@johnaigbe2200]

Thanks alot

[@binitswalsingh]

good Chenal

[@sundarapandim1104]

sir..kindly post video about NextJS full course video..i am really waiting

[@anushkachawla1019]

Amazing bro ❤️✨

[@diptamoy12]

Great channel ❤, please, now cover backend....

[@latakantsharma3134]

It's really informative, but if you add a timestamp on video... Will be very helpful for the viewers

[@sangammukherjee]

Added

[@ANIRUDHGV-l7b]

@@sangammukherjee actually not that way of adding timestamps in pinned comment ,try adding timestamps as chapters that would even optimize ur search algorithm's recommendation

[@daresamiuel]

Awesome 🎉