Todo List in ReactJS using TypeScript Tutorial

Описание

Best Tech Resume Template: https://papermoontech.com/pmcsrtk/pedro
Use code: PEDRO for 20% off ^

My other TypeScript Video: https://youtu.be/-w1i-gARuJs
Code: https://github.com/machadop1407/TodoList-React-TypeScript

In this video I will teach you guys how to code a todo list in react using typescript. We use the typescript template to generate the application.
-
? Learn ReactJS By Building 6 Projects: https://codedamn.com/learn/reactjs-projects
? PedroTech Discord: https://discord.gg/5aaWSRrskg
-

Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Website: machadopedro.com
Twitter: https://twitter.com/pedrotech_
Linkedin: https://www.linkedin.com/in/machadop1407/
Instagram: https://www.instagram.com/_pedro.machado_
Github: https://github.com/machadop1407
Email: machadop1407@gmail.com

Equipments I Use:
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
? Algorithm Book To Pass Coding Interviews: https://amzn.to/2Z2CirS
? Microphone: https://amzn.to/2MKAm4V
? Keyboard: https://amzn.to/3d0QauN
? HD Webcam: https://amzn.to/3tMpJPD
? Room LED Lights: https://amzn.to/3a5mFGp

0:00 Intro & Project Overview
1:34 Project Setup (using Create React App)
5:09 App Component - Component Type & JSX markup
8:23 Adding & explaining CSS snippets
11:52 Setting up state - useState in TypeScript
14:00 Change handler - track user input
18:43 Click handler - Adding a task to 'todoList' state
19:45 -- defining and setting the Type of 'todoList' using an interface
23:50 -- clearing inputs after adding new task
24:54 Working with components - creating TodoTask - represents a single todo task
27:17 -- accepting component props
29:58 -- writing markup (JSX/TSX) & styles for TodoTask component
33:08 Complete/delete task functionality in App.tsx
36:52 Testing final app
37:43 Outro

Tags:
- TodoList
- Fetch
- ReactJS Tutorial
- ReactJS and MySQL
- NodeJS Tutorial
- API Tutorial