React Typescript Tutorial for Beginners

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

In this React Typescript Tutorial for beginners you will learn about function components, passing props, default values, passing setState, and all of the associated TS types and return types. React + Typescript!

🚀 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

React Typescript Tutorial for Beginners

(00:00) Intro
(00:11) Welcome
(00:32) Setup & Starter Code
(03:39) Function Components
(05:16) Component Return Types
(06:24) Heading Component Example
(07:34) Old Code You May See
(10:09) Recommended Code & Default Values
(14:45) useState hook
(16:11) Simple Counter Example
(17:45) Passing Down setState & children
(21:19) Generic List Example

📚 Suggested Pre-requisites for this Typescript course:
🔗JavaScript for Beginners full course:    • JavaScript Full Course for Beginners ...  

📚 Tutorial References:
🔗 TypeScript + React Cheatsheet: https://github.com/typescript-cheatsh...
🔗 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 Typescript tutorial helpful? If so, please share. Let me know your thoughts in the comments.

#react #typescript #tutorial