About
About Us
Help
Privacy Policy
Terms of Service
LearnDesk
Learn
Academics
Business
Creative
Health and Fitness
Lifestyle
Personal Development
Software
Topics
Admissions
Engineering
Hardware
Hospitality
Humanities
Chinese
Languages
Maths
Pharma
View All Topics
Topics
Accounting
Advertising
Analysis
Analytics
Business Communication
eCommerce
Entrepreneurship
Finance
Finance - India
Freelancing
View All Topics
Topics
Arts & Crafts
Audio Editing
Audio Production
Dance
Design
Film Production
Music
Photography
Video Production
Writing
View All Topics
Topics
Dieting
Fitness
Food Safety
Games
Medical
Medical Professionals
Meditation
Mental Health
Pregnancy
Safety & First Aid
View All Topics
Topics
Beauty & Makeup
Food
Fashion
Gaming
Home Improvement
Parenting
Pet Care & Training
Relationships
Sustainable Living
View All Topics
Topics
Career Development
Learning
Religion and Spirituality
Self-Improvement
View All Topics
Topics
Accounting
Amazon Web Services
App Development
Continuous Integration
Backup Software
Business Automation
Computational Fluid Dynamics
Business Intelligence
Computer Aided Design (CAD)
View All Topics
Teach
Teach Online
Schedule
Items
Billing
Users
Marketing
Analytics
Settings
Change School
Account
Log In
Sign Up
React Tutorial and Projects Course
Introduction and Setup
Course Intro
Preview
What is React
Preview
Course Structure
Course Requirements
Dev Environment Setup
Text Editor Setup
Install create-react-app
Command Line Basics
NPM Basics
What is create-react-app, Babel, Webpack
Install create-react-app
create-react-app Folder Structure
React Basics Tutorial
First React Component
First React Component in Detail
React JSX Rules
Nested Components and ES6
Mini Book Project
CSS in React
Javascript in JSX
Props
More Props and Destructuring
Children Props
Person List Project
Intro
Preview
Main Project
Finished Project
React Basics Tutorial Continued
Import and Export (ES6 Modules)
Class Based Components in React
Functional VS Class Based Components
State
Alternative State Syntax
Book Mini Project
Events
this.setState
Passing Methods and "Prop Drilling"
Passing Methods to Children Components
Conditionals in JSX
City Tours Project
Intro
Preview
Font Awesome Update
Setup Files
Install and Setup
Navbar Component Logic
Navbar Component SASS
Main Project Structure
TourList Component
Tour Component Logic
Tour Component Styling
Tour Info Toggle
Tour Component Delete
Deploy on Netlify with Drag and Drop
Deploy on Netlify with Continuous Deployment
Finished Project
React Basics Tutorial Continued
Prop Types
isRequired and defaultProps
PropTypes : ObjectShape
Controlled Inputs and Form Submission
Controlled Inputs and Use Case
Uncontrolled Inputs with ref
React Fragment and this.setState() Asynchronous
Todo List Project
Intro
Preview
Font Awesome Update
Setup
Bootstrap and Folder Structure
Github and Netlify Pipeline
App Component
Input Component
Handle Change and HandleSubmit
Todo List Component
Todo Item Component
Clear List and Delete Method
Edit Method
Finished Application
Finished Project
Food2Fork Recipe App
Intro
Preview
Project Setup Files
Setup
Font Awesome Update
Fonts-FontAwesome-Setup Files
Bootstrap - Main CSS Setup
Github-Netlify-Continuous Deployment
React Router Intro
Application Page Structure
React Router Setup
Navbar Component
Header Component
Default Page
Recipe Page Structure
Search Component
Food2Fork API Overview
Recipe List Component
Recipe Component
Single Recipe Page
Single Recipe Page Ajax Request
Environment Variables
Recipe Page Ajax Request
Search Functionality
Finished Project
Beach Resort Project
Intro
Preview
CSS and React Hooks Info
Project Setup Files
Scaffold React Application
Project Setup
Page Setup
Router Setup
Navbar Component
Hero Component
Banner Component
Services Section
Local Data
Context API Setup
Format Data
Loading Setup
Featured Completed
Room Component
getRoom Function
Single Room Setup
Single Room Hero
Styled-Hero
Single Room Complete
Room Container
Room List
Room Filter Setup
Type Filter
Capacity Filter
Price Filter
Size-Checkbox Filter
Contentful Interface
Content Model
Content
Consume Content
Deploy on Netlify
Finished Project
Tech Store
Intro
Preview
Setup Files
Setup and Installs
Google Fonts, CSS Variables and App.css
Github - Netlify Pipeline
React-Icons Intro
Styled-Components Intro
Folder and Page Structure
React Router Setup
Navbar-Sidebar-Sidecart-Footer
Context API Intro
Context API Setup
Navbar Context API
Navbar Component
Sidebar Component
Sidecart Component
Hero Component
Main Links Class
Default Page
About Page and Title Component
Contact Page
Formspree
Footer
Home Page Services Section
Products Data Intro
Setup State in Context
SetProducts
Image URL Fix
Featured Products Section
Product Component
All Products Section
AddToCart Method
AddTotals Method
SyncStorage Method
SetSingle Product Method
Tech Store Project Continued
SetSingleProduct Page
SideCart Component
Cart page Method Placeholders
CartPage Component Setup
CartPage Setup
Cart Columns Component
Cart Totals Component
Cart List Component
Cart Item Component
Increament Method Logic
Remove Item Logic
Clear Cart and Decrease Method Logic
Filter Products Context Setup
Filter Products Product Component Setup
Product Filter Component
Select Input Logic
Handle Change Method Logic
Sort Data Method Logic
Contentful Intro
Contentful Interface
Setting Up Content Model
Adding Content
Retrieve Content
Setting Up Environment and Build Variables
Image Fix
Paypal Button Setup
React Router Netlify Fix
Finished Project
Budget Calculator Project
Intro
Preview
Project Setup Files
Bootstrap React App
Folder Structure
Initial List
useState Intro
App Component
Expense List
Expense Item
Expense Form
Controlled Inputs
Handle Submit
Alert Component
Clear Items
Handle Delete
Handle Edit
LocalStorage API
useEffect
Finished Project
Intro
React Tutorial and Projects Course
Tech Store
By:
John Smilga
12 minutes
Share
Share the link to this page
Copied
Facebook
Twitter
WhatsApp
LinkedIn
Email
Add to Calendar
Add the class to your calendar
Add to Google Calendar
Add to Apple Calendar
Add to Yahoo Calendar
Add to Outlook Calendar
Print
Completed
Previous
Next
Sign Up
Signup to access thousands of classes
Continue with Facebook
Continue with Google
OR
Continue with Email
Already a member?
Log In
By registering for a LearnDesk account, you agree to our
Terms of Service
and
Privacy Policy
.
Share
Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.
Share with Google Contacts