We just published a full React course for beginners on the freeCodeCamp.org YouTube channel.
This course is unlike most of the other React courses out there today.
Instead of just a single teacher, we've brought together an all-star line up of instructors to teach this course. These three instructors are some of the most popular instructors on our channel and have received well over ten million views on other tutorials. Learning from a variety of perspectives can help you solidify your understanding of key React concepts.
This is a project-based course, and it focusses on teaching you everything you need to know to start creating your own React applications. First, Gavin Lon will start from the absolute beginning and teach you the basics of React though building a simple single-page application to keep track of team members. Gavin has been a software developer for over 20 years and he's great at passing down the wisdom he's learned over the years.
Next, you will learn how to make a meals app from John Smilga. John is one of the most viewed instructors on our entire channel so you are definitely in good hands for this second project. He will teach you how to fetch data from an external API to use in this React application.
Finally, you will learn how to create a simple stock trading app from Sanjeev Thiyagarajan. You will use what you've learned so far and apply it to an application that gets data from an API and stores data to localstorage. Among other things, Sanjeev previously created one of the most popular and comprehensive API development courses in the world so he is the perfect person to teach you more about using APIs with React.
And to follow along with this course, all you need is a web browser. Every project in this course is developed using the Replit online IDE. Replit provided a grant that made this course possible.
Below are the sections covered in this course.
- What is Replit?
- What is React?
- Create a Repl
- Create Functional Components
- Install Bootstrap 5
- Implement the useState Hook in a Functional Component
- Upload Image Files to Replit
- Create JSX Code to Render Bootstrap Cards for Employees
- Create Teams DropDown List
- Move State Related Functionality to the App Component
- Understanding Props
- LocalStorage and the useEffect Hook
- Routing, react-router-dom package, Navigation
- Create Employee Component
- Abstract Responsibilities Into Functional Components
- Implement Media Queries
- Using Context to Reduce or Avoid Prop Drilling
- Course Wrap up
- Context API
- Data Fetching
- Meals Component
- Search Component
- Modal Component
- Favorites Component
- Initialize Project
- React Router
- Fetching Data From API
- Multiple Requests with Promise.all()
- Map Method for rendering lists
- Rendering Table of Stocks
- Color Coding data
- Autocomplete Search Component
- Context API
- Navigating Between Pages
- Fetching Historical Data
- Formatting Data
- Working with Charts
- Chart Time Toggle
- Delete Stock (Event Propagation)
- Stock Data
- Local Storage
Watch the full course below or on the freeCodeCamp.org YouTube channel (8-hour watch).