*** Proof of Product ***
Exploring the Essential Features of “Mosh Hamedani – Mastering React”
Mastering React 16
Don’t get left behind. React is the way forward to building fast, interactive web apps. This course covers everything.
COURSE OVERVIEW
- Beginner to Pro
- 13 hours of HD video
- 220 lessons
- Downloadable content
- Hands-on exercises
- English captions
Clear. Concise. Comprehensive.
Tired of piecing together disconnected tutorials or dealing with rambling, confusing instructors? This course is for you! It’s perfectly structured into a series of bite-sized, easy-to-follow videos that cover both theory and practice.
What You’ll Learn
- Build and deploy fast and interactive React apps with confidence
- Build reusable components
- Build tables and lists with pagination, sorting and searching
- Build forms with validation
- Implement routing with React Router
- Call HTTP services with Axios
- Implement authentication and authorization
- Handle and log errors effectively
- All about Function Components and Hooks
- Share data using React Context
- Deploy your React apps to Heroku
- Write clean, maintainable code like a pro
- Shortcuts to write more code in less time
- And much, much more!
Course Content
13 Hours . 11 Sections . 220 Lessons
Getting Started (28m)
New Version Available
What is React
Setting Up the Development Environment
Your First React App
Hello World
Custom Configs
Full-stack Architecture
Course Structure
Redux?
Follow Me Around
Learning Paths
ES6 Refresher (50m)
Introduction 1m 43s
Let vs Var vs Const 3m 52s
Objects 2m 45s
The this Keyword 2m 49s
Binding this 2m 36s
Arrow Functions 4m 15s
Arrow Functions and this 4m 14s
Array.map Method 3m 36s
Object Destructuring 2m 29s
Spread Operator 4m 02s
Classes 3m 45s
Inheritance 4m 03s
Modules 4m 11s
Named and Default Exports 5m 15s
Components (1h)
Introduction 1m 38s
Setting Up the Project 2m 06s
Your First React Component 5m 20s
Side Note: Class vs Function Components
Specifying Children 4m 16s
Embedding Expressions 4m 50s
Setting Attributes 5m 45s
Rendering Classes Dynamically 4m 18s
Rendering Lists 3m 58s
Conditional Rendering 6m 04s
Handling Events 2m 49s
Binding Event Handlers 4m 36s
Updating the State 2m 14s
What Happens When State Changes 2m 04s
Passing Event Arguments 3m 04s
Setting Up the Vidly Project 5m 38s
Exercises 3m 25s
Building the Movies Component 7m 18s
Deleting a Movie 5m 18s
Conditional Rendering 3m 26s
Summary 0m 36s
Composing Components (1h)
Introduction 0m 45s
Composing Components 3m 45s
Passing Data to Components 3m 11s
Passing Children 3m 10s
Debugging React Apps 4m 09s
Props vs State 2m 24s
Raising and Handling Events 4m 52s
Updating the State 4m 38s
Single Source of Truth 3m 55s
Removing the Local State 6m 47s
Multiple Components in Sync 5m 53s
Lifting the State Up 5m 36s
Stateless Functional Components 2m 29s
Destructuring Arguments 2m 00s
Lifecycle Hooks 1m 38s
Mounting Phase 5m 34s
Updating Phase 4m 20s
Unmounting Phase 1m 26s
Exercise- Decrement Button 1m 05s
Solution – Decrement Button 4m 53s
Exercise- Like Component 1m 44s
Solution- Like Component 12m 26s
Summary 0m 42s
Pagination, Filtering, and Sorting (2h)
Introduction 1m 08s
Exercise- Pagination Component 1m 01s
Pagination- Component Interface 3m 47s
Pagination- Displaying Pages 6m 48s
Pagination- Handling Page Changes 5m 49s
Pagination- Paginating Data 6m 14s
Pagination- Type Checking with PropTypes 4m 56s
Exercise- ListGroup Component 1m 24s
Filtering- Component Interface 5m 32s
Filtering- Displaying Items 3m 57s
Filtering- Default Props 2m 06s
Filtering- Handling Selection 4m 20s
Filtering- Implementing Filtering 2m 59s
Filtering- Adding All Genres 3m 39s
Sorting- Extracting MoviesTable 5m 19s
Sorting- Raising the Sort Event 3m 28s
Sorting- Implementing Sorting 5m 13s
Sorting- Moving Responsibility 5m 15s
Sorting- Extracting TableHeader 7m 44s
Sorting- Extracting TableBody 3m 12s
Sorting- Rendering Cell Content 8m 02s
Sorting- Unique Keys – Final 2m 58s
Sorting- Adding the Sort Icon 3m 57s
Sorting- Extracting Table 3m 51s
Sorting- Extracting a Method 3m 18s
Destructuring Arguments 0m 58s
Summary 0m 51s
A Quick Note
Routing (56m)
Introduction 0m 33s
Setup 1m 46s
Adding Routing 4m 15s
Switch 2m 26s
Link 4m 20s
Route Props 2m 10s
Passing Props 2m 35s
Route Parameters 3m 32s
Optional Parameters 2m 06s
Query String Parameters 3m 51s
Redirects 3m 06s
Programmatic Navigation 2m 20s
Nested Routing 4m 35s
Exercises- NavBar and Routing 1m 43s
Adding React Router 1m 26s
Adding Routes 4m 57s
Adding the NavBar 4m 39s
Linking to the MovieForm 4m 42s
Summary 0m 31s
Forms (2h)
Introduction 0m 38s
Building a Bootstrap Form 5m 34s
Handling Form Submission 2m 00s
Refs 3m 58s
Controlled Elements 4m 32s
Handling Multiple Inputs 2m 49s
Common Errors 2m 28s
Extracting a Reusable Input 3m 57s
Validation 2m 56s
A Basic Validation Implementation 3m 11s
Displaying Validation Errors 3m 42s
Validation on Change 4m 19s
Joi 4m 33s
Validating a Form Using Joi 4m 43s
Validating a Field Using Joi 5m 22s
Disabling the Submit Button 1m 11s
Code Review 3m 13s
Extracting a Reusable Form 4m 51s
Extracting Helper Rendering Methods 8m 18s
Register Form 1m 42s
Code Review 1m 10s
Exercise 2- Movie Form 3m 18s
Code Review 8m 24s
Exercise 3- Search Movies 1m 22s
Code Review 5m 12s
Calling Backend Services (2h)
Introduction 1m 13s
JSON Placeholder 2m 54s
Http Clients 2m 56s
Getting Data 5m 26s
Creating Data 4m 52s
Lifecycle of a Request 2m 50s
Updating Data 4m 14s
Deleting Data 1m 35s
Expected vs Unexpected Errors 6m 40s
Handling Unexpected Errors Globally 7m 54s
Extracting a Reusable Http Service 3m 43s
Extracting a Config Module 1m 36s
Displaying Toast Notifications 2m 56s
Logging Errors 5m 47s
Extracting a Logger Service 4m 25s
Vidly Backend 1m 50s
Installing MongoDB on Mac 3m 58s
Installing MongoDB on Windows 5m 39s
Setting Up the Node Backend 2m 44s
Disabling Authentication 4m 01s
Exercise- Connect Movies Page to the Backend 1m 56s
Adding Http and Log Services 2m 38s
Replacing FakeGenreService 3m 23s
Replacing FakeMovieService 5m 48s
Extracting a Config File 1m 54s
Exercise- Connect Movie Form to the Backend 0m 56s
Populating the Form 3m 45s
Refactoring 2m 30s
Saving the Movie 2m 40s
Refactoring 2m 36s
Authentication and Authorization (1h)
Introduction 0m 49s
Registering a New User 2m 37s
Submitting the Registration Form 4m 30s
Handling Registration Errors 1m 58s
Logging in a User 1m 43s
Submitting the Login Form 2m 23s
Handling Login Errors 1m 51s
Storing the JWT 3m 04s
Logging in the User upon Registration 5m 37s
JSON Web Tokens 3m 59s
Getting the Current User 4m 18s
Displaying the Current User on NavBar 4m 48s
Logging out a User 2m 44s
Refactoring 10m 03s
Calling Protected API Endpoints 4m 10s
Fixing Bi-directional Dependencies 2m 43s
Authorization 6m 30s
Showing or Hiding Elements based on the User 2m 40s
Protecting Routes 2m 50s
Extracting ProtectedRoute 5m 55s
Redirecting after Login 5m 40s
Exercise 0m 19s
Hiding the Delete Column 4m 19s
Deployment (33m)
Introduction 0m 38s
Environment Variables 4m 58s
Production Builds 2m 48s
Getting Started with Heroku 2m 06s
MongoDB in the Cloud 2m 35s
Adding Code to a Git Repository 3m 05s
Deploying to Heroku 3m 01s
Viewing Logs 2m 40s
Setting Environment Variables on Heroku 4m 37s
Preparing the Font-end for Deployment 4m 09s
Deploying the Front-end 2m 38s
Advanced Topics (1h)
Introduction 0m 31s
Source Code
Setting Up the Development Environment 3m 13s
Higher Order Components 2m 04s
Implementing a Higher Order Component 8m 35s
Hooks 3m 06s
The useState Hook 8m 30s
The useEffect Hook 5m 46s
Custom Hooks 3m 04s
Fetching Data with Hooks 4m 37s
Context 2m 10s
Context in Class Components 9m 46s
Context in Functional Components3m 33s
Updating the Context 7m 06s
Consuming Multiple Contexts 2m 24s
Thank You!
What to Learn Next
Who Is This For?
- Anyone wanting to learn front-end development with React
- Front-end developers familiar with other libraries and frameworks such as Angular or Vue who want to add React to their toolbox
- Back-end developers who want to transition to full-stack development
Prerequisites
All you need is some basic, beginner-level familiarity with JavaScript.
Here are the courses we recommend if you need to strengthen the fundamentals.
HELLO,
I’m Mosh Hamedani.
Are you feeling stuck or overwhelmed in your coding journey? Don’t worry, I’ve got your back! Together, we’ll work to level up your skills, increase your earning potential, and build a brighter future.
Please see the full list of alternative group-buy courses available here: https://lunacourse.com/shop/
