Best of Redux — 2024

1. 1
   Article

   Syncfusion·2y

   React Hooks vs. Redux in 2024

   The post explores the differences between React Hooks and Redux for state management in React applications in 2024. React Hooks are ideal for simpler, component-level state management and faster development, while Redux is better suited for complex, large-scale applications with global state management. It provides an in-depth comparative analysis and examples of both approaches, highlighting their advantages, common use cases, and performance considerations.

   422

   17
2. 2
   Article

   DEV·2y

   ⚡🚀 ReactJS, TypeScript, Vite with Redux and TanStack (React Query) In Practice ⚛️

   Learn how to combine Redux with Thunk and React Query (TanStack) for managing client-side and server-side state in a ReactJS application. The guide explains setting up a Node.js Express server to handle CRUD operations and provides a step-by-step implementation of the frontend using Vite, TypeScript, Redux, and React Query. This setup leverages Redux for local UI state and React Query for asynchronous data fetching, caching, and synchronization with the server.

   168

   4
3. 3
   Video

   YouTube·2y

   Build a Nextjs Project Management App & Deploy on AWS | Cognito, EC2, Node, RDS, Postgres, Tailwind

   In this detailed guide, Ed Row demonstrates building and deploying a full-stack project management application using Nextjs, Node.js, and AWS. The application includes features like task drag-and-drop, multiple views (list, timeline, table), and user authentication via AWS Cognito. The front end utilizes Nextjs with Redux Toolkit for state management and Tailwind CSS for styling. The backend is handled by Node.js with Express and Prisma for database interactions. AWS services such as EC2, RDS, and Amplify are used for deployment, ensuring the application is scalable and enterprise-ready.

   168

   4
4. 4
   Video

   YouTube·2y

   Build Nextjs Inventory Management Dashboard & Deploy on AWS | Postgres, Node, Tailwind, EC2, RDS, S3

   Learn to build a full-stack inventory management dashboard using Next.js, with a Node.js backend, and deploy it on AWS. The application features dark and light modes, responsive design, and pages for inventory, products, users, settings, and expenses. The frontend uses Redux Toolkit for state management and Tailwind CSS for styling. The backend relies on Node.js and Express.js with Prisma for interacting with a PostgreSQL database, and the deployment involves AWS services like EC2, RDS, Amplify, and S3. Detailed steps for setting up the project, including installing necessary packages and configuring Redux and Tailwind, are also covered.

   165

   2
5. 5
   Video

   Theo - t3․gg·2y

   Why Everyone Loves Zustand

   Zustand is a state management library for React that simplifies state management with a small and efficient API. Unlike Redux, Zustand reduces boilerplate and offers a React hook-based solution. This post dives into using Zustand to refactor an application named Teemo, demonstrating how to instantiate and access state in a more straightforward manner. Zustand's advantages include its small package size, ease of setup, and ability to prevent unnecessary re-renders by selecting specific state slices. The post also briefly touches on the author's experiences with state management in a more complex app and comments on the use of context and middleware.

   129

   2
6. 6
   Article

   Community Picks·2y

   7 steps to understand React Redux

   Learn how to use Redux with React to manage state in larger applications. Understand the concepts of state, store, actions, reducers, and middleware in Redux.

   127

   9
7. 7
   Article

   freeCodeCamp·2y

   Learn Redux and Redux Toolkit for State Management

   State management in React applications is crucial for scalability and efficiency. Redux and Redux Toolkit are essential tools for handling state, offering a structured and predictable way to manage it. A new, comprehensive course by Khaiser Khanam on freeCodeCamp.org's YouTube channel covers everything from foundational concepts to advanced state management patterns, practical examples, and best practices. It starts with Redux basics and moves to Redux Toolkit essentials, making complex topics accessible through real-world projects.

   103

   2
8. 8
   Article

   Towards Dev·2y

   Implementing Redux from Scratch

   Learn to implement Redux from scratch, covering key functions and objects such as createStore, combineReducers, connect, and Provider. Understand Redux data flow, createStore for state management, combineReducers for combining multiple reducers, connect for connecting React components to a store, and Provider for making the Redux store available to nested components.

   100

   2
9. 9
   Article

   Community Picks·2y

   Zustand Documentation

   A comparison of Zustand with other state management libraries for React, including Redux, Valtio, Jotai, and Recoil. It discusses the differences in state model and render optimization approaches.

   56

   3
10. 10
    Article

    freeCodeCamp·2y

    Data Flow in Redux Explained – A State Management Handbook

    Redux is a predictable state management library for JavaScript applications, primarily used with React. It introduces a unidirectional data flow, ensuring predictable and manageable state changes. Key concepts include the Redux store, actions, reducers, and selectors. Redux simplifies debugging, facilitates testing, and scales well with large applications. It also handles asynchronous actions effectively using middleware like Redux Thunk and Redux Saga. Following best practices such as organizing reducers and actions and maintaining immutable state updates are crucial for effective Redux usage.

    54
11. 11
    Article

    LogRocket·2y

    Comparing TypeScript state management solutions

    Comparing TypeScript state management solutions in frontend development. Explore challenges and benefits of state management in TypeScript with libraries like React-Redux, MobX, NgRx, Recoil, React Query, and Jotai.

    45

    3