codedamn logocodedamn
Course image for Learn ReactJS by Building 5 Projects

Learn ReactJS by Building 5 Projects

Learning React from the Beginning By Building 6 Awesome Projects

3 hours+ of total content
4.5
30 ratings
199 students enrolled
Course Creator: Pedro Machado

Hang on...

Heads up!

This is an official course from Full Stack Web Developer Learning Path learning path.

Try out the learning path

Goals

  • React Hooks
  • Routing In React
  • State Management in React - Context API
  • Creating API Based React Projects

Description

This is the perfect course to learn ReactJS if you are a beginner. Most programmers agree that the best way to learn a language or a technology is to build something. Therefore this course will teach you guys everything you would need to know in order to build your own awesome website.

The course starts with a simple and beginner-friendly introductory project where I teach you guys the basics of a react application. This includes using states and rendering javascript. Then, we gradually transition towards more complex applications which are meant to teach you the fundamentals.

Some of the projects, can even be included in your programming portfolio!

Course Structure

35 lectures • 03:59:42 total duration

Introduction

(1 lectures • 03 minutes)
  Introduction - Welcome (Watch video)
03:02
  Project Structure (Watch video)
06:36
  Creating Inputs (Watch video)
04:45
  Using States (Watch video)
08:06
  Changing States (Watch video)
07:37
  Conditional Rendering (Watch video)
08:46
  Setting up the UI (Watch video)
05:28
  Add a task to the Todo List (Watch video)
07:02
  Rendering a List (Watch video)
04:43
  Clearing the Input after Adding a Task (Watch video)
06:41
  Deleting a Task (Watch video)
08:38
  Completing a Task (Watch video)
12:17
  Final Episode - Allowing Keyboard Inputs (Watch video)
04:36
  Setting Up 
06:51
  Creating the Menu Page 
05:40
  Global States with the Context API 
07:57
  Creating the Quiz Page 
05:25
  Creating the Questions 
08:06
  Answering Questions 
07:28
  Correct Answers 
06:10
  Keeping the Score 
04:31
  Creating the End Screen 
07:51
  Finishing the Project 
11:42
  Setting the Project Up 
02:44
  Fetching Data from the API 
06:55
  Displaying the API Data 
03:56
  Displaying the Articles 
03:52
  Linking the Articles 
06:40
  Setting up the UI 
06:33
  Searching Games 
10:04
  Displaying the Games 
06:37
  Finishing Search Section 
06:01
  Creating The Deals Section 
10:02
  Finishing Up Deals Section 
05:58
  Implementing SWR 
10:22

Student feedback

4.5
Course Rating

77%

13%

3%

0%

7%

Reviews

profile pic for Arbaz Shaikh
Arbaz Shaikh (@Arbaz2211)
Jan 27, 2022
One of the most important course for practical learning
profile pic for ajinkya
ajinkya (@ajinkya5050)
Jan 26, 2022
very good explain
profile pic for umar daraz
umar daraz (@umardaraz)
Jan 20, 2022
bad experience
profile pic for rcgny
rcgny (@rcgny)
Jan 22, 2022
Pedro does an excellent job of clearly explaining the ReactJs content. For example I did not really understand the useRef hook until he explained it. Thx!
profile pic for Bia Andersson
Bia Andersson (@tba)
Jan 15, 2022
Amazing!

Your Course Instructor

Course Instructor Image

Pedro Machado

Content creator

Hey! My name is Pedro and I run a programming tutorial channel called PedroTech. I produce several videos on both front-end and back-end development using a variety of technologies and languages!

Upgrade to codedamn Pro Plan and unlock more courses for accelerated learning. Unlimited courses, interactive learning and more.

Free

  • HD video content
  • Certificate of completion
  • Mentorship from codedamn staff
  • Support over WhatsApp
  • Full learning path unlocked
  • Unlimited hands-on practice

Pro

  • HD video content
  • Certificate of completion
  • Mentorship from codedamn staff
  • All exclusive courses unlocked
  • Unlimited hands-on practice
Try codedamn Pro (14-day free refund)