Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/chetannada/reactjs-projects

'React.js Projects' is a Repository containing 'Awesome Machine Coding React.js Projects' with Live Project App Link 😍 which is helpful for both Beginner and Experience Developer. Stay up-to-date with your Practical React.js skills with this repository.
https://github.com/chetannada/reactjs-projects

machine-coding-react-project project-collection project-repository react reactjs reactjs-awesome-projects reactjs-cool-projects reactjs-practice reactjs-practice-updates reactjs-project reactjs-project-repository reactjs-projects reactjs-updates reactrouter tailwindcss

Last synced: 30 days ago
JSON representation

'React.js Projects' is a Repository containing 'Awesome Machine Coding React.js Projects' with Live Project App Link 😍 which is helpful for both Beginner and Experience Developer. Stay up-to-date with your Practical React.js skills with this repository.

Awesome Lists containing this project

README

        

# ❤️ React.js Projects 🚀

Welcome to `ReactJs Projects` Repository which containing `Awesome Machine Coding React.js Projects` with Live URL which is helpful for both Beginner and Experience Developer. Tech Stack used: `React.js, Javacript, HTML, CSS, TailwindCSS, Vite, Redux Toolkit`

- [🚀 _Live Project App Link_ 😍](https://reactjs-projects-app.netlify.app/)

# 🌻 Projects

This repository contains a `Collection of Cool Coding React.js Projects` with Code and Live URL, which helps you to practice yourself in React.js

### 🌱 Structure of this Project

- index.html - _Root index file of Project_
- index.css - _Global CSS file of Project_
- Main.jsx - _Root js/jsx file of Project_
- .env.example - _environment variables for this project to run in development environment (create a new .env file and copy all values from .env.example and fill the actual values)_

## 📚 Project 01 - React Redux Counter App

- 💻 [_Code for this Project_](./src/Projects/Redux-Counter-App/)
- [🚀 _Live Project App Link_ 😍](https://reactjs-projects-app.netlify.app/redux-counter-app)

## 📚 Project 02 - React HTTP GET Requests for NPM API using Fetch in Different way

- 💻 [_Code for this Project_](./src/Projects/React-Fetch-Get/)
- [🚀 _Live Project App Link_ 😍](https://reactjs-projects-app.netlify.app/react-fetch-get)

## 📚 Project 03 - React HTTP POST Requests for Reqres API using Fetch in Different way

- 💻 [_Code for this Project_](./src/Projects/React-Fetch-Post/)
- [🚀 _Live Project App Link_ 😍](https://reactjs-projects-app.netlify.app/react-fetch-post)

## 📚 Project 04 - React Google Auth App

- 💻 [_Code for this Project_](./src/Projects/React-Google-Auth/)
- [🚀 _Live Project App Link_ 😍](https://reactjs-projects-app.netlify.app/react-google-auth)

# 🎻 Prerequisites

Before getting started with the Practicing Projects, you should have a basic understanding of `HTML, CSS and JavaScript`.

# ✏️ Contribute

This repository is an `Open-Source` and `Contributions` are always welcome! If you find an issue in any Projects then create an issue under the Issue section and then create a `Pull Request`. Your contribution will help make this repository a valuable resource for the `React.js Community`.

## 🔥 Clone this Repository

You need to write the following commands on the terminal screen (in vscode) so that you can run this project locally.

```bash
git clone "https://github.com/chetannada/ReactJs-Projects.git"
```

Go to the project directory

```bash
cd ReactJs-Projects
```

Install dependencies

```bash
npm install
```

Start the server

```bash
npm run start
```

This application should now be running on `localhost`. If you want to Fork repository and want to run locally, follow this guidelines [Fork and Clone Github Repository](https://docs.github.com/en/get-started/quickstart/fork-a-repo)

## 🔗 Let's Connect

[![linkedin](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/chetannada/)
[![twitter](https://img.shields.io/badge/Twitter-1DA1F2?style=for-the-badge&logo=twitter&logoColor=white)](https://twitter.com/chetannada)
[![discord](https://img.shields.io/badge/Discord-5865F2?style=for-the-badge&logo=discord&logoColor=white)](https://discordapp.com/users/916005177838956555)