ycl818 / react_x_typescript

Challenge-Book A Session

Review how to create reusable components in

• Button (react-router-link, and Normal Button)
• Input (acceptable for general type of input with label)
• Modal(practice with forwardRef with useImperativeHandle for specific function) and use create portal

Create Context for cross-component sharing

---

TypeScript Basics

• Installing & Using TypeScript
  • npm install typescript --save-dev
  • can use npx tsc to compile typescript code
• Type Annotations & Type Inference
• Basic Value Types
• Advanced Value Types & Features

---

TypeScript_with_React_Essentials

A Basic to-do list app with add-and-delete functionalities

• Components, Props & TypeScript
• Handling Events
• Working with State
• Handling Input via Forms & Refs

---

Advanced-Components

• Rendering Different Content Based on Props
• Building Wrapper Components
• Building Polymorphic Components
• Forwarding Refs & Exposing Compoent APIS

---

Advanced State: Context & Reducers

Using React's Context API & useReducer() with TypeScript

• Using the Context API
• Creating & Using Reducer Functions

---

Side Effects & Data Fetching

Type-safe Side Effects & HTTP Requests

• Using useEffect() with TypeScript
• Fetching Data & Handling Responses

---

Using Redux with TypeSctipt

Using Rredux for State Management

• Redux Setup & How it works with TypeSctipt
• Handling State
• Dispatching Acitons