ReactFoo-VueDay Pune edition

React and Vue for performance engineering and front-end development

use"Context" for state management

Submitted by Saibaba (@nightraiser) on Feb 7, 2020

Duration: 30 mins full talk Status: Submitted

Abstract

Since the start, redux has become a synonym to state management in react. In the presentation we will be walking through the state management jargon and my personal pain points of using redux from past 3 years, my experience of using the context api and useContext hooks to implement flow of state management and also to clean lot of boilerplate code that has to be maintained.

Outline

I am a developer who loves code, poetry and poetic code. What makes code poetic is the sheer simplicity, which make the code more readable, relatable. When i explored the oppurtunity to use context api for the state management i could feel that elegance which somewhere was lacking when i was using redux extensively. I felt I was writing an algorithm which isnt intutive to many, but with context. I felt we were back the roots of simplicity that react is popular for. SO here I will be discussing my experiences with both approaches, what worked me and what has not. The session will follow the below order.

1) State Management Jargon
2) Why State Management
3) Workflow of Redux
4) Plus Points of Redux
5) My Pain Points of Redux
6) Demo
7) QA

Requirements

1) Experience with Redux
2) Base understanding of react hooks

Speaker bio

I am a fullstack developer. I have been working on Javascript technologies from past 3 years. Mainly on react, react native and node js. I love code, poetry and poetic code What makes code poetic to me is the sheer simplicity, which make the code more readable, relatable.

Links

Slides

https://docs.google.com/presentation/d/1tkY0LLi4UQrzqv_iZMe3UfpJCP9wXMKD1-ch99pen0s/edit?usp=sharing

Comments

{{ gettext('Login to leave a comment') }}

{{ gettext('You need to be a participant to comment.') }}

{{ formTitle }}
{{ gettext('Post a comment...') }}
{{ gettext('New comment') }}

{{ errorMsg }}