Get started with React.js & React Router 6+

React.js is the most popular frontend JavaScript library you can learn these days. Get started with React.js, its core concepts & advanced topics like routing with React Router 6.4+.
🖥️ Official Website & Courses
https://academind.com/courses/

👨‍💻 Learn React.js Today
https://acad.link/reactjs

📝 Other Resources
Bestselling + 5 ⭐️ Rated React Book: https://www.amazon.com/React-Key-Concepts-Consolidate-knowledge-ebook/dp/B0B3XRRYHN

👋 Social Media
https://twitter.com/maxedapps
https://twitter.com/academind_real
https://www.instagram.com/academind_real/
https://www.facebook.com/academindchannel/

💬 Academind Community on Discord
https://discord.gg/gxvEWGU
———-
🎓 Course content:
00:00:00: Introduction
00:01:03: What Is React?
00:06:37: React requirements
00:08:43: Creating a React project
00:12:07: Exploring a new React project
00:15:31: Understanding how React works & the role of components
00:23:14: Building & using a custom component
00:34:26: Outputting dynamic values
00:39:27: Reusing components
00:45:24: Working with “props”
00:51:35: Styling & working with CSS Modules
01:01:39: Time to practice
01:08:07: Preparing the app for “state”
01:11:49: Listening to (user) events
01:19:37: Adding & using “state” (via useState())
01:29:33: Lifting state up
01:38:38: The special “children” prop
01:45:56: Rendering content conditionally
01:54:52: Sharing components & more state management
02:02:39: Adding form buttons
02:06:10: Handling form submission
02:12:25: Updating state based on previous state
02:17:53: Outputting list data
02:24:29: Connecting frontend & backend
02:30:36: Sending a POST request
02:34:46: Handling side effects with useEffect()
02:43:48: Handling “loading” state
02:48:08: Understanding & adding “Routing”
02:52:01: Adding routes with “React Router” (v6+)
02:57:34: Adding layout routes
03:01:40: Refactoring route components & more nesting
03:07:12: Adding links & navigation
03:15:19: Data fetching via “loader” functions
03:24:23: Submitting data via “action” functions
03:35:28: Adding dynamic routes
03:44:06: Summary
———-
📁 Attachments:
Starting project: https://github.com/academind/react-complete-guide-code/blob/zz-reactjs-summary-updated/extra-files/starting-project.zip
Extra CSS & JS files: https://github.com/academind/react-complete-guide-code/tree/zz-reactjs-summary-updated/extra-files
———-
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!