---
title: "Discussion on \"Learn How to use Context and Reducer Hooks in React.js by Creating a Global Snackbar.\" | Hashnode"
description: "Discussion on \"Learn How to use Context and Reducer Hooks in React.js by Creating a Global Snackbar.\". Discover the power of Context & Reducer Hooks in React.js by creating a global snack bar using TypeScript and bootstrapping with Vite."
url: "https://hashnode.com/posts/learn-how-to-use-context-and-reducer-hooks-in-reactjs-by-creating-a-global-snackbar/63cc91c2587fc59d3cd771e7"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [Learn How to use Context and Reducer Hooks in React.js by Creating a Global Snackbar.](https://blog.kunalkeshan.dev/learn-how-to-use-context-and-reducer-hooks-in-reactjs-by-creating-a-global-snackbar?utm_source=hashnode&utm_medium=feed)

Discover the power of Context & Reducer Hooks in React.js by creating a global snack bar using TypeScript and bootstrapping with Vite.

Jan 22, 2023 · 12 min read · blog.kunalkeshan.dev  
Read the article

-   [#reactjs](https://hashnode.com/tag/reactjs)
-   [#typescript](https://hashnode.com/tag/typescript)
-   [#tutorial](https://hashnode.com/tag/tutorial)
-   [#hooks](https://hashnode.com/tag/hooks)
-   [#web-development](https://hashnode.com/tag/web-development)

## Written by

[Kunal Keshan](https://hashnode.com/@kunalkeshan)

@kunalkeshan · Chennai, India

  
[View profile](https://hashnode.com/@kunalkeshan)

Web Developer. Writer. Creator. On a spree of creative exploration!

I'm currently a student at SRMIST, pursuing ECE. I love coding, learning and making web development projects, reading and writing and creating YouTube videos.

## Responses 2

Markdown supported · ⌘↵ to post

[Sanchit Bajaj](https://hashnode.com/@solitrix02)

[Jan 29, 2023](https://hashnode.com/posts/learn-how-to-use-context-and-reducer-hooks-in-reactjs-by-creating-a-global-snackbar/63cc91c2587fc59d3cd771e7/comment/63d66658d6ba08377e948423)

Nice article but I want to ask whether this way of managing states with both useContext and useReducer scalable?

[Kunal Keshan](https://hashnode.com/@kunalkeshan)

[Jan 30, 2023](https://hashnode.com/posts/learn-how-to-use-context-and-reducer-hooks-in-reactjs-by-creating-a-global-snackbar/63cc91c2587fc59d3cd771e7/comment/63d66658d6ba08377e948423#reply-63d793566b2aa4453aa7f64d)

Hey there, thanks!

Sure, the one I've used in this article is limited to a single complex state, so I use two contexts, one for the state and one for the dispatch function.

But if you plan to keep separate states, and retain the global functionality, you can create each context to deliver the state and the dispatch function in the same provider.

This is similar to how the Redux toolkit does, your slices map out to a state with their own reducer functions, only difference is, you have a common dispatch with the redux toolkit.

[Tara Hanson](https://hashnode.com/@tarahanson234)

[Jan 25, 2023](https://hashnode.com/posts/learn-how-to-use-context-and-reducer-hooks-in-reactjs-by-creating-a-global-snackbar/63cc91c2587fc59d3cd771e7/comment/63d0e0c31acaeae4c9da8aa4)

Nice writeup

[Kunal Keshan](https://hashnode.com/@kunalkeshan)

[Jan 25, 2023](https://hashnode.com/posts/learn-how-to-use-context-and-reducer-hooks-in-reactjs-by-creating-a-global-snackbar/63cc91c2587fc59d3cd771e7/comment/63d0e0c31acaeae4c9da8aa4#reply-63d16bc62086bff3543ca877)

Thanks!