Redux, State Management, and Advanced React Concepts
Ends soon! Keep adding new skills with 10,000+ programs for $239 (usually $399). Save now.
Redux, State Management, and Advanced React Concepts
This course is part of React Bootcamp with .NET API (Router, Redux Toolkit, Hooks) Specialization
Included with
Learn more
Ask Coursera
Recommended experience
Recommended experience
What you'll learn
Build real-world React applications with advanced features like routing, user authentication, and payment processing.
Learn how to create dynamic applications with Redux Toolkit, including mutations and caching.
Master the use of React Query for handling asynchronous requests and managing server state.
Understand Redux fundamentals and integrate it into React for efficient state management.
Skills you'll gain
Details to know
11 assignments
See how employees at top companies are mastering in-demand skills
Build your subject-matter expertise
- Learn new concepts from industry experts
- Gain a foundational understanding of a subject or tool
- Develop job-relevant skills with hands-on projects
- Earn a shareable career certificate
There are 9 modules in this course
This course features Coursera Coach!
A smarter way to learn with interactive, real-time conversations that help you test your knowledge, challenge assumptions, and deepen your understanding as you progress through the course. Master advanced state management in React using Redux and React Query. Learn how to integrate Redux with React, manage state efficiently with Redux Toolkit, and handle asynchronous data fetching with React Query. This course covers Redux slices, mutations, and caching, along with real-world applications like TravelOPedia, ProjectOPedia, and a restaurant website to reinforce your skills. Youβll dive into advanced topics like API requests, routing, and creating dynamic, user-friendly features. By the end, youβll be equipped to manage state in large-scale React apps and handle complex features such as user authentication, payment systems, and API integration. Designed for intermediate developers familiar with React, this course helps you enhance your state management skills and build scalable applications. By the end, youβll be able to manage state with Redux, perform data fetching with React Query, and implement dynamic features like authentication and payments.
In this module, we will guide you through the process of integrating Redux into your React applications. You'll learn how to set up a Redux store, create reducers, and dispatch actions to manage application state. By the end of this section, you will be well-versed in using Redux to manage complex state in React applications.
What's included
17 videos2 readings1 assignment
17 videosβ’Total 69 minutes
- Set Up ReduxOPediaβ’5 minutes
- Add Redux Storeβ’5 minutes
- Create First Reducer and Actionsβ’9 minutes
- Log State and Dispatch Actionβ’3 minutes
- Retrieve Value from Stateβ’3 minutes
- Dispatching Action from React Componentβ’4 minutes
- Assignment 16 - Counter Multiplierβ’4 minutes
- Assignment 16 Solution - Counter Multiplierβ’3 minutes
- Add Destination Sliceβ’3 minutes
- Display Destinationsβ’4 minutes
- Select Destinationβ’4 minutes
- Display Selected Destinationβ’3 minutes
- Reset Counter and Destinationβ’5 minutes
- Listen to Actions of a Different Reducerβ’4 minutes
- Say NO to Magic Stringsβ’2 minutes
- Custom Actionsβ’5 minutes
- Alternative Approach for Import and Exportβ’3 minutes
2 readingsβ’Total 20 minutes
- Introduction to the Course 'Redux, State Management, and Advanced React Concepts'β’10 minutes
- Full Specialization Resourcesβ’10 minutes
1 assignmentβ’Total 15 minutes
- ReduxOPedia - Redux and React - Assessmentβ’15 minutes
In this module, we will focus on using Redux Toolkit and RTK Query to manage asynchronous operations in a React application. Youβll learn how to set up slices, make API calls, and implement queries and mutations. By the end of this section, you'll have a strong understanding of handling data fetching, caching, and mutations in your React apps using Redux Toolkit.
What's included
20 videos1 assignment
20 videosβ’Total 79 minutes
- Set Up TravelOPediaβ’5 minutes
- Set Up Destination Componentsβ’3 minutes
- Set Up JSON Serverβ’5 minutes
- Create Destination APIβ’10 minutes
- Fetch Records from APIβ’5 minutes
- Add Destination Controller Componentβ’2 minutes
- Add Mutationsβ’4 minutes
- Call POST Mutationβ’5 minutes
- Query Versus Mutationβ’1 minute
- Caching with RTK Queryβ’5 minutes
- Tags in Actionβ’6 minutes
- Assignment 17 - Delete Destinationβ’1 minute
- Assignment 17 Solution - Delete Destinationβ’2 minutes
- Response from Query and Parametersβ’2 minutes
- Separating Out Individual Destinationβ’2 minutes
- Assignment 18 - Edit Functionalityβ’1 minute
- Assignment 18 Solution - Edit Functionalityβ’9 minutes
- Integrate RTK Query with Redux Storeβ’6 minutes
- Call Another APIβ’3 minutes
- Show Random Destinationβ’3 minutes
1 assignmentβ’Total 15 minutes
- TravelOPedia - Redux Toolkit, Query, Mutations, and Slice - Assessmentβ’15 minutes
In this module, you will create ProjectOPedia, a dynamic portfolio page where you can showcase your course projects. You'll learn how to map through your project list, dynamically render project cards, and implement routing for project details. This section will enhance your React skills while building a portfolio-worthy project.
What's included
7 videos1 assignment
7 videosβ’Total 26 minutes
- Introductionβ’1 minute
- Create ProjectOPediaβ’2 minutes
- Header and Footerβ’5 minutes
- Map through Project Listβ’6 minutes
- Project Listβ’6 minutes
- Add Routingβ’4 minutes
- Topics Coveredβ’2 minutes
1 assignmentβ’Total 15 minutes
- ProjectOPedia - Assessmentβ’15 minutes
In this module, we will guide you through setting up the basic structure of a .NET API, including creating the project, configuring the database, and implementing essential functionality. You'll also learn how to work with Azure storage for file handling and set up migrations for your database schema, preparing the foundation for more advanced features in the API.
What's included
13 videos1 assignment
13 videosβ’Total 61 minutes
- API is Optional and You Can Use the API Right Hereβ’7 minutes
- Set Up Storage Account for Images on Azureβ’3 minutes
- Create API Projectβ’2 minutes
- Install NuGet Packagesβ’2 minutes
- Set Up Connection String and DBContextβ’6 minutes
- Create SQL Tables and Push Migrationsβ’8 minutes
- Add Name to AspNetUsersβ’4 minutes
- Create Menu Item Tableβ’4 minutes
- Seed Menu Itemsβ’4 minutes
- Get Menu Item and API Responseβ’6 minutes
- Get Individual Menu Itemβ’4 minutes
- Add Storage Account Connection Stringβ’6 minutes
- Implement Blob Serviceβ’4 minutes
1 assignmentβ’Total 15 minutes
- .NET API - Basic Setup - Assessmentβ’15 minutes
This module focuses on building the menu item functionality for your .NET API. You will learn how to create, update, and delete menu items, and implement API endpoints for these actions. By the end of this section, youβll have the skills to manage menu items effectively and ensure proper API response handling.
What's included
5 videos1 assignment
5 videosβ’Total 23 minutes
- Create Menu Itemβ’10 minutes
- Create Menu Item in Actionβ’2 minutes
- Update Menu Itemβ’7 minutes
- Delete Menu Itemβ’3 minutes
- Correct Status Code and Success Flagβ’1 minute
1 assignmentβ’Total 15 minutes
- .NET API - Menu Item - Assessmentβ’15 minutes
In this module, you will learn how to secure your .NET API by implementing authentication and authorization using JWT tokens. We will guide you through the process of setting up login and register endpoints, as well as securing resources to ensure that only authorized users can access protected routes.
What's included
8 videos1 assignment
8 videosβ’Total 46 minutes
- Add Login and Register DTOsβ’4 minutes
- Auth Controller and Dependency Injectionβ’5 minutes
- Register in Actionβ’11 minutes
- Login in Actionβ’4 minutes
- JWT Tokenβ’7 minutes
- Add Authentication and Authorization Endpointsβ’5 minutes
- Set Up API for Authenticationβ’3 minutes
- Add Security to Swaggerβ’7 minutes
1 assignmentβ’Total 15 minutes
- .NET API - Authentication and Authorization - Assessmentβ’15 minutes
In this module, you will implement shopping cart and order management features in your .NET API. You will learn to add items to the cart, place orders, and manage order details. This section also covers integrating Stripe for secure payment processing, ensuring your application supports a complete e-commerce workflow.
What's included
14 videos1 assignment
14 videosβ’Total 70 minutes
- Add Shopping Cart Modelsβ’8 minutes
- Shopping Cart Controller and Logicβ’4 minutes
- Update Shopping Cart Endpointβ’11 minutes
- Test Shopping Cart Endpointβ’3 minutes
- Get Shopping Cartβ’5 minutes
- Order Header and Details Modelβ’5 minutes
- Order DTOsβ’3 minutes
- Get Orderβ’4 minutes
- Create Order in Actionβ’6 minutes
- Update Order Detailsβ’4 minutes
- Stripe Payment Endpointβ’6 minutes
- Stripe Client Secret in Actionβ’6 minutes
- Shopping Cart API Updateβ’2 minutes
- Deploy APIβ’5 minutes
1 assignmentβ’Total 15 minutes
- .NET API - Shopping Cart and Order - Assessmentβ’15 minutes
In this module, we will walk you through creating a homepage for the Red Mango website using TypeScript and Bootstrap. You'll learn how to structure your project, fetch data for dynamic content, and implement reusable components that enhance the user experience. This section will give you hands-on experience in building a visually appealing and functional homepage.
What's included
13 videos1 assignment
13 videosβ’Total 50 minutes
- Typescript Introductionβ’4 minutes
- Create App with TypeScriptβ’2 minutes
- Package JSONβ’2 minutes
- File Cleanupβ’3 minutes
- Install Bootstrap and Bootstrap Iconsβ’3 minutes
- Header and Footer Componentβ’5 minutes
- Header UIβ’3 minutes
- Fetch Menu Items and Interfaces in TypeScriptβ’7 minutes
- Better Structureβ’4 minutes
- Card Componentβ’4 minutes
- Homepage UIβ’3 minutes
- Add Routing and Not Foundβ’6 minutes
- Menu Item Details Pageβ’5 minutes
1 assignmentβ’Total 15 minutes
- Red Mango - Homepage - Assessmentβ’15 minutes
In this module, we will teach you how to set up Redux and RTK (Redux Toolkit) in your restaurant website project. Youβll learn how to fetch menu items, display them dynamically, and manage data with Redux. This section will help you efficiently manage state and API data to create a responsive, real-time restaurant website.
What's included
7 videos1 reading3 assignments
7 videosβ’Total 29 minutes
- Add Redux and Redux Toolkit to Projectβ’7 minutes
- Add Query to Fetch Menu Itemsβ’7 minutes
- Call Slice to Fetch Dataβ’4 minutes
- Display Loading Textβ’1 minute
- Assignment 19 - Load Menu Item Detailsβ’1 minute
- Assignment 19 Solution - Load Menu Item Detailsβ’6 minutes
- Manage Quantity on Menu Item Detailsβ’4 minutes
1 readingβ’Total 10 minutes
- Conclusion to the Course 'Redux, State Management, and Advanced React Concepts'β’10 minutes
3 assignmentsβ’Total 90 minutes
- Full Course Practice Assessmentβ’15 minutes
- Set Up Redux and RTK - Assessmentβ’15 minutes
- Full Course Assessmentβ’60 minutes
Earn a career certificate
Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.
Instructor
Offered by
Explore more from Software Development
Course
Status: Free TrialCategory: Credit offered- S
Scrimba
Course
Status: Free TrialCategory: Credit offered Course
Category: Credit offered- P
Packt
Course
Category: Credit offered
Why people choose Coursera for their career
Frequently asked questions
Redux, State Management, and Advanced React Concepts is a course designed to deepen your understanding of state management and enhance your React skills. Redux is a state management tool that enables efficient management of application data, especially in complex React applications. This course covers integrating Redux with React, using Redux Toolkit for optimized state management, and implementing advanced techniques like queries, mutations, and asynchronous calls. Understanding state management in React is crucial for building scalable and maintainable web applications.
This course provides an in-depth exploration of Redux and state management in React applications. It guides you through building real-world applications like ReduxOPedia and TravelOPedia, where you will learn how to integrate Redux, use Redux Toolkit, handle asynchronous data fetching with queries and mutations, and manage complex application states. Additionally, the course also covers how to enhance UI development using TypeScript and Bootstrap, making it an all-encompassing guide for modern React development.
Upon completion of this course, you will be able to manage the state in React applications effectively using Redux and Redux Toolkit. You will also gain expertise in handling asynchronous actions using queries and mutations and optimize data fetching in large-scale applications. Additionally, you will be able to integrate Redux with React for efficient state management and apply these concepts in building scalable projects like an interactive menu or a dynamic shopping cart.
More questions
Financial aid available,
