Course Introduction
- Welcome To The Course
- What Is React?
- Setting Up Our Environment
Project 1 Start [Github Finder] & React Setup
- Project Introduction
- Code & Resources
- Create React App & File Structure
- CRA Cleanup & Prepare
- Intro To JSX & Fragments
- Expressions & Conditionals In JSX
Components, State & Props
- Components, Props & PropTypes
- Getting Started With Component State
- Lists & Passing State With Props
- Stateless Functional Components
- HTTP Requests & Updating State
- Spinner Component & Refactoring
- Environment Variables
Events, Passing Props, React Router & More
- Events & Search Component
- Passing Props Up & Search
- Clear Users From State
- Alert State & Component
- React Router Setup
- Single User Component & Data
- User Component UI & Layout
- Repos & RepoItem Component & Data
Refactoring To Hooks & Context
- Overview of Hooks & Context
- Search Class to Function With useState Hook
- User Class to Function With useEffect Hook
- App Class to Function Component
- Implementing Context
- Create Reducer & Actions
- Moving User State To Context
- Moving Repos State To Context
- Alert Context Workflow
- Home & NotFound Components
- Prepare & Deploy To Netlify
Project 2 Start [Contact Keeper - MERN] & Express Server Setup
- Project Introduction
- Code & Resources
- MongoDB Atlas Setup
- Dependencies & Basic Express Server
- Backend Routes
- Connect MongoDB To Our App
Backend Users, Contacts & JWT Authentication
- User Model & Validation
- Hash Passwords & Register Route
- Create & Respond With JSON Web Token
- Authenticate Route
- Auth Middleware & Protecting Routes
- Contact Model & Get Contacts Route
- Add Contact Route
- Contact Update & Delete Routes
Client Side Setup & Contacts UI
- Setup React & Concurrently
- Cleanup, Navbar & Router Setup
- Contacts Context & Global State
- Contacts & ContactItem Components
- ContactForm Component
- Delete Contact From UI
- Set & Clear Current Contact
- Edit & Update Contact Action
- Contact Filter Form & State
- Basic Add & Delete Animation
React/Express Authentication
- Auth Context & Initial State
- Register & Login Forms
- Alert Context, State & Component
- User Registration
- Load User & Set Token
- User Login
- Logout & Navbar
- PrivateRoute Component
Contacts API Integration & Deploy
- Add Contact
- Get & Clear Contacts
- Delete Contacts
- Update Contacts
- Prepare & Deploy To Heroku
Project 3 Start [ITLogger - Redux] - Components & UI
- Project Introduction
- Code & Resources
- React & JSON-Server Setup
- Materialize Setup
- SearchBar & Logs Component
- LogItem & Preloader Components
- AddBtn & AddLogModal Components
- Edit & Tech Modal Components
Redux For State Management
- Redux Store & Provider Setup
- Logs Reducer, Actions & Types
- Connecting Redux To a Component
- Add Logs
- Delete Logs
- Update Logs
- Search Logs
Technicians State & Components
