React, React Redux and Redux Saga - Master React State/Hooks

Use React, React Redux and Redux Saga, and master React Hooks and State Management with asynchronies call in React Redux

4.33 (796 reviews)
Udemy
platform
English
language
Web Development
category
instructor
4,947
students
7 hours
content
Feb 2021
last update
$54.99
regular price

What you will learn

React

React-Redux

Redux-Saga

React Hooks

State management

React Semantic UI

Web Development

Description

*** PRE SALE ***

Enjoy Udemy's Black Fridays deals to get the Pre-Release of another great course. This is an amazing course that has more than 40 lectures released and another 60 lectures to come.


What do you get on the Pre-Release:


About 3 hours of content video content

All sections in how to create an amazing UI in React

All sections in how to control state in a React application using only Hooks and Props

All sections in how to use Redux


What still to come:

About another 3 hours of video content

Sections in how to use Redux with React

Sections in how to control a React State only with Redux

Sections in how Saga works

Sections in how to control React side-effects with Redux-Saga


Greatly improve your abilities and increase your value as a React or front end web developer

This course will take you through the whole process of creating a complete application using React, React-Redux, and Redux-Saga. Step by step, improving the application further in each class:


  • The first part of the course will start by creating the UI for an amazing React application.

  • Next, we will make a refractory of this application into different stateless components.

  • After using React Hooks, we will add a state to the application, passing all the states via props.

  • In the next phase, we will add React Redux to easier control of the state.

  • Finally, we will introduce Redux-Saga to control the application's side effects while making asynchronous calls to our API.

The main focus of this course is:

React: it is a declarative, efficient, and flexible JavaScript library for building user interfaces. It lets you compose complex UIs from small and isolated pieces of code called “components.”

React-Redux: one of the most used application state management. Redux maintains the state of an entire application in a single immutable state tree.

Redux-Saga: one of the most used frameworks to make easier to control our application side effects (i.e., asynchronous things like data fetching and impure things like accessing the browser cache) easier to manage, more efficient to execute, and better at handling failures


This course covers all you need to be the best Web Developer you can be.


Content

Initialising our React App

Create our react app
Importing SemanticUI to make our application pretty(er)

Creating our react app

Adding Income and Expenses.
Creating our income and expense history
Add transactions
Add transactions

Creating components for our react app

Creating a MainHeader component
Create our ButtonSaveOrCancel React Component
Creating our NewEntryForm React Component
Refactoring our DisplayBalance React Component
Creating our DisplayBalances React Component
Creating our EntryLine React Component

Hooks, State and Props

Adding Hooks and State
Pushing changes to GitHub
Creating State using useState
Mapping a array of objects.
Creating a component that renders multiple components
Adding keys to the repeated components
Adding a DeleteEntry function
Adding a new Entry
Adding a toggle to identify the type of entry
Creating a model to edit the entries
Formatting our modal
Making our components more reusable
Refactoring to manage the state
More Refactoring state
Making the modal work with useEffect
Final adjustments to state and we done
Calculating the totals using useEffect
Displaying totals, can we do some Redux now?

Redux - Store, Dispatch, Actions and Reducers

Fixing warning and committing all the state changes
Create Redux Store
Dispatching actions with Redux
Dispatch with payload with Redux
Fixing the code and Subscribing to all store changes in Redux
Creating a new Redux Action
Creating Action Functions for Redux
Creating a Reduce
Combine Redux reducers in one store
Refactoring our Redux to Actions, Reducers and Store

React-Redux

React Redux combining our Redux with our React components
React Redux Hook useDispatch
Adding a new entry with React Redux Hooks
Using UUIDs for the entry ID
Installing and Configuring Redux Dev Tools

React Redux Devtools

Installing and Configuring Redux Dev Tools
Creating our first custom hook useEntryDetails
New Redux action and new Redux Reducer update entry
Creating a new Redux Store (and action and reducer)
Dispatching new actions to the new Redux Store
Open the modal after the dispatch
Closing the modal on dispatch
Loading the modal data

Screenshots

React, React Redux and Redux Saga - Master React State/Hooks - Screenshot_01React, React Redux and Redux Saga - Master React State/Hooks - Screenshot_02React, React Redux and Redux Saga - Master React State/Hooks - Screenshot_03React, React Redux and Redux Saga - Master React State/Hooks - Screenshot_04

Reviews

Vincenzo
September 13, 2023
Kudos for all the live coding, much appreciated but very dirty (no best practices) and full of errors / typo that during the explanation certainly do not help for the understanding of the topics covered. P.s: lots of old es5< and imperative code.
Natalja
December 17, 2022
Easy to follow! Would be great to get a bit more detailed explanation why is what for, but then again noone cancelled Internet :) I can always stop and google things that are not 100% clear. Much appreciate your effort to create this course !
Chinaa
November 10, 2022
This course seems off for both experienced and beginners. He is trying very hard to explain the use cases of different features but failing to show clearly how to *structure and implement* redux and redux saga in a professional way. The tutorial on Json Server was A+
Dave
July 28, 2022
That early Semantic error really needs to be addressed/fixed. Other than that, this is a pretty good course! Wish it went into a little more detail on some things but definitely gets the job done if you're looking to get started with sagas.
Tudor
July 25, 2022
You guys need to update the issue with semantic-ui-css. Other than that I really recomend this course is really straight forward, easy to follow.
Saravanasundar
July 19, 2022
The course was good in explaining the basics of Redux Saga. I would definitely recommend the course for someone who wish to start learning saga from the beginning.
Mark
June 16, 2022
Class 45 and 46 are the same class, duplicated. Github repo has only like 5 commits. Too many typos. Why don't you edit them out?
CHAPPERT
June 13, 2022
Becarefull: The first step in the course is to install and using semantic-ui -> it's not work ! Very good knowledge by the instructor, but too many refactories code along the course ... Maybe needs github steps to download. I can not follow the course well...
Steven
March 7, 2022
The course starts slow but all the information is really important and the teacher explains it very well.
Jorge
March 2, 2022
Complex and many refactors in the code is hard to follow you sometimes from lesson 1 to 5, you should keep it simple for a beginner.
Aliaksandr
January 25, 2022
Some content is generated on the fly, which can be good thing for experienced developers, but I don't think it is very good for beginners. Should be better prepared for each lesson.
Lionel
January 7, 2022
Coding step by step, explaining the why and the how, one thing at a time... Just beware that SemanticUI is mostly outdated (even if it's a great idea to introduce it and use it so you can focus on the logic, not on CSS design). So read Q&R comments on Semantic UI install to find work around some minor difficulties. Overall great course (couple of final lectures are missing and should come shortly I guess)
Stephanie
December 6, 2021
Straight forward. Not too much fuss about explaining every single concept. Very well structured. Good as a revision. Feedback: console logs on inspect are too small to see on screen
Bogdan
November 24, 2021
Great course, very good explanations. He is a programmer and teaches from experience, despite others who are basically transposing documentation into video lectures.
Yogesh
November 9, 2021
Speed of teaching is good and I am able to understand and simultaneously do the hands on comfortably. Thanks.

Coupons

DateDiscountStatus
6/1/202194% OFF
expired

Charts

Price

React, React Redux and Redux Saga - Master React State/Hooks - Price chart

Rating

React, React Redux and Redux Saga - Master React State/Hooks - Ratings chart

Enrollment distribution

React, React Redux and Redux Saga - Master React State/Hooks - Distribution chart
3635516
udemy ID
11/14/2020
course created date
12/4/2020
course indexed date
Bot
course submited by