Get started with React.js & React Router 6+

Video Description

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!