Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap
Learn useReducer with Typescript + React Hooks in this React + TS tutorial. useReducer is a replacement for the useState React hook, and is often used with more complex state. Learn how to provide types for a reducer function, actions, and more.
🚀 Become a full-stack web dev with Zero To Mastery Courses:
The Complete Web Developer: https://bit.ly/WebDevMaster
Master the Coding Interview: https://bit.ly/FAANGInterview
Junior to Senior Dev Roadmap: https://bit.ly/WebDevRoadmap-JrtoSr
🚩 Subscribe ➜ https://bit.ly/3nGHmNn
📬 Course Updates ➜ https://courses.davegray.codes/
❓ Questions - Please post them to my Discord ➜ / discord
☕ Buy Me A Coffee ➜ https://www.buymeacoffee.com/davegray
👇 Follow Me On Social Media:
Github: https://github.com/gitdagray
Twitter: / yesdavidgray
LinkedIn: / davidagray
🔗 All Resources for this Typescript Course: https://github.com/gitdagray/typescri...
🔗 Playlist for this Typescript Course: http://bit.ly/3GcNJ78
Learn useReducer with Typescript + React
(00:00) Intro
(00:08) Welcome
(00:30) Starter Code Review
(02:45) What is useReducer?
(03:30) Define initial state
(03:51) Reducer Action Type: enum or object?
(04:58) type ReducerAction
(05:37) reducer function
(08:38) Refactoring from useState to useReducer
(11:18) Adding a Payload
📚 Suggested Pre-requisites for this Typescript course:
🔗JavaScript for Beginners full course: • JavaScript Full Course for Beginners | Com...
📚 React Hooks tutorials:
🔗 useState: • Avoid this React State Mistake | React Pre...
🔗 useEffect: • React useEffect Hook tutorial | Learn ReactJS
🔗 useCallback: • useCallback STOPS this React MISTAKE | use...
🔗 useMemo: • useMemo Explained | React Hooks useMemo Tu...
🔗 useRef: • BUILD a React Timer with useRef | React Ho...
🔗 useReducer: • useReducer is BETTER than useState | React...
📚 Tutorial References:
🔗 TypeScript + React Cheatsheet: https://github.com/typescript-cheatsh...
🔗 React Official Website: https://reactjs.org/
🔗 Typescript Official Website: https://www.typescriptlang.org/
🔗 Anders Hejlsberg, Creator of Typescript and C# Interview: https://dev.to/destrodevshow/typescri...
🔗 Stackoverflow Survey Results: https://survey.stackoverflow.co/2022/...
🔗 MDN - Static Typing: https://developer.mozilla.org/en-US/d...
🔗 MDN - Dynamic Typing: https://developer.mozilla.org/en-US/d...
🔗 MDN - Type Coercion: https://developer.mozilla.org/en-US/d...
🔗 TS Type Assertions: https://www.typescriptlang.org/docs/h...
⚙ Web Dev Tools:
🔗 Vite: https://vitejs.dev/
🔗 Chrome Browser: https://www.google.com/chrome/
🔗 Visual Studio Code (VS Code): https://code.visualstudio.com/
🔗 Node.js & npm: https://nodejs.org/
🔗 Live Server VS Code Extension: https://marketplace.visualstudio.com/...
Was this React Hooks + Typescript useReducer tutorial helpful? If so, please share. Let me know your thoughts in the comments.
#usereducer #react #typescript
On this page of the site you can watch the video online Learn useReducer with Typescript + React Hooks with a duration of online in good quality, which was uploaded by the user Dave Gray 16 December 2022, share the link with friends and acquaintances, this video has already been watched 22,474 times on youtube and it was liked by 725 viewers. Enjoy your viewing!