Danh mục
Duocmmo Tedu Tin học văn phòng Laravel Cyberlearn Khoá học miễn phí Tất cả khoá học
Get link khoá học
Trang chủ
Development
Web Development
React JS
React Pro: 60 Projects for Ultimate Web Development Skills

React Pro: 60 Projects for Ultimate Web Development Skills

Loại khoá học: Web Development

Learn React Programming: Develop Web Applications Using Socket, REST APIs, Firebase, React Hooks, Bootstrap, React.js

image
50.000 VND
1.099.000 VND
Đầy Đủ Bài Giảng
Học Online Tiện Lợi
Kích Hoạt Nhanh 2-5 Phút
Thanh toán tự động
Được phép tải xuống

Tổng quan

Nội dung khoá học

Đánh giá

Mô tả

Unlock the full potential of React with "React Mastery," a comprehensive course offering 60 real-world projects that span from fundamentals to advanced topics . In a 60-day journey, transform from a React novice into a seasoned developer capable of crafting complex web applications . Master React fundamentals, explore advanced features like Hooks and Context API, and work with popular libraries such as Redux and Material-UI . By the end of this course, you'll be equipped to build a wide array of projects, from e-commerce platforms to real-time chat applications .

In This Course, We Are Going To Work On 60 Real World React Development Projects Listed Below, Develop Real World Web Applications Using Socket, REST APIs, Firebase, React Hooks, Bootstrap, React . js, Webpack , HTML5 , CSS3 , React- Router .

Project-1: React Photo Editor with CSS & React Filters

Project-2: CodePen Code Editor Clone Using React . js

Project-3: Game Of Thrones App using React . js

Project-4: React Birthday Reminder App Using React Js

Project-5: Search Book (Multipage Library app to search any book ) using react . js, React-Router-Dom, Bootstrap, CSS, Google Books API

Project-6: Tours & Travel Multi Page Website using react . js, CSS, react-router-dom, React Hook

Project-7: React Admin Dashboard Using React . js, Material-Ui, react hooks, React Charts, rc progress

Project-8: Google Map Travel Advisor app using React . js, Geolocation, Google Maps API & Google Places API

Project-9: Interactive Timeline using React, React Hooks, CSS

Project-10: Using Charts in react and creating Different Clickable Links on Charts in React, using React, CSS, Chartjs, Bootstrap


Project-11: Meal Planner App using Spooncular API, React Hooks, CSS, Bootstrap

Project-12: Radio Player App in React using Radio-Browser API CSS, React Hooks

Project-13: Drum Kit using React, React Hooks, CSS, JavaScript, Material-UI

Project-14: Build Dice Game using React, React Hooks, CSS, Javascript

Project-15: Pokemon App using React, React Hooks, CSS, Api, Bootstrap

Project-16: Slot Matching Game using React, React Hooks, CSS, Javascript, Material UI

Project-17: Marvel Charcter App using React, React Hooks, Marvel Api, CSS, Bootstrap

Project-18: Meme Generator App using React, React Hooks, CSS, Bootstrap

Project-19: Photo Collage Maker using React, React Hooks, Bootstrap, CSS, Material-Ui

Project-20: News App using React, React Hooks, CSS, Bootstrap, Api


Project-21: E-Commerce Platform (Amazon Clone) with React & Firebase

Project-22: Real-time Chat Application with React ChatEngine & Socket

Project-23: Movies Streaming App (OTT) with React, Omdb API, and Bootstrap

Project-24: Video Sharing Website with React, YouTube API, and Material-UI

Project-25: To-Do List Web App with React, Material-UI, and State Management

Project-26: Blogging Platform with React, Material-UI, and GNews API

Project-27: Social Networking Site with Material-UI, React Hooks, and Google OAuth

Project-28: Portfolio Resume Website with React, Material-UI, and State Management

Project-29: Emoji Search App with React, React DOM, HTML5, and CSS3

Project-30: Breaking Bad Character Finder with React, React DOM, and React Context


Project-31: Random Quote Generator with React and Heroku Deployment

Project-32: Password Generator App with React, React DOM, HTML5, and CSS

Project-33: Quiz App with React, React DOM, HTML5, and SCSS

Project-34: UnSplash Image Gallery with React and ReactDOM

Project-35: React Router Demo Application with ReactJs, React Router Dom, and Context

Project-36: Book Shelf App with ReactJs, NPM, CSS, and State Management

Project-37: Note Taking App with React and Redux for State Management

Project-38: Contact Register App with React, NPM, and React Context

Project-39: Expense Tracking App with React and State Management

Project-40: Money Management App with React, NPM, and React Context


Project-41: Resort Booking App with React, NPM, and Hooks

Project-42: BMI Calculator with React, NPM, and React Context

Project-43: Furniture Store with React and Redux for State Management

Project-44: Scoreboard App with ReactJs, NPM, and React Context

Project-45: Food Ordering Web App with React, Material-UI, and React Router

Project-46: Weather Web App with React, Open Weather API, and CSS

Project-47: Food Recipe App with React, Edamam API, and Firebase Hosting

Project-48: Shopping Cart App with React, React Hooks, and External API

Project-49: Cafe Menu App with React, React Hooks, and Firebase

Project-50: Cocktail Hub Web App with React, React Hooks, and Context API


Project-51: Review Posting App with React, Material-UI, and CSS

Project-52: Pomodoro Timer App with React, Countdown Timer, and CSS

Project-53: Google Search App with React, Tailwind CSS, Google Search API

Project-54: Tic-Tac-Toe Game with React

Project-55: Word and Letter Counter with React, useState, and JavaScript

Project-56: Currency Converter with React

Project-57: Speech Recognition and Voice Assistant App with React

Project-58: Calculator App with React and Hooks

Project-59: Budget Tracking App with React, Custom Hooks, and Context

Project-60: Music Player (Spotify Clone) with React and Spotify API


Note (Read This): This Course Is Worth Of Your Time And Money, Enroll Now


Bạn sẽ học được gì

Learn and understand what is React and how it works

Build powerful, fast, user-friendly and reactive web apps

Basic to advanced level practical concepts in React development

Manage a project using a package-based architecture

Master the foundational principles of React for efficient web development.

Learn to assemble incredibly reusable React components for diverse projects.

Gain deep insights into the inner workings of the React library.

Create a stunning portfolio featuring real-world React projects.

Yêu cầu

  • Basic knowledge of React

Nội dung khoá học

61 sections

Introduction to the course

2 lectures
Introduction to the course
00:33
Outline of the course
00:40

Project-1: React Photo Editor with CSS & React Filters

12 lectures
Introduction
05:44
Introduction2
00:44
CSS Filters
02:10
Using CSS Filters
07:21
Adding All CSS Filters
06:01
Updating Filter style of image
02:54
Adding Announcement
04:38
Adding onChange event to input
03:38
Adding CSS to navbar _ announcement section
08:21
Adding CSS to image
04:30
Adding CSS to our Filters
03:58
Download the project files
00:01

Project-2: CodePen Code Editor Clone Using React.js

12 lectures
Introduction
01:29
Introduction2
04:33
Creating a react app
02:12
Creating textarea and adding useState hook
04:08
Adding useEffect Hook
04:11
What is an IFrame
01:31
Adding IFrame to show output
03:50
Adding CSS to Header
04:27
Adding CSS to Header Part 2
01:38
Adding CSS to textarea and output section
11:16
Adding LocalStorage Object
10:06
Download the project files
00:01

Project-3: Game Of Thrones App using React.js

20 lectures
Introduction
02:38
Introduction to Game of Thrones App
03:48
Header(Home) Page
04:39
CSS to Header(Home) Page
04:26
Adding Background Image to our Header Page
01:57
Adding Navbar to our App
06:34
Making Api request using fetch method
07:00
Using Map function to render our Api data list
03:55
Giving proper layout to map items
03:45
Adding styles to our map items
06:21
Adding bootstrap row _ column
06:35
React-Router Dom Part-1
04:00
React-Router Dom Part-2
07:15
useParams Hook
02:51
Displaying the data of searched characters
02:09
Quotes Api
03:58
Using Map function to display the Quotes
01:22
Adding Layout _ CSS in a Search File
06:39
Adding material-icons in our code
03:02
Download the project files
00:01

Project-4: React Birthday Reminder App Using React Js

13 lectures
Introduction
04:15
Introduction to our Birthday Reminder App
01:16
Creating React Birthday Reminder App
01:05
Adding data array and additional file to our app
03:00
Code to display the today_s birthday.
05:21
Code to display the upcoming birthday of a person
01:57
Adding a Layout to our Card
04:54
Adding Styles to our Card
07:36
Adding Styles to our Image
07:52
Adding Styles to click div and making our app responsive
02:42
Adding layout to upcoming birthday file
02:13
Adding styles to upcoming birthday file
04:22
Download the project files
00:01

Project-5: Search Book (Multipage Library app to search any book ) using react

22 lectures
Introduction
03:18
Introduction to bookstore
03:13
Creating our react app.
02:05
Navbar
02:51
Adding CSS to our Navbar
04:25
Hero Section
03:33
Adding CSS to our Hero section
09:56
React-Router-Dom Part 1.
05:53
React-Router-Dom Part 2
04:21
How to get your Google API Key
01:16
Google Books API.
01:40
How to use Google Books API in our app
08:08
What is useNavigate Hook
01:24
Adding useNavigate Hook to our project
03:23
useParams Hook
02:26
Adding useParams Hook to our main file
05:53
Adding styles to our main file
07:00
Genre Page
13:43
What is our Search Page
02:25
Displaying different genres
02:29
CSS to genre page
09:21
Download the project files
00:01

Project-6: Tours & Travel Multi Page Website using react.js,CSS,react-router-dom

18 lectures
Introduction - Tours & Travel Multi Page Website
03:28
Introduction to our Travel_ Tour App
02:54
Creating Our React App
02:58
Creating Navbar for our App
01:51
Creating Hero section for our App
04:17
Adding CSS to our Hero section
08:02
Adding Main section to our App
06:22
Adding CSS to Main section
08:09
Making our Main section responsive
01:55
Adding video in our Video section
05:32
Adding CSS to Video section
06:06
Adding Footer
03:55
Code for our Travel Page
03:13
React-Router-Dom
13:00
Pricing Section in our app
01:44
Code for our Pricing Section
12:17
CSS to our Pricing Section
07:46
Download the project files
00:01

Project-7:React Admin Dashboard Using React.js Material-Ui, ReactHooks, React...

21 lectures
Introduction
02:40
Introduction to Admin Dashboard
01:18
Creating a react App.
04:46
Theme
05:33
Navbar
13:29
Adding style to navbar
03:09
Stack
03:58
FlexBox
02:42
Rightbar
06:52
Sidebar
07:03
Nightmode
03:14
ProfileCard1
07:34
ProfileCard2
07:25
ProfileCard3
04:36
Card1
05:13
rc-progress
10:04
Chartjs
12:48
Adding Charts in our app
06:50
Circular Progress
04:00
Adding more style to our App
05:53
Download the project files
00:01

Project-8: Google Map Travel Advisor app using React.js, Geolocation, Google Map

14 lectures
Introduction - Google Map Travel Advisor app using React.js
03:11
Introduction to our Travel Advisor App
03:31
Creating React App
03:31
Home Page
03:52
Adding CSS to our Home Page
10:52
React-Router-Dom Part 1.
05:27
React-Router-Dom Part 2
04:27
Open Trip Map API
02:38
Adding Code to the Main file
08:52
Adding Code to the Detail file
09:14
Adding Layout to our Main page using MUI
10:58
Rendering our Places List using Map
12:25
Adding Map to our App
13:45
Download the project files
00:01

Project-9: Interactive Timeline using React, React Hooks, CSS

6 lectures
Introduction
03:01
Introduction to our Timeline App
03:46
React-Vertical-Timeline package
06:09
Adding events in our timeline
08:06
Adding CSS to our App
15:31
Download the project files
00:01

Project-10: Using Charts in react and creating Different Clickable Links on Char

8 lectures
Introduction
01:53
Introduction to our app
01:53
Using Chartjs
15:13
Creating different types of chart
04:40
Adding layout to our Chart
05:48
Adding CSS to our Chart
03:02
Adding clickable links to the chart
14:44
Download the project files
00:01

Project-11: Meal Planner App using Spooncular API, React Hooks, CSS, Bootstrap

12 lectures
Introduction
02:23
Creating React App _ adding Homepage
13:26
How to use Api in our app
11:51
Bootstrap Layout and Card
04:22
Adding Main section to our App
10:15
Getting Nutritional data and cooking instructions from api
07:40
Working of a model section
06:03
Model Section Part-1
14:55
Model Section Part-2
10:52
Adding Navbar(Calorie Tracker)
07:56
Adding Functionality to our tracker
09:59
Download the project files
00:01

Project-12: Radio Player App in React using Radio-Browser API CSS, React Hooks

9 lectures
Introduction
02:24
Intro to Radio Player
03:12
Installing all dependencies and packages
04:59
How to get data from the api
13:03
Adding genre Button and changing the state of stationType
03:01
Adding Different station Cards
06:46
Adding Audio Player
04:34
Adding styles to our Radio Player
06:41
Download the project files
00:01

Project-13: Drum Kit using React, React Hooks, CSS, JavaScript, Material-UI

6 lectures
Introduction
02:17
Introduction to Drum Kit App
02:11
Creating Layout for our Drum Kit
13:29
Adding Drum Button to out Drum Kit
12:29
CSS Drum
02:23
Download the project files
00:01

Project-14: Build Dice Game using React, React Hooks, CSS, Javascript

8 lectures
Introduction
02:03
Introduction to Dice Game
01:10
Adding Layout to our App
05:17
Generating random numbers on Dice
04:55
Displaying our Game Result
04:20
Adding Instructions to our game
04:15
Adding CSS to our App
09:12
Download the project files
00:01

Project-15: Pokemon App using React, React Hooks, CSS, Api, Bootstrap

11 lectures
Introduction
02:44
Introduction to Pokémon App
01:42
Adding Hero section in Pokemon App
06:14
Fetching Data from Poke Api
07:54
Rendering our Pokémon List
13:36
Adding Previous _ Next Button
07:29
Adding CSS to Pokémon Cards
04:30
Creating Pokémon Component
12:38
Creating Pokémon Component Part 2
04:27
Adding CSS to our App
06:45
Download the project files
00:01

Project-16: Slot Matching Game using React, React Hooks, CSS, Javascript

9 lectures
Introduction
02:15
Introduction to Slot Machine
03:20
Adding MUI Layout to our app
10:33
Adding Layout Part 2
01:54
Adding Css to our Slot Machine
11:49
Adding Functionality to our Slot Machine
09:25
Adding Navbar(Header)
07:21
Adding Functionality to our Navbar
08:48
Download the project files
00:01

Project-17: Marvel Charcter App using React, React Hooks, Marvel Api, CSS, Boots

11 lectures
Introduction
02:46
Introduction to our Marvel App
02:21
Get Api Key
02:55
Bootstrap Row, Column _ Card
03:16
Fetch Data from Marvel Api
05:45
Rendering Our Marvel Characters List
07:10
Adding styles to our Marvel cards
02:39
Adding description to every characters
05:41
Adding Style to our Character Description
03:15
Adding Searchbar to our Marvel App
06:58
Download the project files
00:01

Project-18: Meme Generator App using React, React Hooks, CSS, Bootstrap

7 lectures
Introduction
02:15
Introduction to our Meme Generator App
02:44
Fetch data from meme api
05:12
Adding Bootstrap layout to our memes
07:26
Adding Functionality to View button
05:11
Adding Header to our app
04:19
Download the project files
00:01

Project-19: Photo Collage Maker using React, React Hooks, Bootstrap, Material-Ui

8 lectures
Introduction
03:04
Introduction to Collage Maker App
02:18
Creating Input bars in our App
11:10
Creating Input bar Part-2
03:35
Creating Image list (Collage)
05:27
Adding Functional Buttons to our App
03:37
Adding CSS to our Collage Maker
02:17
Download the project files
00:01

Project-20: News App using React, React Hooks, CSS, Bootstrap, Api

9 lectures
Introduction
03:13
Introduction to News App
02:29
Adding Hero section to our app
13:50
Fetching data from the api
07:33
Creating news cards
12:00
Adding styles to our Card
08:27
Adding Categories to our News App
06:12
Adding Search bar to our App
03:05
Download the project files
00:01

Project-21: E-Commerce Platform (Amazon Clone) with React & Firebase

13 lectures
Intro To The Project
02:35
Getting Started With React
04:52
eShop Header
20:49
eShop Home Page
14:04
React Props
07:19
React Routing
08:44
eShop Checkout Page
20:01
React Context API
20:52
Add To Basket
12:18
Remove From Basket
09:11
Authentication Using Firebase
20:49
Deploying The App
04:58
Download the project files
00:01

Project-22: Real-time Chat Application with React ChatEngine & Socket.io

12 lectures
Intro To The Project
02:22
Getting Started
04:26
React Chat Engine
09:42
Components.
08:18
Chat Feed
16:04
My Message Component
05:37
Their Message Component
07:53
Render Read Receipts
05:52
Message Form
14:49
Login Form
14:07
Finishing Up The Project
05:34
Download the project files
00:01

Project-23: Movies Streaming App (OTT) with React, Omdb API, and Bootstrap

11 lectures
Intro To The Project
03:26
Getting Started
04:15
OMDb API
02:53
Movie List
12:22
MovieListHeading and Searchbox
13:53
Implementing Search Feature
08:29
Add To Favourite
19:08
Remove From Favourites
10:53
Local Storage
07:14
Finishing Up The Project
06:23
Download the project files
00:01

Project-24: Video Sharing Website with React, YouTube API, and Material-UI

11 lectures
Into To The Project
04:38
Getting Started
06:26
React Material-UI
08:24
Youtube API
06:40
SearchBar Component
18:08
React State Hooks
06:37
VideoDetail Component
11:53
VideoList Component
07:20
VideoItem Component
10:39
Finishing Up
06:15
Download the project files
00:01

Project-25: To-Do List Web App with React, Material-UI, and State Management

13 lectures
Intro To The Project
04:24
Getting Started With React
07:38
Header Component
12:30
CreateArea Component
17:22
Add Note
09:23
Add Note Continuation
06:02
CreateArea CSS
06:00
Note Component
10:08
Deleting Note
06:05
Footer Component
03:34
Completing CSS
06:33
Finishing Up
06:47
Download the project files
00:01

Project-26: Blogging Platform with React, Material-UI, and GNews API

11 lectures
Intro To The Project
03:41
Getting Started
09:06
userSlice.js
12:08
store.js _ index.js
07:11
Homepage Component
14:31
Navbar Component
13:04
Finishing Navbar
03:27
Gnews API
03:53
Blogs Component
09:08
Finishing Up The Project
05:48
Download the project files
00:01

Project-27:Social Networking Site with Material-UI, React Hooks, and GoogleOAuth

11 lectures
Intro To The Project
05:43
Getting Started
11:00
Authentication and Security
17:53
Database Encryption
06:11
Environment Variables
05:41
Hashing
07:10
Salting and Hashing
07:31
Cookies
04:40
Sessions
08:23
Google OAuth
10:07
Download the project files
00:01

Project-28:Portfolio Resume Website with React, Material-UI, & State Management

11 lectures
Intro To The Project
03:08
Getting Started
07:23
Dependencies and Components
09:31
React-Router-DOM
07:32
Props and Home Component
06:36
Navbar Component
06:30
About Component
02:34
Destructuring Assignment
09:50
Finishing Component
05:36
Finishing Up The Project
05:50
Download the project files
00:01

Project-29: Emoji Search App with React, React DOM, HTML5, and CSS3

17 lectures
App Introduction
01:13
Creating Our React App
04:42
Adding Folder Structure
05:07
Populating App.jsx
05:28
Creating Header
05:37
Adding CSS to Header
03:59
Adding Search Bar
07:03
Adding State
08:32
Results.jsx
05:31
EmojiResults
05:28
Error
00:36
Adding Styles
10:07
Adding Functions
02:55
Modifying Filter.js
02:17
Final Refactor
03:43
Deployment
06:02
Download the project files
00:01

Project-30: Breaking Bad Character Finder with React, React DOM, and React Conte

14 lectures
App Introduction
01:25
Creating React Application
01:48
House Keeing
04:26
Refactoring The Code in Our App
05:08
Adding State
02:48
Creating SearchBar
05:15
Fetching Data from API
05:31
Adding Code to CharacterList
03:30
Rendering CharcterListItem
08:17
Error Handling
01:56
Configuring Loading Screen
05:37
Adding Styles part-1
06:44
Adding Styles part-2
11:49
Download the project files
00:01

Project-31: Random Quote Generator with React and Heroku Deployment

17 lectures
App Introduction
00:54
Creating React Application
01:36
Hello World Component
03:22
Folder Structure
08:13
Configuring Quotes.jsx
06:49
Destructuring Data
04:10
Adding Styles Part 1
04:38
Adding Button
05:24
Adding Styles Part 2
05:46
Adding API
08:02
Adding Click Handler
08:38
Error Handling
01:28
Adding Footer
04:14
Adding Font Family
02:43
Pushing Code to Github
02:34
Deployment on Heroku
02:54
Download the project files
00:01

Project-32: Password Generator App with React, React DOM, HTML5, and CSS

17 lectures
App Inroduction
02:05
Creating React Application
01:48
First Run
04:48
Installing Dependencies
02:58
Creating HTML
11:44
Adding Sass -1
05:48
Adding Sass-2
05:53
Adding Sass-3
07:38
Initializing States
07:19
Structure of Methods
01:44
Creating the Methods
08:49
Explanation
01:39
Initializing Properties
04:43
Creating Copy Methods
03:47
Adding Toast
08:20
Final Refactor
05:54
Download the project files
00:01

Project-33: Quiz App with React, React DOM, HTML5, and SCSS

17 lectures
App Introduction
01:43
Creating React App
01:53
Folder Structure
01:15
Setting up Form.jsx
11:58
Adding Code to Other Components
05:00
Creating App.js
05:22
Adding State
06:06
Configuring Context.jsx
04:41
Adding Methods
05:54
Adding Other Methods
07:42
Managing DataFlow
04:38
Refactoring Data
08:08
Settings Data in Our App
05:21
Restructuring Modal
04:40
Restructuring SetupForm
04:09
Final Adjustements
03:26
Download the project files
00:01

Project-34: UnSplash Image Gallery with React and ReactDOM

17 lectures
App Introduction
01:45
Creating React App
01:55
Creating App.js
04:07
Creating States
06:23
Tour of API
03:22
Fetching Data into Applicaton
04:06
Pouring Data Into Application
06:36
Infinite Scroll
04:35
Populating Photo.jsx
08:13
Adding Handle Submit
02:38
Error Handling
02:01
Adding Styles
04:19
Adding styles part 2
07:35
Adding Styles 3
10:37
Fixing Typos
01:41
Healthy Practices
03:32
Download the project files
00:01

Project-35: React Router Demo Application with ReactJs, React Router Dom

21 lectures
App Introduction
03:24
Creating React App
01:51
House Keeping
03:53
Hello World
03:06
Context part1
06:45
Context Part2
10:17
Homepage
09:15
About Page
08:11
Validation of Form
08:52
Contact Form Part 1
14:22
Contact Form Part 2
14:05
Contact Form Part 3
04:49
User Component Part 1
10:00
User Component Part 2
11:02
Creating User Component Part 1
14:44
User Component Part 2
13:53
Error Page
02:29
Necessary Imports
08:33
Navabar
10:46
Final Fix
01:37
Download the project files
00:01

Project-36: Book Shelf App with ReactJs, NPM, CSS, and State Management

16 lectures
App Intro
00:37
CRA
02:10
First Run
04:10
House Keeping
04:50
Fonts
01:50
Creating Context
03:44
How to use Create Context
02:28
Creating Theme Context
09:17
Content Context
04:14
Creating Components
03:30
Next Part
04:32
Creacting BookList
10:24
Creating Book
12:35
Final Fix
01:14
Deployment
02:50
Download the project files
00:01

Project-37: Note Taking App with React and Redux for State Management

16 lectures
App Intro
01:18
CRA
02:08
First Run
05:43
Extensions For React
01:30
Creating Components
07:54
Components Part 2
04:59
Adding Components Part 3
02:53
Adding Redux
03:03
Creating Store
07:33
Making Store Available
07:21
Adding Store Part 2
07:54
Connecting
06:36
Creating Search Component
05:20
Creating NoteItem
11:01
App Completion
00:50
Download the project files
00:01

Project-38: Contact Register App with React, NPM, and React Context

10 lectures
App Introduction
00:59
CRA
02:57
Folder Structure
02:39
Extensions
04:16
Creating Components
08:47
Creating ContactList
09:27
Creating Contact Form
10:06
Styles
05:15
Styles 2
07:12
Download the project files
00:01

Project-39: Money Management App with React, NPM, and React Context

13 lectures
App Introduction
01:16
Creating React Application
02:26
First Run
04:48
Extensions For React
01:30
Creating Components
04:42
Making Required Components
08:36
Creating App.jsx
06:06
Creating A Component
06:43
CardItem
04:10
Add Basket
08:44
Remove Item
03:45
Final Touch
08:07
Download the project files
00:01

Project-40: Resort Booking App with React, NPM, and Hooks

17 lectures
App Intro
01:54
CRA
01:54
First Run
03:43
Extensions
04:16
Creating State
09:18
Creating State 2
04:38
Adding Methods
06:07
Defining Methods
03:54
Completing Booking.js
07:35
Creating Billing.js
05:51
Creating Methods in Billing
07:14
Billing.js Part 1
04:51
Billing.jsx Part 2
03:47
DateSelector.js
11:03
RoomDetails.js
04:20
Adding Dynamics to RoomDetails.js
10:04
Download the project files
00:01

Project-41: BMI Calculator with React, NPM, and React Context

13 lectures
App Intro
01:52
Create React Application
02:32
First Run
03:43
Extensions
04:16
Using useState
06:55
Creating Structure
05:53
Creating Structure Part 2
07:51
Creating Constants
03:47
Creating Methods
07:18
Methods Part 2
07:13
Creating Methods Final Part
09:48
Final Fix
06:20
Download the project files
00:01

Project-42: Furniture Store with React and Redux for State Management

14 lectures
App Intro
01:20
CRA
01:44
Configuring Application
07:47
Index.js
05:04
Creating App.js
06:10
Creating Reducer
10:10
Actions Creators
09:19
Using connect
08:48
MapStatetoProps
07:34
Creating Components Part 1
12:02
Creating Components Part 2
05:37
Creating Component Part 3
10:13
Connecting Components
04:12
Download the project files
00:01

Project-43: Scoreboard App with ReactJs, NPM, and React Context

12 lectures
App Intro
01:35
CRA
02:52
Extensions
05:42
Creating Components
07:50
Creating Methods
07:02
Creating Methods Part 2
07:28
Adding Player.js
06:53
Creating Counter.ks
04:07
Creating Stats
11:05
Creating StopWatch
12:00
Final Component
05:19
Download the project files
00:01

Project-44: Meta Tag Generator Application made with React-React Js

11 lectures
App Intro
01:43
CRA
03:04
Extensions
05:42
Creating Components
07:57
Configuring Components
06:58
Creating Structure
05:01
Creating Structure Part 2
06:20
Creating Generator.js
11:00
Finishing MetaAtgs
11:55
Final Fix
05:28
Download the project files
00:01

Project-45: Food Ordering Web App with React, Material-UI, and React Router

9 lectures
Introduction To The Project
03:55
Project Installation And Setup
27:19
Applying React Router
12:01
Creating & Styling The Nav Bar
09:32
Finishing Up The Nav bar
15:01
Creating the Homepage and Footer
18:49
Menu Page And Mapping The Data
21:05
About _ Contact Page - Finishing Up The Project
19:53
Download the project files
00:01

Project-46: Weather Web App with React, Open Weather API, and CSS

13 lectures
Introduction To The Project
02:22
Generating the API Key
05:37
Creating the Search Component
14:19
Search Component Continuation
12:10
Creating Weather Card
09:36
Styling The Weather Card
13:31
The useEffect Hook
09:40
Promises, Async, Await Try and Catch
12:54
Configuring the API Endpoint
09:23
Grabbing The Data From API
12:47
Fetching Data To The UI
14:34
Making The Icons Dynamic And Finishing Up The Project
14:41
Download the project files
00:01

Project-47: Food Recipe App with React, Edamam API, and Firebase Hosting

13 lectures
Introduction To The Project
03:35
Generationg API ID _ Key
06:22
React Project Installation
06:40
Creating the Basic Structure
07:44
Styling The Input And Search Field
12:40
Calling the API Through Endpoint
12:54
Implementing Custom Search
13:34
The Category Dropdown
07:24
Mapping The Data From The API
12:51
The RecipeTile Component
11:29
Adding RegEx To Filter Images
06:43
Hosting The Website on Firebase
13:59
Download the project files
00:01

Project-48: Shopping Cart App with React, React Hooks, and External API

14 lectures
Introduction To The Poject
02:37
Project Setup And Installation
09:27
Creating The Navbar
13:02
Styling The Navbar
10:12
Creating The Context
11:52
Creating CartContainer
10:05
Creating CartItem Component
16:49
The useReducer Hook
11:15
Implementing The useReducer
08:22
Clear Cart
09:26
Adding And Removing Items From Cart.
10:56
Creating The Actions In Reducer
17:05
Dispatch And Actions Final
18:06
Download the project files
00:01

Project-49: Cafe Menu App with React, React Hooks, and Firebase

11 lectures
Introduction To The Project
01:39
Initialising The Project
10:20
Styling The Title
09:57
Creating The Category Component
12:53
The Menu Component
15:06
Styling The Menu Component
11:25
Working On The Category Component
10:03
Passing And Mapping Data To Menu Component
10:18
Redering The Data In The App Component
11:38
Hosting Application On Firebase
24:12
Download the project files
00:01

Project-50: Cocktail Hub Web App with React, React Hooks, and Context API

12 lectures
Introduction To The Project
02:45
Creating Navbar
12:00
Linking Components To Navbar
12:01
reating The Context
10:23
The API We Are Going To Use
11:54
Setting Up Global Context
12:46
Fetching Data From Try And Catch
12:04
Creating Global Context
08:32
Creating Search Component
13:02
Loader,Cocktails,CocktailList Components
14:07
SingleCocktail Component
13:28
Download the project files
00:01

Project-51: Review Posting App with React, Material-UI, and CSS

12 lectures
Introduction To The Project
02:25
Setting Up The Project
11:40
Using Material-UI and Navbar
11:50
Dark Mode Feature
10:04
The Search Component
10:13
Posting The Review Component
11:41
Adding JS To The AddNote
11:02
Creating The Review(Note) Component
12:02
Creating The Review List (NoteList0
10:22
Configuring The App-js
12:38
Finishing Up The Project
15:30
Download the project files
00:01

Project-52: Pomodoro Timer App with React, Countdown Timer, and CSS

12 lectures
Introduction To The Project.
02:25
Setting Up The Project
11:01
Creating The Button Component
12:02
Styling The Button
11:08
SetPomodoro Component
12:03
Configuring The SetPomodoro
12:29
CountDown Animation Component
12:51
Creating The GlobalContext
11:15
Configuring The Global Context
11:29
Configuring The App-js
13:10
Finishing Up the Project with App-Js.
11:49
Download the project files
00:01

Project-53: Google Search App with React, Tailwind CSS, Google Search API

12 lectures
Introduction To The Project
02:04
Setting Up The Project
11:51
Installing Tailwind And Craco
09:07
Creating The Navbar
14:17
Creating The Search Component
11:25
Completing The Search And Creating Links
14:10
Creating Loading And Footer Component
10:04
Creating The Global Context
14:21
Creating The Results Component Structure
10:02
Distributing Data According To Search Field
11:50
Setting Up The Routes And App-Js
13:00
Download the project files
00:01

Project-54: Tic-Tac-Toe Game with React

10 lectures
Introduction to Tic tac Toe game Project
02:13
Environment Setup for the project
03:09
Getting started with React Component and Understanding Folder Structure
03:43
Introduction to react props and passing function to componnennts
08:12
Rendering our player using useState Hooks
10:53
Toggle between player_s X and O using useEffect hooks
15:01
Giving action to the restart button
04:46
Making condition for a tie match
06:17
Adding sound effect to our project
03:29
Download the project files
00:01

Project-55: Word and Letter Counter with React, useState, and JavaScript

6 lectures
Introduction to Word Counter using React js
01:06
What we are going to make
01:06
Getting started with our user Interface for word counter
05:36
Completing our counter letters and words
11:09
Completing with our buttons
03:18
Download the project files
00:01

Project-56: Currency Converter with React

5 lectures
Introduction to currency converter
00:50
What we are going to make
00:31
Get started with our project user Interface
10:49
Our final result with convert api
07:45
Download the project files
00:01

Project-57: Speech Recognition and Voice Assistant App with React

5 lectures
Introduction to the project
01:51
Let_s see what we are going to make and how it work
02:24
Understanding the speech recognition logic and passing commands
05:42
Rendering HTML elements inside browser and applying CSS
05:33
Download the project files
00:01

Project-58: Calculator App with React and Hooks

6 lectures
Introduction to calculator presentation
01:53
Getting started with the html
07:17
Handling the buttons with click
05:37
Making our delete button functional
04:04
Error Handling and the Equal button
04:11
Download the project files
00:01

Project-59: Budget Tracking App with React, Custom Hooks, and Context

15 lectures
Introduction to the Budget App using react js with presentation
02:28
Getting started with initialization of our react application
08:12
Rendering our header for budget app
13:33
Making Budget Card component
10:20
Completing Budget Card Header
06:33
Completing Budget Card component
10:54
Completing Budget Card component
06:08
Calling the functions for budget card funtionality
15:23
Completing add Budget and add Expenses function
06:23
Learn how to use Local Storage
11:44
Handling Budget Modal
15:25
Maping through budgets
07:54
Add expenses modal and Uncategorized section
15:04
Completing the application
11:09
Download the project files
00:01

Project-60: Music Player (Spotify Clone) with React and Spotify API

11 lectures
Introduction to Schedule Application using react JS
04:07
Getting startded with ur project
13:14
Installing Bootstrap using terminal
02:31
Redirectig to authorization
15:17
Creating Server for our application
14:55
Modifying the server
15:04
Managing the Authentication of user
14:41
Completing authorisation
14:40
Making the song component
16:40
Concluding the project
04:36
Download the project files
00:01

Đánh giá của học viên

Chưa có đánh giá
Course Rating
5
0%
4
0%
3
0%
2
0%
1
0%

Bình luận khách hàng

Viết Bình Luận

Bạn đánh giá khoá học này thế nào?

Khoá học liên quan

Complete Ruby Programmer - Master Ruby

Complete Ruby Programmer - Master Ruby

1.099.000 VND
50.000 VND
Visual Studio Code for Developers 2023: Beginner to Advanced

Visual Studio Code for Developers 2023: Beginner to Advanced

1.499.000 VND
50.000 VND
The Complete JavaScript Course 2024: From Zero to Expert!

The Complete JavaScript Course 2024: From Zero to Expert!

185 VND
50.000 VND
The Git & Github Bootcamp

The Git & Github Bootcamp

120 VND
50.000 VND
SQL for Data Analysis: Beginner MySQL Business Intelligence

SQL for Data Analysis: Beginner MySQL Business Intelligence

1.899.000 VND
50.000 VND
Build Solutions with Power Apps, Power Automate & SharePoint

Build Solutions with Power Apps, Power Automate & SharePoint

100 VND
50.000 VND
Unity 2023 Game Development : Build 6 Games with Unity & C#

Unity 2023 Game Development : Build 6 Games with Unity & C#

79 VND
50.000 VND
The Complete 2024 Web Development Bootcamp

The Complete 2024 Web Development Bootcamp

185 VND
50.000 VND
Unit Testing for Typescript & NodeJs Developers with Jest

Unit Testing for Typescript & NodeJs Developers with Jest

100 VND
50.000 VND
Create an eCommerce Website Using Laravel (PHP & MySQL)

Create an eCommerce Website Using Laravel (PHP & MySQL)

1.049.000 VND
50.000 VND
The Freelance Stack: A real project with NextJS13 and Strapi

The Freelance Stack: A real project with NextJS13 and Strapi

50.000 VND
Time Series Analysis, Forecasting, and Machine Learning

Time Series Analysis, Forecasting, and Machine Learning

90 VND
50.000 VND
MongoDB with Java Spring Boot & Spring Framework

MongoDB with Java Spring Boot & Spring Framework

1.099.000 VND
50.000 VND
Build REST APIs with Django REST Framework and Python

Build REST APIs with Django REST Framework and Python

1.899.000 VND
50.000 VND
Svelte.js - The Complete Guide (incl. Sapper.js)

Svelte.js - The Complete Guide (incl. Sapper.js)

65 VND
50.000 VND
The Complete Cloud Computing Software Architecture Patterns

The Complete Cloud Computing Software Architecture Patterns

100 VND
50.000 VND
image

Đăng ký get khoá học Udemy - Unica - Gitiho giá chỉ 50k!

Get khoá học giá rẻ ngay trước khi bị fix.

Get khoá học cho tôi