plug-n-play / the-beginners-guide-to-react

A Beginners Guide to React 2020

These notes are intended to be used and studied in tandem with Kent C. Dodds's A Beginners Guide to React (2020) course.

Generally, there is one document for each lesson in the course. Each section contains a link to the video and the code corresponding to that.

Course Goal

This course is for React newbies and anyone looking to build a solid foundation. It’s designed to teach you everything you need to start building web applications in React.

Table of Contents

• 00. A Beginners Guide to React Introduction
• 01. Create a User Interface with Vanilla JavaScript and DOM
• 02. Create a User Interface with React’s createElement API
• 03. Create a User Interface with React’s JSX syntax
• 04. Use JSX effectively with React
• 05. Render two elements side-by-side with React Fragments
• 06. Create a Simple Reusable React Component
• 07. Validate Custom React Component Props with PropTypes
• 08. Understand and Use Interpolation in JSX
• 09. Rerender a React Application
• 10. Style React Components with className and inline Styles
• 11. Use Event Handlers with React
• 12. Manage state in a React Component with the useState hook
• 13. Manage side-effects in a React Component with the useEffect hook
• 14. Use a lazy initializer with useState
• 15. Manage the useEffect dependency array
• 16. Create reusable custom hooks
• 17. Manipulate the DOM with React refs
• 18. Understand the React Hook Flow
• 19. Make Basic Forms with React
• 20. Make Dynamic Forms with React
• 21. Controlling Form Values with React
• 22. Using React Error Boundaries to handle errors in React Components
• 23. Use the key prop when Rendering a List with React
• 24. Lifting and colocating React State
• 25. Make HTTP Requests with React
• 26. Handle HTTP Errors with React
• 27. Install and use React DevTools
• 28. Build and deploy a React Application with Codesandbox, GitHub, and Netlify
• 29. A Beginners Guide to React Outro

Contributors ✨

Thanks goes to these wonderful people (emoji key):

Lauro Silva 🖋

rosaxny 🖋

Koji 🖋

Phạm Ngọc Hòa 🖋