TypeScript with React
Add type safety to React apps with TypeScript.
Add TypeScript to React for type safety.
Setup
```bash npx create-react-app my-app --template typescript ```
Component with Props
```typescript interface UserProps { name: string; age: number; email?: string; }
function User({ name, age, email }: UserProps) { return <div>{name}, {age}</div>; } ```
useState with Types
```typescript const [count, setCount] = useState<number>(0); const [user, setUser] = useState<User | null>(null); ```
Event Types
```typescript const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => { console.log(e.target.value); };
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => { e.preventDefault(); }; ```
Remember
- Define prop interfaces - Type state and events - Better IDE support - Catch errors early
> Next: Learn Next.js basics!