แอพพลิเคชั่นหนึ่ง ๆ นั้นประกอบไปด้วย component ต่าง ๆ มากมาย ให้ลองนึกถึง Application อย่างเช่น Application สำหรับ Chat ก็มีกล่องข้อความให้ใส่ พิมพ์ข้อความ กดปุ่มส่ง แล้วส่งข้อมูลไปยัง server จากนั้นข้อความที่ส่งไปก็จะขึ้นบนหน้าจอ จะเห็นว่า Application หนึ่ง ๆ มีการเปลี่ยนแปลง State ต่าง ๆ มากมาย เช่น state ของข้อความที่ส่ง , state ที่ระบุว่าจะแสดงแถบข้อความ หรือไม่แสดง , state ของ list ของข้อความทั้งหมดที่มีการ update เพิ่ม เป็นต้น ดังนั้นหากไม่มีการจัดการที่ดี State จะเยอะมากและทำให้สับสนเวลาพัฒนาโปรแกรม และอีกเหตุผลหนึ่งคือ ตัวแปร State ของคอมโพเนนท์หนึ่ง ๆ อาจถูกเปลี่ยนแปลงค่าได้จากคอมโพเนนท์อีกอันหนึ่ง ซึ่งตัวแปร State บางอย่างต้องถูกอ้างอิงจากแหล่งเดียว มิฉะนั้นจะทำให้เกิดความสับสน (data redundancy) ทำให้ข้อมูลที่อ้างอิงไม่ตรงกันได้ จึงเกิดแนวคิด Redux & Store ขึ้นเพื่อแก้ปัญหาดังกล่าว
สิ่งที่ต้องรู้ในการทำ Redux & Store
1. Store => ที่เก็บข้อมูล (อาจเกิดจากการ combine จาก หลาย ๆ ส่วน )
2. Reducer => ตัวจัดการข้อมูลในแต่ละส่วน เช่น UserReducer ตัวจัดการ state ที่เกี่ยวข้องกับ User
3. dispatch => คือการเรียกฟังก์ชันเพื่อเปลี่ยนแปลงค่า State ใน Reducer
4. payload => ค่าที่ทำการเปลี่ยนแปลง
เพื่อให้ทำความเข้าใจง่าย ให้นึกตามนี้
Store เป็นแหล่งรวม state ต่าง ๆ จากแหล่งเดียว แต่สามารถนำไปใช้ได้ในทุก component ที่ต้องการเรียกใช้ โดย State ก็จะแบ่งเป็นหมวดหมู่ต่าง ๆ เพื่อให้ Reducer เป็นตัวจัดการ State ในหมวดหมู่นั้น ๆ เมื่อต้องการการจะเปลี่ยนแปลงค่า State เพื่อจะทำอะไรสักอย่างเช่น มีการ Create , Edit , Delete เราก็จะทำการ Dispatch มันซึ่งอาจจะส่งค่าอะไรสักอย่าง (payload) เพื่อเปลี่ยนแปลง state ตามค่านั้น เช่น การ edit เราก็จะ Dispatch มันแล้วโยนค่าข้อมูลใหม่ เพื่อไปแทน ค่าของข้อมูลเดิม เป็นต้น