Free Udemy Courses
Trending

React – The Complete Guide with React Hook Redux 2020 in 4hr

PUBLISHER :- Kim Chen

LANGUAGE :- English

PRIZE :- 117.23$ 0$

React – The Complete Guide with React Hook Redux 2020 in 4hr

WHO CAN ACCESS THIS COURSE :-

  • Anyone who want to start a career with React
  • Anyone who want to take the web development skills to the next level
  • Anyone who are interested in learning the most update technology

WHAT ARE YOUR REQUIREMENTS FOR THIS COURSE ?

  • A window or mac computer
  • Basic JavaScript knowledge but is not a must
  • HTML and CSS fundamentals are beneficial but not a must
  • NO JS framework experience is required

WHAT YOU ARE GOING TO LEARN FROM THIS COURSE ?

  • Build high performance and user friendly web app
  • Realize the power of using component in React
  • Unleash the power of JavaScript with the help of React

DESCRIPTION

n this course you will learn to get start with React 16.8+ including what is JSX, how to use props to pass data to the children components, using the React hook useState and also styled component. We will not use more than 40 hours to talking to the same things again and again. You will learn all the react essential things within 4 hours.

Since this course is the mix of knowledge base and the project base. If you just want to learn the React knowledge fast, 4 hours is enough!!

After that we will also provide project to consolidate your understanding with react, and how to interact with backend like Firebase.

Which companies are using React now and why you need to learn?

Facebook

Instagram

Twitter

Netflix

Yahoo! Mail

WhatsApp

Dropbox

Atlassian

Salesforce

New York Times.

Reddit

Cloudflare

Tesla

BBC

GitHub

PayPal

Uber

Zendesk and more…

The above list of big companies taking huge leaps to embrace React, which signifies the extent to which the technology has raised its bars.

What you will learn in this course?

Es6

React components

Jsx

Functional component

Props

State

List

Styled component

Redux

UI framework like Reactstrap, Materializecss

Firebase

COURSE CONTENT

  • 13 sections • 105 lectures • 5h 5m total length

Introduction2 lectures • 3min

  • IntroductionPreview00:28
  • How to create a blank new react app02:46

[OPTIONAL] Quick review on es612 lectures • 30min

  • var let and constPreview03:01
  • The problem of using let in switch casesPreview01:43
  • Template literalPreview01:44
  • Arrow functionPreview02:35
  • Classes02:09
  • Spread operator03:30
  • Destructuring02:30
  • Primitive vs Reference00:17
  • Primitive vs Reference03:30
  • Import and export05:35
  • Array function02:05
  • For in \ For of01:48

[REACT ESSENTIALS] JSX7 lectures • 10min

  • What is JSX?Preview02:17
  • Import CSS02:01
  • inline CSS01:49
  • Curly braces in react00:13
  • Styles object02:36
  • Fast track to convert CSS to JS object00:04
  • store jsx element to variable01:29

[REACT ESSENTIALS] Functional Component2 lectures • 5min

  • Create a list of card02:36
  • Create card component02:14

[REACT ESSENTIALS] Props3 lectures • 8min

  • Pass and receive props02:19
  • Pass multiple props02:58
  • The children of props02:59

[REACT ESSENTIALS] State4 lectures • 12min

  • useState and Change of State02:57
  • passing function to component03:26
  • Two way binding01:45
  • Conditional rendering04:21

[REACT ESSENTIALS] List4 lectures • 14min

  • Rendering a list of cards04:01
  • Delete a specific card03:58
  • Fix unique key error01:49
  • Change the name of a specific card04:13

[REACT ESSENTIALS] Style5 lectures • 14min

  • Dynamic style with javascript01:22
  • Dynamic style with classes02:28
  • Styled component04:56
  • Theme03:18
  • Extract the styled button02:00

[REACT ESSENTIALS] Lifecycle and useEffect8 lectures • 23min

  • Convert functional base to class base04:12
  • Convert Card component to class base component01:33
  • Life Cycle Methods Diagram00:00
  • React lifecycle – mounting05:37
  • React lifecycle – updating04:41
  • React lifecycle – unmounting01:28
  • useEffect02:36
  • useEffect clean up02:51

[REACT ESSENTIALS] React hooks – to improve the performance of the app19 lectures • 1hr 17min

  • useEffect fetch data with axios03:24
  • useEffect fetch a card04:38
  • React Context04:56
  • Multiple React Context01:42
  • useContext02:17
  • useReducer (Simpiflied)04:51
  • useReducer (Normal)06:17
  • multiple useReducer03:36
  • useReducer with useContext05:52
  • use of useReducer with useContext02:09
  • use useReducer with useEffect to fetch the data06:24
  • Beautify the list with ReactStrap / Bootstrap02:17
  • useMemo03:48
  • useMemo02:57
  • useRef01:28
  • useRef – deal with the unmount component problems04:23
  • useCallback – to prevent the recreation of function05:05
  • custom Hook – extract the logic05:31
  • custom Hook.- using in form05:33

[REACT ESSENTIALS] React Router10 lectures • 28min

  • React Router04:39
  • Link and NavLink01:42
  • Program to redirect02:28
  • Higher Order Component02:41
  • Fetch the posts by using axios03:43
  • Passing Parameters02:32
  • Fetch specific post and using Switch from React Router02:04
  • Page Not Found01:28
  • Protected Route02:50
  • Apply Protected Route03:28

[REACT ESSENTIALS] Redux6 lectures • 15min

  • Redux simplified version03:58
  • Reducer01:48
  • Store02:54
  • Actions01:17
  • Display the value with useSelector and also useDispatch03:08
  • Dispatch the login action01:43

[PROJECTS] Evernote Clone23 lectures • 1hr 5min

  • Introduction to the evernote clone project00:38
  • Create Navbar04:06
  • Custom Hook02:53
  • Create Input Form04:04
  • Create Home Component03:08
  • Create Firebase Project02:56
  • Setting Firebase inside the app04:13
  • Create the add note action02:27
  • Fetch the documents (notes) from the firebase02:26
  • Create the noteslist02:28
  • Refine the note component05:02
  • Create delete note action02:08
  • Create toggle favorite action03:02
  • using moment js01:02
  • create favorite page03:28
  • Create note detail page01:47
  • Refine the note detail page04:16
  • Use react redux firebase helper functions02:57
  • Create EditForm component01:42
  • Create note action01:23
  • Get the data (selected note)01:10
  • Update the note in firebase04:28
  • Deploy the app to firebase03:18

HOW TO MAKE MONEY ONLINE & TIPS AND TRICKS

Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button

Adblock Detected

Please consider supporting us by disabling your ad blocker