Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/packtpublishing/react---the-complete-guide-includes-hooks-react-router-and-redux-second-edition

Code snapshots and materials for our "React - The Complete Guide (Includes Hooks, React Router, and Redux)" Second Edition course
https://github.com/packtpublishing/react---the-complete-guide-includes-hooks-react-router-and-redux-second-edition

hooks javascript programming react react-hooks react-router redux

Last synced: 7 days ago
JSON representation

Code snapshots and materials for our "React - The Complete Guide (Includes Hooks, React Router, and Redux)" Second Edition course

Awesome Lists containing this project

README 

        
# React - The Complete Guide (Includes Hooks, React Router, and Redux) - Second Edition



### This course is now updated for the latest version of React—React 18



This is the code repository for [React - The Complete Guide (Includes Hooks, React Router, and Redux) - Second Edition [Video]](https://www.packtpub.com/product/react-the-complete-guide-includes-hooks-react-router-and-redux-second-edition-video/9781801812603), published by [Packt](https://www.packtpub.com/?utm_source=github). It contains all the supporting project files necessary to work through the book from start to finish.



## About Course



React.js is the most popular JavaScript library you can learn and use these days to build modern, reactive user interfaces for the web. In this course, you will dive into the core concepts of React, gaining a thorough understanding of its purpose and benefits. From building components and creating dynamic UIs to harnessing the full potential of React Hooks and working with state management using the Context API and React Redux, we have got you covered. Learn to build standalone React apps and connect them to backends using HTTP. Master routing and data fetching techniques with React Router. Implement user authentication in React apps and build full-stack applications with Next.js. 



The course includes multiple demo projects, ensuring hands-on experience and practical application. Whether you prefer working locally or in a cloud development environment, we’ve got the flexibility you need. 



We will also dive deep into advanced concepts such as debugging, styling with “Styled Components” and “CSS Modules,” working with Fragments and Portals, managing side effects, form handling with validation, incorporating Redux and Redux Toolkit, and leveraging React with TypeScript. Gain insights into animations and ensure robust code with comprehensive unit testing. 



This updated version includes two new practice projects and an extensively revamped JS Refresher section. The JS Refresher section provides a comprehensive understanding of JavaScript, laying a solid foundation for building React applications. 



By the end of this course, you will be equipped with the skills and knowledge to build robust web applications using React.js confidently. 



## Target Audience



Students who want to learn how to build reactive and fast web apps or want to take their web development skills to the next level can opt for this course.  

  

This course starts with zero knowledge assumed. All you need is basic web development (HTML + CSS) and JavaScript knowledge. However, the course even includes a brief JavaScript refresher to ensure that we are all on the same page. ES6+ JavaScript knowledge is beneficial but not a must-have.  

  

No prior React or any other JS framework experience is required!



## Course Key Features



  •   Learn all the core basics followed by advanced topics in a progressive manner  

  •   Provide amazing user experiences by leveraging the power of JavaScript with ease  

  •   Build powerful, fast, user-friendly, and reactive web apps 
    • 


    ## What You Will Learn
    


  • Learn all about components, props, and dynamic data binding

  • Work with user events and states to create interactive apps

  • Learn all about React Hooks and React components

  • Understand class-based components and functional components 

  • Explore Redux and Redux toolkit

  • Learn to combine React with TypeScript and add animations 
    • 


    ## Author Bio
    


    **Academind GmbH**
    

    Bundling the courses and the knowledge of successful instructors, Academind strives to deliver high-quality online education. The platform covers topics such as web development, data analysis, and more in a fun and engaging way.  

      

    **Maximilian Schwarzmüller**
    

    Since the age of 13, he has never stopped learning new programming skills and languages. In his early days, he started creating websites simply for fun. This passion has remained and shaped his decision to work as a freelance web developer and consultant. Although he started web development on the backend (PHP with Laravel and NodeJS), he has progressed to becoming a front-end developer using modern frameworks such as React, Angular, and VueJS 2 in many projects.  

      

    The most rewarding experience for him is to see how people find new and better jobs, build exciting web applications, acquire amazing projects, or simply enjoy their hobby with the help of his content.
    


    ## Course Table of Contents

    Section 1: Getting Started 	
    

    Section 2: JavaScript Refresher 	
    

    Section 3: React Basics & Working With Components 	
    

    Section 4: Time to Practice - Component Basics [Added in July 2023]	
    

    Section 5: React State & Working with Events 	
    

    Section 6: Rendering Lists & Conditional Content 	
    

    Section 7: Styling React Components 	
    

    Section 8: Debugging React Apps 	
    

    Section 9: Time to Practice - A Complete Practice Project 	
    

    Section 10: Diving Deeper - Working with Fragments, Portals & "Refs" 	
    

    Section 11: Advanced - Handling Side Effects, Using Reducers & Using the Context API 	
    

    Section 12: Practice Project - Building a Food Order App 	
    

    Section 13: A Look Behind The Scenes Of React & Optimization Techniques 	
    

    Section 14: An Alternative Way Of Building Components - Class-based Components 	
    

    Section 15: Sending Http Requests (e.g. Connecting to a Database)	
    

    Section 16: Building Custom React Hooks 	
    

    Section 17: Working with Forms & User Input 	
    

    Section 18: Practice Project - Adding Http & Forms To The Food Order App	
    

    Section 19: Diving into Redux (An Alternative To The Context API)	
    

    Section 20: Advanced Redux	
    

    Section 21: Building a Multi-Page SPA with React Router	
    

    Section 22: Adding Authentication To React Apps	
    

    Section 23: Deploying React Apps	
    

    Section 24: A (Pretty Deep Dive) Introduction to Next.js	
    

    Section 25: Animating React Apps	
    

    Section 26: Replacing Redux with React Hooks	
    

    Section 27: Testing React Apps (Unit Tests)	
    

    Section 28: React + TypeScript	
    

    Section 29: Optional - React Hooks Introduction & Summary	
    

    Section 30: Optional - React Summary & Core Feature Walkthrough	
    

    Section 31: Course Roundup	
    


    # Discord Community

    As a student of this course, you also get free access to our “Academind Community” on Discord: https://discord.gg/gxvEWGU
    


    There, you can find like-minded people, discuss issues, help each other, share progress, successes, and ideas and simply have a good time!
    


    We believe that you learn the most if you don’t learn alone but find learning partners and other people with similar interests. Our community is a great place for this - it’s the perfect complimentary resource for this course.
    


    Joining it is of course free and 100% optional.