React with Redux React-Router Hooks and Auth0
React and Redux are two of the most popular front-end technologies used today. With React-Router and Auth0, developers can create modern routing and authentication patterns. This article will discuss the knowledge and skills required to use React and Redux, the inner workings of React, and the ability to understand how various front-end technologies interact with one another. Additionally, it will cover Javascript syntax in ES5, ES6, and ES7. With this knowledge, developers can create impressive front-end applications. ▼
ADVERTISEMENT
Course Feature
Cost:
Free
Provider:
Udemy
Certificate:
No Information
Language:
English
Start Date:
Self Paced
Course Overview
❗The content presented here is sourced directly from Udemy platform. For comprehensive course details, including enrollment information, simply click on the 'Go to class' link on our website.
Updated in [June 30th, 2023]
This course provides an overview of React with Redux, React-Router, Hooks, and Auth0. Students will gain an understanding of the most modern form of React and Redux, as well as the routing and authentication patterns in the modern era. They will also learn the knowledge and skills required for front-end positions, the inner workings of React, and the ability to understand how various front-end technologies interact with one another. Finally, students will gain an understanding of Javascript syntax in ES5, ES6, and ES7.
[Applications]
The application of this course can be seen in the development of modern web applications. With the knowledge and skills acquired from this course, developers can create React applications with Redux, React-Router, and Auth0. They can also use the latest Javascript syntax in ES5, ES6, and ES7 to create dynamic and interactive web applications. Furthermore, they can understand how various Front End Technologies interact with one another, giving them the ability to impress other engineers.
[Career Paths]
A career path that is recommended for learners of this course is a Front-End Developer. Front-End Developers are responsible for creating the user interface of a website or application. They use HTML, CSS, and JavaScript to create the visuals and functionality of a website or application. They must be able to understand the user experience and create a design that is both visually appealing and functional.
Front-End Developers must have a strong understanding of React, Redux, React-Router, Hooks, and Auth0. They must be able to create and maintain complex user interfaces using these technologies. They must also be able to debug and troubleshoot any issues that arise.
The development trend for Front-End Developers is to stay up to date with the latest technologies and trends. As new technologies are released, Front-End Developers must be able to quickly learn and adapt to them. They must also be able to create responsive designs that work across multiple devices and browsers. Additionally, they must be able to create user interfaces that are optimized for performance and accessibility.
[Education Paths]
The recommended educational path for learners interested in React with Redux React-Router Hooks and Auth0 is a Bachelor's degree in Computer Science or a related field. This degree will provide learners with the foundational knowledge and skills necessary to understand the inner workings of React, as well as the ability to understand how various front-end technologies interact with one another. Learners will also gain an understanding of Javascript syntax in ES5, ES6, and ES7, as well as an understanding of routing and authentication patterns in the modern era.
The development trend for this educational path is to focus on the latest technologies and frameworks, such as React, Redux, React-Router, and Auth0. As these technologies become more popular, learners will need to stay up to date with the latest versions and understand how to use them effectively. Additionally, learners should focus on developing their problem-solving skills, as this will be essential for success in the field.
Course Syllabus
Course Promo
Course Intro
JavaScript refresher (optional)
Text Editor (optional)
Recommended to watch all videos on 1.5x speed
node.js
Command Line Tool
Redux Dev Tools
Developer Accounts
Slides
For more free courses in the future follow me on twitter
Getting Started with create-react-app
JSX Overview
03. Displaying variables in JSX
04. Understanding Class and Function Scopes
05. How extends Component works
styling patterns in React
React Under the Hood - the Virtual DOM
Displaying Objects in JSX
Props
Components
How functional Components work
Props in functional components
Props in class components
React state
Initializing State
updating state with setState()
updating state with the previous state
working with multiple state properties
Passing down state as props
conditionally rendering in JSX
ternary expressions
alternate conditional rendering method
summary of the 3 ways to conditonally render JSX
lifecycle methods()
Working with Lists
working with forms
What and why Redux
3 principles of Redux
React-Redux oveview
actions
Action Creators
Reducers
Setting up the actions and reducer
createStore()
Creating a react-redux container
mapStateToProps()
mapDispatchToProps()
the connect() method
Connecting a container to React-Redux
Summarizing the Redux Flow
Testing our React-Redux container
Setting up action creators
Passing in data to action creators
getting our data from redux state
rendering data to the UI
multiple reducers
updating and reading state reference
routing overview
history syntax update
setting up routes
going deeper in react-router
testing our routing
in dept look at routing
Switch and exact
react router props
dynamically rendering components
auth0 flow
setting up the auth0 app
initializing the auth0 class
JWT tokens
pasing tokens and handleAuth()
handling the callback and authentication
authentication flow in Redux
setting up the authcheck component
setting up protected routes and the PrivateRoute HOC
implementing the login and logout buttons
Google oauth login
facebook oauth login
extracting the user profile data
setting up profile action creators
setting up the profile actions in authcheck
dynamically render the profile
silent authentication
why not redux thunk
React Hooks Intro
2 rules off using hooks
4 Hooks Overview
useState() overview
useEffect() overview
useReducer() overview
Context overview
useContext() overview
Migration Guide from Redux to React hooks
6 ways to update state reference
Project Intro
Starter Code
creating your first React hook
adding the useState() hook
adding the useEffect() hook
adding the useReducer() hook
adding the useContext() hook
adding a Global state with Context
creating a form with React Hooks
adding useReducer() to the form
adding global state to the form
Final Code
Pros & Cons
Free course with valuable content.
Covers a lot of topics in a short period.
Provides clear and understandable explanations.
Terrible explanation, lacks clarity.
Some codes are outdated.
Monotonic narrative voice, lacks excitement.
Less clarification about practical aspects.
Syntax could be made simpler.
Lack of information about class components.
Course Provider
Provider Udemy's Stats at AZClass
Discussion and Reviews
0.0 (Based on 0 reviews)
Start your review of React with Redux React-Router Hooks and Auth0