L? Trnh H?c React JS

L? trnh ton di?n ?? xy d?ng giao di?n ng??i dng hi?n ??i v?i th? vi?n JavaScript ph? bi?n nh?t.

Trở về lộ trình
Giai ?o?n Ch? ?? chnh N?i dung & Cng c? M?c tiu s?n ph?m
1 N?n t?ng Web
  • HTML, CSS, JavaScript
  • ES6+ (JavaScript Hi?n ??i)
  • TypeScript
 T?o m?t trang web t?nh ??n gi?n s? d?ng HTML, CSS v JavaScript hi?n ??i.
2 Cng c? Pht tri?n
  • Trnh qu?n l Gi (npm/yarn)
  • Cng c? Build (Vite/CRA)
  • Ki?m sot Phin b?n (Git)
 Thi?t l?p m?t d? n m?i b?ng Vite v s? d?ng Git ?? qu?n l phin b?n.
3 React - N?n t?ng
  • JSX - JavaScript XML
  • Components (Function vs. Class)
  • Props & State
  • Conditional Rendering, Lists & Keys
 Xy d?ng m?t component React c? b?n hi?n th? d? li?u b?ng props v qu?n l tr?ng thi ring c?a n.
4 Hooks & Vng ??i Component
  • useState, useEffect
  • useContext, useReducer
  • T?o Custom Hooks
 Ti c?u trc m?t class component thnh m?t functional component s? d?ng `useState` v `useEffect`.
5 Qu?n l Tr?ng thi Ton c?c
  • Context API
  • Redux (v?i Redux Toolkit)
  • Zustand / Jotai
 T?o m?t ?ng d?ng nh? chia s? tr?ng thi gi?a nhi?u components b?ng Context API.
6 Routing & T??ng tc API
  • React Router
  • G?i API (Fetch/Axios)
  • React Query / SWR
 Xy d?ng ?ng d?ng nhi?u trang b?ng React Router v l?y d? li?u t? m?t API cng khai.
7 Ki?m th? (Testing)
  • Jest
  • React Testing Library
  • Cypress / Playwright
 Vi?t cc unit test cho m?t component React ?? ??m b?o n hi?n th? chnh xc.
8 T?i ?u ha & H? sinh thi
  • T?i ?u ha Hi?u n?ng
  • Th? vi?n UI Component
  • Next.js
 T?i ?u ha m?t ?ng d?ng React v khm ph m?t th? vi?n component nh? Material-UI.

T? duy C?t li cho L?p trnh vin React

1. T? duy Component

Chia nh? giao di?n ng??i dng thnh cc component ??c l?p, c th? ti s? d?ng. M?i component c trch nhi?m duy nh?t v qu?n l tr?ng thi ring c?a n.

2. Lu?ng d? li?u m?t chi?u

D? li?u ch?y t? component cha xu?ng component con thng qua props. ?i?u ny lm cho ?ng d?ng d? d? ?on, g? l?i v b?o tr h?n.

3. State l Ngu?n chn l duy nh?t

Giao di?n ng??i dng l m?t hm c?a state. Thay ??i state, v React s? t? ??ng c?p nh?t UI. T?p trung vo vi?c qu?n l state m?t cch hi?u qu?.

4. Tnh khai bo, khng ph?i m?nh l?nh

M t? giao di?n ng??i dng *nn* trng nh? th? no ? b?t k? tr?ng thi no, v ?? React lo ph?n cn l?i. ??ng thao tc tr?c ti?p v?i DOM.