Skip to content
/ React-Mastery-Lectures-Code-Practice Public

This is the complete guide for learning React! This repository contains notes and code practice that I’ve had on my local computer for the past three months. Although the content has been ready for a while, I’m now excited to finally share it with you. Happy coding 👍

1 star 0 forks Branches Tags Activity
Star
Notifications You must be signed in to change notification settings

AsadKhan911/React-Mastery-Lectures-Code-Practice

BranchesTags

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

28 Commits
Lecture 01(Intro to React Js + Installation)
Lecture 01(Intro to React Js + Installation)
 
 
Lecture 02(Using create-react-app)
Lecture 02(Using create-react-app)
 
 
Lecture 03(What is JSX)
Lecture 03(What is JSX)
 
 
Lecture 04(Project 1 using react)
Lecture 04(Project 1 using react)
 
 
Lecture 05(Props & PropTypes in react)
Lecture 05(Props & PropTypes in react)
 
 
Lecture 06(State & Event Handling)
Lecture 06(State & Event Handling)
 
 
Lecture 07(Adding more logic to our project 1)
Lecture 07(Adding more logic to our project 1)
 
 
Lecture 08(Creating Enable Dark Mode Button using useState Hook)
Lecture 08(Creating Enable Dark Mode Button using useState Hook)
 
 
Lecture 09(Improving Dark Mode)
Lecture 09(Improving Dark Mode)
 
 
Lecture 10(Adding auto dismising alert messages)
Lecture 10(Adding auto dismising alert messages)
 
 
Lecture 11(Changing title dynamically & adding favicn to textutils)
Lecture 11(Changing title dynamically & adding favicn to textutils)
 
 
Lecture 12(React Router Setup)
Lecture 12(React Router Setup)
 
 
Lecture 13(Excercise 2)
Lecture 13(Excercise 2)
 
 
Lecture 14(Second project + Class based components)
Lecture 14(Second project + Class based components)
 
 
Lecture 15(API Key for news app)
Lecture 15(API Key for news app)
 
 
Lecture 16(State in class based components)
Lecture 16(State in class based components)
 
 
Lecture 17(Looping through an array in JSX to display newsItems from state)
Lecture 17(Looping through an array in JSX to display newsItems from state)
 
 
Lecture 18(Using Fetch API in react)
Lecture 18(Using Fetch API in react)
 
 
Lecture 19(Adding previous&next button in newsWave)
Lecture 19(Adding previous&next button in newsWave)
 
 
Lecture 20(Adding loading spinner & variable pageSize)
Lecture 20(Adding loading spinner & variable pageSize)
 
 
Lecture 21(Adding Categories&Prototype to newsWave app)
Lecture 21(Adding Categories&Prototype to newsWave app)
 
 
Lecture 22(Adding new categories using React Router)
Lecture 22(Adding new categories using React Router)
 
 
Lecture 23(Refactoring news component to use the same function)
Lecture 23(Refactoring news component to use the same function)
 
 
Lecture 24(React component lifecycle&methods)
Lecture 24(React component lifecycle&methods)
 
 
Lecture 25(Adding infinite scroll to newsWave app)
Lecture 25(Adding infinite scroll to newsWave app)
 
 
Lecture 26(Adding top loaded bar to NewsWave)
Lecture 26(Adding top loaded bar to NewsWave)
 
 
Lecture 27(Environmental Variables in React)
Lecture 27(Environmental Variables in React)
 
 
Lecture 28(Intro to React Hooks)
Lecture 28(Intro to React Hooks)
 
 
Lecture 29(Chaning our newsWave app to function based component)
Lecture 29(Chaning our newsWave app to function based component)
 
 
Lecture 30(Adding sticky navbar to newsWave)
Lecture 30(Adding sticky navbar to newsWave)
 
 
Lecture 31(Third Project auraWrites)
Lecture 31(Third Project auraWrites)
 
 
Lecture 32(AuraWrites DB&Express server setup)
Lecture 32(AuraWrites DB&Express server setup)
 
 
Lecture 33(Creating routes&scehma for storing notes and users)
Lecture 33(Creating routes&scehma for storing notes and users)
 
 
Lecture 34(Storing Data into the database using mongoose)
Lecture 34(Storing Data into the database using mongoose)
 
 
Lecture 35(Adding data validator using express-validator)
Lecture 35(Adding data validator using express-validator)
 
 
Lecture 36(Creating thunder client collections to manage requests)
Lecture 36(Creating thunder client collections to manage requests)
 
 
Lecture 37(Understanding passwrod hashing , Salt&Pepper)
Lecture 37(Understanding passwrod hashing , Salt&Pepper)
 
 
Lecture 38(Hashing passwords using bcryptjs in Nodejs)
Lecture 38(Hashing passwords using bcryptjs in Nodejs)
 
 
Lecture 39(Creating login endpoint & sending auth token)
Lecture 39(Creating login endpoint & sending auth token)
 
 
Lecture 40(Creating a middleware to decode user from a JWT)
Lecture 40(Creating a middleware to decode user from a JWT)
 
 
Lecture 41(Fetching all notes&adding a note)
Lecture 41(Fetching all notes&adding a note)
 
 
Lecture 42(Endpoint for updating an existing note)
Lecture 42(Endpoint for updating an existing note)
 
 
Lecture 43(Endpoint for deleting a note)
Lecture 43(Endpoint for deleting a note)
 
 
Lecture 44(AuraWrites react project setup,moving towards frontend)
Lecture 44(AuraWrites react project setup,moving towards frontend)
 
 
Lecture 45(Intro to Context API)
Lecture 45(Intro to Context API)
 
 
Lecture 46(useContext & useEffect Hook using context API)
Lecture 46(useContext & useEffect Hook using context API)
 
 
Lecture 47(useLocation Hook in react)
Lecture 47(useLocation Hook in react)
 
 
Lecture 48(Fetching notes from context)
Lecture 48(Fetching notes from context)
 
 
Lecture 49(Adding noteItem in a seperate note component)
Lecture 49(Adding noteItem in a seperate note component)
 
 
Lecture 50(Adding font awesome to notes app)
Lecture 50(Adding font awesome to notes app)
 
 
Lecture 51(Adding addNote component)
Lecture 51(Adding addNote component)
 
 
Lecture 52(Deleting a note)
Lecture 52(Deleting a note)
 
 
Lecture 53(Adding fetch notes functionality)
Lecture 53(Adding fetch notes functionality)
 
 
Lecture 54(Adding a Modal for editing notes
Lecture 54(Adding a Modal for editing notes
 
 
Lecture 56(Updating Notes on edit in UI)
Lecture 56(Updating Notes on edit in UI)
 
 
Lecture 57(Adding login component)
Lecture 57(Adding login component)
 
 
Lecture 59(Intro to redux and setting up project)
Lecture 59(Intro to redux and setting up project)
 
 
Lecture 60(Creating a reducer and action creator in redux)
Lecture 60(Creating a reducer and action creator in redux)
 
 
Lecture 61(Creating a redux store)
Lecture 61(Creating a redux store)
 
 
Lecture 62(Accessing state in redux)
Lecture 62(Accessing state in redux)
 
 
Lecture 63(Updating state from a different component in redux)
Lecture 63(Updating state from a different component in redux)
 
 
README.md
README.md
 
 

Repository files navigation

React-Mastery-Lectures-Code-Practice

Welcome to this React learning resource! This repository is your go-to destination for mastering React, with everything you need to go from a beginner to an advanced developer. Inside, you'll find a comprehensive collection of detailed lecture notes and practical coding exercises that cover every aspect of React. :))

About

This is the complete guide for learning React! This repository contains notes and code practice that I’ve had on my local computer for the past three months. Although the content has been ready for a while, I’m now excited to finally share it with you. Happy coding 👍

Topics

react redux react-router jsx infinite-scroll environment-variables props axios states functional-components event-handling api-integration component-lifecycle context-api usecontext-hook useeffect-hook usestate-hook class-based-components

Resources

Readme
Activity

Stars

1 star

Watchers

1 watching

Forks

0 forks
Report repository

Releases

No releases published

Packages

No packages published