TypeScript in React - COMPLETE Tutorial (Crash Course)
ByteGrad
@bytegradAbout
Hi, I'm Wesley. I'm a brand ambassador for Kinde (paid sponsorship). My COMPLETE React & Next.js course is out now! Find it here: https://bytegrad.com/courses/professional-react-nextjs It's the #1 resource to master the latest React & Next.js. I'm very proud of it, my best work! Interested in sponsoring me? I love working with sponsors. Please email me here: [email protected] Note that my videos may contain mistakes. Always verify yourself that your code is safe and does what you want it to do for your specific situation. You agree by watching the videos that you are solely responsible for any mistakes in your code. This channel and all its content is owned & operated by ByteGrad Sp. z o.o. with Tax ID: PL6762676561 and KRS-number: 0001125554
Latest Posts
Video Description
👉 NEW React & Next.js Course: https://bytegrad.com/courses/professional-react-nextjs Hi, I'm Wesley. I'm a brand ambassador for Kinde (paid sponsorship). 👉 Add auth to your app FAST: https://bit.ly/3QOe1Bh 👉 NEW React & Next.js Course: https://bytegrad.com/courses/professional-react-nextjs 👉 Professional JavaScript Course: https://bytegrad.com/courses/professional-javascript 👉 Professional CSS Course: https://bytegrad.com/courses/professional-css 👉 Discord: all my courses have a private Discord where I actively participate 🔔 Email newsletter (BIG update soon): https://email.bytegrad.com ⏱️ Timestamps: 0:00 JSX to TSX 0:28 Typing variables 1:28 Typing functions 2:55 Typing React components 3:17 React.FC 3:52 Typing props 6:37 Extracting type 7:20 Benefits of TypeScript 7:44 Optional 8:14 Benefits of TypeScript (cont.) 8:35 'any' type 9:14 Type return value of component? 9:38 Union type 10:03 Extracting type 10:45 Typing arrays 11:32 Tuple type 12:21 React.CSSProperties 14:38 Record type 16:01 Typing functions 17:18 Typing children (React.ReactNode) 18:34 React.JSX.Element vs React.ReactNode 19:42 Typing useState setter function 21:01 Default prop values 21:35 Type Alias vs Interface 24:00 ComponentPropsWithoutRef 26:52 ...rest and ...spread 27:49 Intersection (&) 29:03 Interface extends 29:34 Typing event handler functions 31:13 Typing useState hook 34:33 Typing useRef hook 35:29 'as const' 36:55 Omit utility 37:38 'as' Type Assertion 38:31 Generics (EASY!) 42:00 Generics in React 45:10 index.d.ts vs types.ts 45:34 import type 47:05 'unknown' type 48:20 Zod 48:58 ts-reset library 49:28 Third-party types ('@types' / DefinitelyTyped) 50:33 tsconfig.json 52:09 next-env.d.ts #webdevelopment #programming #coding Note that my videos may contain mistakes. Always verify yourself that your code is safe and does what you want it to do for your specific situation. You agree by watching the videos that you are solely responsible for any mistakes in your code. This channel and all its content is owned & operated by ByteGrad Sp. z o.o. with Tax ID: PL6762676561 . . TOP resource to LEARN AI for Developers - https://datacamp.pxf.io/RGyxrR (paid sponsorship & ByteGrad Sp. z o.o. gets commission)
TypeScript & React Dev Essentials
AI-recommended products based on this video

Magnetic Nasal Strips Starter Kit: Comfortable Nasal Breathing Support for Sleep, Helps Reduce Snoring Noise, Includes 60 Tabs (30 Uses) with 4 Sizes

Environet Hydroponic Growing Kit, Self-Watering Mason Jar Herb Garden Starter Kit Indoor, Windowsill Herb Garden, Grow Your Own Herbs from Organic Seeds (Basil)

Herb Garden Planter Indoor Kit 21Pcs Kitchen Herb Garden Starter Kit Growing Kit Including Wooden Box Burlap Pots Soil Discs Gardening Tools Unique Easter Birthday Christmas Gift Ideas for Women Mom

Bonsai Starter Kit – 1x Bonsai Tree | Complete Indoor Starter Kit for Growing Plants with Bonsai Seeds, Tools & Planters – Gardening Gifts for Women & Men

Of Course It's Good!: Aggressively Delicious Meals ANYONE Can Make and EVERYONE Will Love

MOTOPOWER MP69033 Car OBD2 Scanner Code Reader Engine Fault Scanner CAN Diagnostic Scan Tool for All OBD II Protocol Cars Since 1996, Yellow




















