• Post category:StudyBullet-9
  • Reading time:9 mins read


Learn React Redux with practical project & learn how developers share code with each other in project using Git/Github

What you will learn

You will learn the basics of ReactJS and component development

You will learn about Redux state management

You will learn about various React hooks

You will learn about Importance of using Version Control System(VCS)

You will learn about the most popular VCS – Git/Github

You will learn to use Git commands from Git bash & Terminal

Description

In this course, you will Learn React Redux in the most simple way through real world example and

hands-on project based approach.

Following are the topics we will cover:

1.1-What is Redux

1.2-Redux real world explanation

1.3-Installing nodejs and VS code

1.4-Creating new react application

1.5-Code cleanup

1.6-Understanding React application flow and JSX

1.7-Installing the required npm packages

1.8-Redux lifecycle

1.9-Creating the required folders

2.1-Creating Actions and Action constants

2.2-Creating product reducer

2.3-Combine all reducers

2.4-Creating the product store

2.5-Redux DevTools and Provider

2.6-Creating components template files

2.7-Understanding the package json file

2.8-Creating and Understanding first react component

2.9-Creating skeleton for all other components

3.1-Implementing static and dynamic routing of components

3.2-Applying styling to components by inline style and css class

3.3-Accessing state information from store inside component

3.4-Designing the Product Component

3.5-Get Fake Product List in All Products component from API


Get Instant Notification of New Courses on our Telegram channel.


3.6-Dispatch action from the component

3.7-Modifying the reducer to update the state information

3.8-StylingΒ  and displaying all products on the home screen

4.1-Dynamic Navigation to Product Detail page on click of a product

4.2-Get Product Id from url and get product details from the API

4.3-Dispatch the selected product to the reducer and get it back in component

4.4-Styling Product Details page and showing data with conditional JSX

4.5-Adding routing on the logo

4.6-Remove the previous product and directly load the product on details screen

4.7-Exploring Action and State information on redux Dev Tools

You will learn about various react hooks.

You will get the complete source code for the course.

This course will tell you how the Continuous Integration process works in a project in the IT industry using tools like git and github.

How different developers work in a team in a project and share code with each other for integration and deployment.

You will learn about the various branching strategy and git flow process and the pull request process that gets followed in companies.

Next we will learn how to create the repository and how to connect from our local laptop to github with a secured token and perform various git operations.

We will also learn the different best practices that a developer should follow while working on any project.

You will learn about Importance of using Version Control System(VCS)

You will learn about the most popular VCS – Git/Github

You will learn to use Git commands from Git bash & Terminal

You will learn to use Git commands from VisualΒ  Studio Code editor

You will learn to use Git commands from Intellij editor

You will learn the branching strategy and pull request process

You will learn how Continuous Integration process works in a project in IT industry

You will learn about different best practices than a developer should follow while working in a project

We will also learn about different git operations by doing them some of them include:

  • Git clone
  • Git branch
  • Git status
  • Git merge
  • Git stash
  • Git resolve
  • Git commit
  • Git push
  • Git revert
  • Git history
  • Git tag
  • Git revert
  • much more
English
language

Content

Introduction Setup and Installation

Course Introduction
What is Redux
Redux real world explanation
Installing nodejs and VS code
Creating new react application
Code cleanup
Understanding React application flow and JSX
Installing the required npm packages
Redux lifecycle
Creating the required folders

Implementing Action Reducer and Store

Creating Actions and Action constants
Creating product reducer
Combine all reducers
Creating the product store
Redux DevTools and Provider
Creating components template files
Understanding the package json file
Creating and Understanding first react component
Creating skeleton for all other components

Working on Components and API data

Implementing static and dynamic routing of components
Applying styling to components by inline style and css class
Accessing state information from store inside component
Designing the Product Component
Get Fake Product List in All Products component from API
Dispatch action from the component
Modifying the reducer to update the state information
Styling and displaying all products on the home screen

Routing Designing Dispatching Action

Dynamic Navigation to Product Detail page on click of a product
Get Product Id from url and get product details from the API
Dispatch the selected product to the reducer and get it back in component
Styling Product Details page and showing data with conditional JSX
Adding routing on the logo
Remove the previous product and directly load the product on details screen
Exploring Action and State information on redux Dev Tools

Source code

Thank you

Introduction & Setup

Course Introduction
Creating your own Github account and Github repository
Understanding the initial git commands
Generating Personal Access Token for your github account

Git Operations via git bash and terminal

Installing Git bash and Performing different git operations
Perform git operation through Terminal or Command Line

Working with Visual Studio Code editor & Git Github

Understanding Branching Strategy in Git & Github
Commit Push From VS code Editor
Pull request and Review Process for code merge between branches
Git Pull Branch change Git Clone from VS Code Editor

Working with Intellij editor & Git Github

Setting up Git and Github for our local project
Committing and Pushing our local code changes to Github server
Connecting Intellij Editor with Github
Important Git operations that Developer must know
stash changes, conflict resolution, git compare, check history