Install redux and saga packages

 

 

Hello viewers, i am back again for you and now we will start from redux-saga. So, we will teach first how to install redux and saga packages and after that we are ready for implemenation of redux-saga. Actually we are making some project like E-commerce where we can implement searchbar, product add to cart, remove from cart, empty cart, cart section after adding some product and product section and a lot of things, So, don't worry i'm not going to leave you alone.

 

React

Certainly, Reactjs is a JavaScript library developed by Facenook for building user interfaces. It allows developers to create reusable UI components and effciently manage the state of their applications. Here are some key aspects of Reactjs.


Component-Based Architecture: ReactJS follows a component-based architecture, where the user interface is divided into small, reusable components. Components encapsulate their own logic, state, and rendering, making it easier to build and maintain complex user interfaces.



Virtual DOM: ReactJS uses a virtual representation of the DOM (Document Object Model), known as the Virtual DOM. When the state of a component changes, React updates the Virtual DOM.



JSX: JSX is a syntax extension for JavaScript used in React. It allows developers to write HTML-like code within JavaScript, making it easier to describe the structure and appearance of components. JSX code is transpiled to regular JavaScript using tools like Babel before being executed in the browser.


Hooks: React introduced Hooks in version 16.8 as a way to use state and other React features in functional components. Hooks allow developers to write reusable logic and manage state within functional components without the need for class components. The most commonly used hooks are useState for managing state and useEffect for handling side effects such as fetching data or subscribing to events.


React Router: React Router is a popular routing library for React applications. It enables developers to create single-page applications with multiple views and handles routing between different components based on the URL.


State Management: React provides a flexible ecosystem of state management solutions. While React's built-in state management (useState ) is suitable for managing local component state, more complex applications may benefit from additional state management libraries like Redux. These libraries help manage global application state and provide predictable ways to update and access the state.


ReactJS has gained widespread popularity due to its performance, reusability, and declarative approach to building user interfaces. It has large community.

 

Install redux and saga package

# npm install react-redux

# npm install redux

# npm install redux-saga

so lets start with gain more details for installing these packages but it will be install only if you have installed react for your product.

When we use react with redux-saga for installing these libraries.

First Library

Create a react redux app = CLICK Here

In this site, through we can install redux app with 2 methods but if you see that there is one of them installation way are  like ( npm create-react-app my-app --template redux ) but we don't go through this method because of either the ready-made template, what can we say, gives a complete structure in which you will have difficulty in understanding which structure in made and how.

Thats why we have to prefer install like this way ( npm install redux or npm i redux )

For check it is installing or not ? then go to package.json file and there is redux and his version are available.

Now let's move forward.

Second Library

Using Create React App = CLICK Here

In this site, through we can install react-redux app with this command ( npm install react-redux or npm i react-redux )

Third Library

install react-saga = CLICK Here

In this site, through we can install redux-saga app with this command ( npm install redux-saga or npm i redux-saga )

Finally all are done. After this blog we will make Action, Reducer, Store, Constant, and saga file.

Watch Full Tutorial

# Install redux and saga packages - CLICK HERE

# Make reducer wrapper - CLICK HERE

# Action in reducer - CLICK HERE

# Reducer in redux - CLICK HERE

 

Disclaimer

All tutorials are for informational and educational purposes only and have been made using our own routers, servers, websites and other vulnerable free resources. we do not contain any illegal activity. We believe that ethical hacking, information security and cyber security should be familiar subjects to anyone using digital information and computers. Hacking Truth is against misuse of the information and we strongly suggest against it. Please regard the word hacking as ethical hacking or penetration testing every time this word is used. We do not promote, encourage, support or excite any illegal activity or hacking.