Tài liệu lập trình front end reactjs lab 7

MỤC TIÊU:Kết thúc bài thực hành này bạn có khả năng✓ Redux form✓ Restbased app reactNỘI DUNG Sử dụng project streams của Lab6 để thực hiện tiếp tục bài Lab7Bài 1: Redux form Cài đặt reduxform Kết nối reduxformMỤC TIÊU:Kết thúc bài thực hành này bạn có khả năng✓ Redux form✓ Restbased app reactNỘI DUNG Sử dụng project streams của Lab6 để thực hiện tiếp tục bài Lab7Bài 1: Redux form Cài đặt reduxform Kết nối reduxform

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 1

MỤC TIÊU:

Kết thúc bài thực hành này bạn có khả năng

✓ Redux form

✓ Rest-based app react

NỘI DUNG

- Sử dụng project streams của Lab6 để thực hiện tiếp tục bài Lab7

Bài 1: Redux form

- Cài đặt redux-form

- Kết nối redux-form

- Tạo form và xử lý sự kiện

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 2

- Form validate

- Show error

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 3

Bài 2: Rest-based app react

- Tạo api server trên streams project với cấu trúc như hình sau

- Cấu trúc project

- Mô tả

• API server chưa start

• API server start

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 4

• StreamList

• Create & Edit

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 5

• Cấu trúc Components

• Cấu trúc reducer

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 6

- Hướng dẫn

• Apis

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 7

• Action

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 8

• Component

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 9

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 10

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 11

LẬP TRÌNH FRONT-END FRAMEWORK 2 TRANG 12

Bài 3: Browser history

*** Yêu cầu nộp bài:

SV nén file (hoặc share thư mục google drive) bao gồm các yêu cầu đã thực hiện

trên, nộp LMS đúng thời gian quy định của giảng viên KHÔNG NỘP BÀI COI NHƯ KHÔNG CÓ ĐIỂM

- Hết -