Complete React JS Developer Course

React JS is a JavaScript library for building user interfaces. Developed and maintained by Facebook, it has become one of the most popular front-end development tools in recent years. React allows developers to create reusable UI components and efficiently update and render components in real-time. With its focus on declarative programming, efficient updates, and a virtual DOM, React provides a smooth and seamless experience for both developers and users. This course is designed to introduce you to the fundamentals of ReactJS, including components, state, props, and event handling.

---

What you’ll learn

• React fundamentals including components, props, hooks, state, etc
• React hooks such as useState, useEffect, useContext, useReducer, useRef, etc
• Creating custom hooks
• React Router v6 (latest version)
• How to handle global state with context, reducers and hooks
• Firebase 9 authentication, queries, storage
• Deploying React apps to Vercel & Netlify
• Basic Animation with Framer Motion
• Implement Leaflet maps and Swiper sliders

---

Course content: 

Module1: Introduction:

• What is React
• Environment Setup
• Code Repos
• Links & Resources

---

Module 2: React Basics& JSK:

• Create React App
• Initializing React
• Intro To JS
• Dynamic Values & Lists in JS
• Conditionals in JSX

---

Module3: Components, Props & State

• Creating Your First Component & Prop
• Adding Styles To A Component
• State & use State Hook
• Managing Global State
• Card Component & Conditional Styles
• Events & Prop Drilling
• Feedback Stats Component & Reactivity

---

Module4: Forms Validation & Simple Animation

• Form Input & State
• Custom Button Component
• Real-Time Validation
• Rating Select Component
• Add Feedback
• Fade Animation With Framer Motion

---

Module5: Creating Routes 

• Creating Routes (React Router 5
• Upgrading To React Router 6
• Creating Links (v5 & v6)
• NavLink & useParams
• Navigate & Nested Routes

---

Module6: Context API,use Context Hook & Deployment

• Create a Context & Provide
• Get Global State With The useContext Hook
• Moving Functions To Context
• Edit Feedback Event
• Side Effects With useEffect
• Update Feedback Item
• Deploy To Netlify

---

Module7: API& HTTP Requests 

• APIs & Requests Explained
• Setting Up JSON-Server Mock Backend
• Run Client & Server With Concurrently
• Fetch Data From JSON-Server Backend
• Spinner Component
• Add Feedback & Setting a Proxy
• Update & Delete From JSON-Server

---

Module8: House Marketpalce Project Start

• House Marketpalce Project Intro
• App & FIrebase Setup
• Enable Authentication & Create Rule
• Dummy Data & Indexes
• Pages & Routes
• Navbar Component

---

Module9:Firebase Authentication & Profile

• Sign In & Sign Up Form
• Register Use
• Save User To Firestore
• User Sign In
• Alerts With React Toastify
• User Logout
• Display & Update User Details
• Private Route Component & use AuthStatus Hook
• Forgot Password Page
• Google OAuth

---

Module10: Get & Create Listings:

• Explore Page
• Fetch Listings From Firebase
• Listing Item Component
• Offers Page
• Start Create Listing Page
• Create Listing Form
• Get Coords With Geocoding API
• Uploading Images To FIrebase
• Save Listings To Firestore
• Quick Note & Change

---

Module11: Single Listings, Map, Slider& Edit

• Fetch Single Listing
• Listing Details
• Contact Landlord Page
• Leaflet Map
• Listings Page Slider
• Explore Slide
• Profile Listings & Delete
• Load More Pagination
• Edit Listing Icon
• Edit Listing
• Clear Up Console Warnings
• Deploy To Vercel

---

Who this course is for:

• Anyone that wants to become a React developer

---

Course PrerequisIte:

You should know JavasScript pretty well before learning React or any framework

---

International Student Fess: 300 US$

---

---

Related Course

MERN Stack Developer 

Java Spring Boot Microservices training course

Microservices With Node.js and React

Next.js & React – The Complete Guide

 JavaScript Basic To Advance with Projects

Next.js & React – The Complete Guide