Free Projects , Project ,

First React Project

If you are new to React then this project is for you as we will cover all the basics of React in this project. In this project we are going to make a contact manager app, using different concepts of hooks, props, components and routing

What will you Learn in the Project?

This is the very first project which you shall take when you are starting your journey for React. You will learn the following as part of this project:

  1. How to work with the components?

  2. How to work with the Props and passing data?

  3. How to work with Use state and use Effect hooks?

  4. How to work with Axios, to fetch, Insert and update data?

  5. How to work with Routing and Navigation?

  6. How to work with a Search Bar and filter data?

Tools Used

Visual Studio Code

Tasks Performed

We are going to perform the following tasks in this project:

Task-1: Setup and Create React App

Task-2: Create React “Hello World” Component

Task-3: Create the class Components and Functional Components

Task-4: Work on Props and Pass Data through parent to child and add images

Task-5: Create Use State and Use Effect using hooks to update the state

Task-6: Create Routing and Navigation, Pass the data in route state

Task-7: Using Axios, call API, and fetch, delete and update the data

Task-8: Create a search bar and apply filter method

Course Content

Expand All
Solution Code
+2 enrolled
Not Enrolled

Skills you will develop

Set up React app

Functional and Class components

Work with Props

Work with Axios

Make Routing and navigation

Share with Friends and earn points!!