Chia sẻ khóa học nhận ngay hoa hồng cực khủng lên đến 45% Thử ngay

Lập trình React JS và Redux qua bài tập thực hành

(0 lượt đánh giá khóa học)
Nguyễn Đức Việt

Tổng quan

Giới thiệu vể React JS - thư viện javascript phát triển bởi Facebook.

Sức mạnh khủng khiếp mà Facebook mang đến trong React, đó chính là mô hình DOM, làm tăng khả năng trình diễn các đối tượng trên nền web một cách hiệu quả & tốc độ mượt hơn bất kì Java Script Framework nào trước đây.

Mục đích mà Facebook nhắm đến trong React là "Learn Once, Write Anywhere" - Có nghĩa là sau khi hoàn tất khóa học React JS, ngoài việc bạn thiết kế được layout web, bạn còn sẽ có nền tảng vững chắc để tiếp cận React Native (Mobile App) mà không cần phải mất nhiều thời gian.
Yêu cầu của khóa học
- Máy tính cấu hình bình thường. Khuyến cáo Ram từ 4G trở lên.
Lợi ích từ khóa học
- Nắm được kiến thức bài bản từ đầu về thư viện Javascript nổi tiếng phát triển bởi facebook - React JS.
- Nắm được logic hoạt động, các khái niệm, cách thao tác, lập trình chức năng và cách kết hợp Redux và React JS.
- Học từ đầu về cách thao tác với cơ sở dữ liệu PostgreSQL.
- Hiểu cách xử lý Router trong lập trình React JS.
- Học cách tích hợp React JS với LocalStorage.
- Học cách tích hợp React JS với Firebase.
- Lập trình Node JS với cơ sở dữ liệu PostgreSQL.
- Đưa bạn từng bước đi từ chưa biết gì cho đến lúc bạn có thể tự tin apply vào các công ty lập trình React.
- Khóa học sẽ giúp bạn có thể thiết kế những trang web dựa trên nền tảng React một cách chuyên nghiệp nhất.
- Hoàn tất khóa học, bạn có thể apply vào các công ty lập trình Web có yêu cầu React với "Profile cá nhân của bạn có React JS là Headhunt sẽ gọi tới bạn liên tục"!
- Khóa học sẽ giúp bạn lập trình Node JS với vai trò API, và React JS với vai trò frontend thông qua một ứng dụng fullstack Javascript.
Đối tượng mục tiêu
- React cực kì thân thiện đối với bạn nào đã từng học qua JavaScript, CSS hoặc HTML.
- Sinh viên học lập trình web, muốn tối ưu tốc độ xử lý của website.
- Những người muốn tiếp cận công nghệ lập trình web bằng React JS nhanh nhất qua bài thực hành.
- Người muốn tìm hiểu về lập trình frontend bằng React JS một cách bài bản nhưng chưa biết bắt đầu từ đâu.
- Các lập trình viên front-end đang sử dụng các framework khác, nay muốn nâng cao tay nghề thông qua việc học ReactJS.
- Các lập trình viên back-end, mobile muốn chuyển sang phát triển các ứng dụng front-end trong thời gian ngắn nhất.
- Các lập trình viên đang băn khoăn, muốn lựa chọn một framework tốt cho phát triển ứng dụng front-end.
Giáo trình
Phần 1 - Giới thiệu
  • Bài 1
    Giới thiệu khóa học
    07:18
Phần 2 - Cài đặt
  • Bài 2
    Cài đặt editor và plugin javascript snippet
    09:08
  • Bài 3
    Cài đặt template sử dụng trong khóa học
    04:04
Phần 3 - Chương trình đầu tiên và khái niệm cơ bản về javascript
  • Bài 4
    Khởi động với hàm đầu tiên trong javasript
    10:45
  • Bài 5
    Khái niệm về biến trong javascript
    05:13
Phần 4 - Toán tử, định danh và câu lệnh so sánh trong javascript
  • Bài 6
    Toán tử và áp dụng trong viết hiệu ứng click
    13:39
  • Bài 7
    Định danh trong javascript
    03:03
  • Bài 8
    Câu lệnh so sánh trong javascript
    09:16
Phần 5 - Kiểu hay sử dụng nhất trong javascript - Mảng và đối tượng
  • Bài 9
    Mảng là gì - Tại sao phải dùng mảng
    06:12
  • Bài 10
    3 cách khai bảo mảng
    05:34
  • Bài 11
    Kiểu dữ liệu đối tượng
    13:36
  • Bài 12
    Thao tác với kiểu dữ liệu đối tượng
    09:19
  • Bài 13
    Dấu nháy và các toán tử rút gọn
    07:56
Phần 6 - Xử lý text, xử lý số và sử dụng vòng lặp trong javascript
  • Bài 14
    Vòng lặp
    09:19
  • Bài 15
    Vòng lặp for in
    05:07
  • Bài 16
    Use Strict là gì
    03:48
  • Bài 17
    Xử lý text trong javascript
    08:55
  • Bài 18
    Xử lý số trong javascript
    04:09
Phần 7 - Hàm và các loại hàm sử dụng trong javascript
  • Bài 19
    Hàm là gì
    10:59
  • Bài 20
    Thực hành với hàm có tham số và không có tham số
    09:50
  • Bài 21
    Return là gì - hai tác dụng của return
    08:12
  • Bài 22
    Clousure function hay sử dụng
    12:30
  • Bài 23
    Thao tác với kiểu dữ liệu đối tượng - vì sao cần phải có constructor
    11:26
  • Bài 24
    Khái niệm const
    04:51
  • Bài 25
    Khái niệm chuỗi thay thế trong javascript
    09:59
  • Bài 26
    Arrow function
    00:00
Phần 08 - Javascript thay cho Jquery
  • Bài 27
    Giới thiệu 4 hàm mới sử dụng trong vẽ giao diện frontend bằng javascript
    06:09
  • Bài 28
    Tạo dữ liệu demo và duyệt mảng phức hợp
    08:15
  • Bài 29
    Hoàn thiện ví dụ demo bằng cách sử dụng Template String trong javascript
    06:09
  • Bài 30
    Giới thiệu phần học javascript thuần viết cho frontend
    05:50
Phần 9 - Sử dụng vòng lặp thao tác với thẻ HTML
  • Bài 31
    Cách truy xuất đến một phần tử và thay đổi giá trị của phần tử trong javascript
    11:39
  • Bài 32
    Sử dụng vòng lặp thao tác với các thẻ HTML
    07:38
Phần 10 - Các hàm truy xuất phần tử dành cho Frontend
  • Bài 33
    Sử dụng ID trong javascript
    06:04
  • Bài 34
    Sử dụng Class trong javascript
    11:31
  • Bài 35
    Sử dụng hàm querySelector
    04:49
  • Bài 36
    Hàm đa năng sử dụng nhiều nhất - querySelectorAll
    10:35
Phần 11 - Các hàm xử lý giao diện của javascript
  • Bài 37
    Ba hàm xử lý giao diện cực mạnh trong javascript
    10:35
  • Bài 38
    Xử lý sự kiện trong javascript và khái niệm về document ready
    10:25
Phần 12 - Học viết hiệu ứng thực tế qua bài tập
  • Bài 39
    Bắt đầu viết hiệu ứng bằng javascript thuần dựa trên kiến thức đã học
    14:29
  • Bài 40
    Phương pháp viết hiệu ứng javascript với Animation
    08:16
Phần 13 - Phương pháp viết hiệu ứng hai chiều với Animation
  • Bài 41
    Viết hiệu ứng 2 chiều nâng cao với javascript
    12:29
  • Bài 42
    Áp dụng javascript vào animation 2 chiều
    16:37
Phần 14 - Viết hiệu ứng tương tác notification của facebook
  • Bài 43
    Viết lại các hiệu ứng tương tác của facebook bằng javascript - Phần HTML
    05:05
  • Bài 44
    Hiệu ứng tương tác facebook - Phần CSS
    08:29
  • Bài 45
    Viết hiệu ứng javascript như facebook - Phần 1
    06:39
  • Bài 46
    Viết hiệu ứng javascript như facebook - Phần 2
    03:52
Phần 15 - Phương pháp viết hiệu ứng tổng quát thông qua truyền tham số bằng HTML5
  • Bài 47
    Phương pháp viết hiệu ứng tổng quát hóa trong truyền dữ liệu của javascript
    04:43
  • Bài 48
    Truyền tham số giữa HTML và Javascript thế nào
    07:05
  • Bài 49
    Học cách viết javascript cho frontend dạng tổng quát
    10:19
Phần 16 - Viết hiệu ứng tổng quát cho Facebook bằng phương pháp truyền tham số
  • Bài 50
    Áp dụng phương pháp tham số HTML qua thực hành hiệu ứng Facebook - Phần HTML
    10:32
  • Bài 51
    Tạo CSS cho phần giao diện hiệu ứng
    04:59
  • Bài 52
    Xử lý hiệu ứng cho Icon bằng javascript
    04:59
  • Bài 53
    Hoàn thiện phần gửi nhận thông tin qua HTML bằng javascript
    10:25
Phần 17 - Tóm tắt phần kiến thức cơ bản javascript
  • Bài 54
    Xử lý if else đối với hiệu ứng click
    12:41
  • Bài 55
    Tổng kết kiến thức javascript học được
    08:55
Phần 18 - Viết hiệu ứng tương tác menu - phần HTML-CSS
  • Bài 56
    Tống kết kiến thức đã học và giới thiệu phần bài tập xử lý menu
    04:42
  • Bài 57
    Phần HTML cho hiệu ứng Menu bằng javascript
    03:43
  • Bài 58
    Phần CSS cho giao diện menu
    09:30
Phần 19 - Viết hiệu ứng tương tác menu - phần Javascript
  • Bài 59
    Phần javascript cho hiệu ứng
    08:16
  • Bài 60
    Phần javascript hoàn thiện và cách sử dụng biểu đồ tốc độ
    06:21
  • Bài 61
    Hướng dẫn cách xử lý các hiệu ứng còn lại
    07:42
  • Bài 62
    Viết chức năng tương tác ảnh của facebook bằng javascript native
    00:00
Phần 20 - Các hàm cần thiết để thao tác với hiệu ứng Scroll
  • Bài 63
    Bắt sự kiện và tính vị trí
    07:38
  • Bài 64
    Bài tập đầu tiên với hàm scroll
    07:58
  • Bài 65
    Hoàn thiện hiệu ứng Content Slider.mp4
    03:33
Phần 21 - Xử lý phần giao diện và tương tác cho hiệu ứng Scroll đầu tiên
  • Bài 66
    Xử lý phần giao diện
    03:50
  • Bài 67
    Xử lý phần javascript
    08:04
  • Bài 68
    Hoàn thiện hiệu ứng scroll sử dụng javascript
    03:16
Phần 22 - Viết hàm tương tác Scroll qua bài tập thực tế trên facebook - kenh14
  • Bài 69
    Thực hành viết hàm scroll qua bài tập thực tế
    11:01
  • Bài 70
    Viết hàm javascript xử lý phần Menu Scroll
    06:19
  • Bài 71
    Viết javascript tương tác cho cột bên phải
    10:27
  • Bài 72
    Tổng kết các hàm javascript xử lý cho tương tác scroll
    07:28
Phần 23 - Viết hiệu ứng load bằng Javascript
  • Bài 73
    Viết hiệu ứng load bằng javascript
    12:24
Phần 24 - Khởi động Project viết hiệu ứng Slide bằng javascript
  • Bài 74
    Viết hiệu ứng Slide bằng javascript
    03:30
  • Bài 75
    Khởi động project slide bằng javascript
    03:30
Phần 25 - Phương thức xử lý phần chuyển Slide bằng javascript
  • Bài 76
    Xử lý CSS phần chuyển slide
    05:00
  • Bài 77
    Viết javascript cho phần chuyển slide
    07:23
Phần 26 - Cách xử lý giao diện luôn luôn Full màn hình
  • Bài 78
    Xử lý phần bố cục HTML cho nội dung slide
    06:57
  • Bài 79
    Cách xử lý giao diện lúc nào cũng full màn hình
    09:16
Phần 27 - Dựng bố cục và nội dung cho Slide
  • Bài 80
    Dựng bố cục cơ bản cho Slide bằng relative và absolute
    10:10
  • Bài 81
    Xử lý chi tiết giao diện của Slide và hoàn thiện giao diện
    11:16
Phần 28 - Logic của việc tạo hiệu ứng chuyển động trong Slide
  • Bài 82
    Tính vị trí của đối tượng bằng Javascript
    11:14
  • Bài 83
    Viết hiệu ứng Slide chuyển động tương ứng khi click vào nút
    06:19
  • Bài 84
    Logic của việc tạo hiệu ứng chuyển động bằng CSS3 kết hợp với javascript
    07:24
Phần 29 - Hoàn thiện hiệu ứng
  • Bài 85
    Viết hoàn chỉnh hiệu ứng chuyển động của toàn bộ slide - Phần 1
    05:19
  • Bài 86
    Viết hoàn chỉnh hiệu ứng chuyển động của toàn bộ slide - Phần 2
    07:59
Phần 30 - Viết hàm Auto Slide
  • Bài 87
    Lý thuyết về auto slide
    04:38
  • Bài 88
    Tính xem đang ở Slide nào
    10:08
  • Bài 89
    Viết hàm tự chuyển động
    05:10
  • Bài 90
    Hoàn thiện hiệu ứng Javascript auto slide
    05:46
  • Bài 91
    Ý nghĩa của hàm clearInterval
    05:20
Phần 31 - Khởi động projec thứ 2 viết hiệu ứng slide nâng cao
  • Bài 92
    Giới thiệu phần hướng dẫn viết hiệu ứng nâng cao
    05:49
  • Bài 93
    Khởi động project với HTML
    10:38
Phần 32 - Hoàn thiện phần giao diện
  • Bài 94
    Xử lý giao diện Project trực tiếp bằng Chrome Dev Tool
    08:07
  • Bài 95
    Hoàn thiện giao diện chuẩn bị cho viết tương tác bằng Javascript
    07:57
Phần 33 - Logic của hàm javascript
  • Bài 96
    Phân tích logic của chương trình
    08:38
  • Bài 97
    Cách xác định phần tử hiện tại và phần tử tiếp theo khi ấn nút Next
    12:22
Phần 34 - Viết chuyển động bằng Javascript và CSS3
  • Bài 98
    Thêm chuyển động bằng Javascript
    05:24
  • Bài 99
    Viết CSS3 cho chuyển động đầu tiên
    06:02
Phần 35 - Giới thiệu hàm Javascript check trạng thái của chuyển động
  • Bài 100
    Phân tích luồng hoạt động tiếp theo của hiệu ứng tương tác
    05:09
  • Bài 101
    Giới thiệu hàm Javascript check trạng thái của chuyển động
    08:36
Phần 36 - Hoàn thiện hàm xử lý nút next của hiệu ứng
  • Bài 102
    Check chuyển động slide kết thúc
    04:08
  • Bài 103
    Hoàn thiện hiệu ứng tương tác cho nút next trong slide
    10:10
Phần 37 - Xử lý lỗi click liên tiếp nhiều lần
  • Bài 104
    Xử lý lỗi khi click liên tiếp nhiều lần
    08:32
  • Bài 105
    Xử lý chi tiết biến 'trạng thái' trong chương trình
    11:27
Phần 38 - Hoàn thiện hàm xử lý nút previous của hiệu ứng
  • Bài 106
    Viết hàm Javascript xử lý cho nút Previous
    09:51
  • Bài 107
    Tạo chuyển động sử dụng Javascript
    05:09
  • Bài 108
    Tạo chuyển động sử dụng CSS
    03:12
  • Bài 109
    Hoàn thiện logic cho nút Previous
    03:41
Phần 39 - Phương pháp đóng gói code trong javascript
  • Bài 110
    Sử dụng kiến thức về Function và tham số để đóng gói code
    09:45
  • Bài 111
    Viết Javascript chi tiết cho việc đóng gói Code
    10:54
Phần 40 - Sử dụng thành thạo toán tử 3 ngôi qua việc đóng gói code
  • Bài 112
    Sử dụng toán tử ba ngôi viết 1 dòng bằng 6 dòng
    10:22
  • Bài 113
    Áp dụng toán tử 3 ngôi trong việc đóng gói code - Phần 1
    10:10
  • Bài 114
    Áp dụng toán tử 3 ngôi trong việc đóng gói code - Phần 2
    08:17
  • Bài 115
    Áp dụng toán tử 3 ngôi trong việc đóng gói code - Phần 3
    07:09
Phần 41 - Thiết kế hiệu ứng số 2 và số 3
  • Bài 116
    Chữa bài tập số 2 về thiết kế hiệu ứng hiển thị trên Slide
    07:51
  • Bài 117
    Chữa bài tập số 3 về thiết kế hiệu ứng hiển thị trên Slide
    04:23
Phần 42 - Phản xạ về cách viết hiệu ứng CSS3 qua 6 bài tập
  • Bài 118
    Ứng dụng 4 về xử lý hiệu ứng
    06:30
  • Bài 119
    Bài tập 5 về hiệu ứng javascript
    10:10
  • Bài 120
    Bài tập 6 về hiệu ứng javascript
    07:41
  • Bài 121
    Bài tập 7 về hiệu ứng javascript
    06:43
  • Bài 122
    Bài tập 8 về hiệu ứng javascript
    06:46
  • Bài 123
    Bài tập 9 về hiệu ứng javascript
    05:40
Phần 43 - Khởi động project viết hiệu ứng tương tác ảnh của Facebook bằng Javascript
  • Bài 124
    Viết chức năng tương tác ảnh của facebook bằng javascript native
    03:39
  • Bài 125
    Dựng HTML cho project viết tương tác ảnh trên facebook
    07:05
Phần 44 - Hoàn thiện phần setup HTML - CSS
  • Bài 126
    Hoàn chỉnh HTML nội dung cho tương tác ảnh trên facebook
    06:42
  • Bài 127
    Phần CSS cho nội dung
    10:57
  • Bài 128
    Hoàn thiện giao diện HTML - CSS
    10:57
Phần 45 - Viết Javascript cho chức năng ban đầu của chương trình
  • Bài 129
    Xử lý logic ban đầu cho chương trình
    08:17
  • Bài 130
    Xử lý javascript cho khối nền
    03:07
  • Bài 131
    Viết Javascript cho chức năng đóng cửa sổ
    06:57
Phần 46 - Lại xử lý tiếp CSS
  • Bài 132
    Xử lý phần nội dung hiển thị ra
    03:01
  • Bài 133
    Xử lý phần CSS cho khối thông tin ảnh facebook
    06:02
  • Bài 134
    Xử lý hiển thị khối thông tin bằng javascript
    05:45
Phần 47 - Bắt đầu Code phần ảnh
  • Bài 135
    Bắt đầu làm phần ảnh
    04:00
  • Bài 136
    Xử lý phần CSS cho khối các ảnh
    12:41
  • Bài 137
    Căn giữa một phần tử theo chiều dọc thế nào
    08:47
Phần 48 - Lại xử lý tiếp Javascript
  • Bài 138
    Logic code của phần gallery ảnh
    08:01
  • Bài 139
    Sử dụng Javascript nhận biết ảnh Active
    13:37
  • Bài 140
    Cách xử lý code sau khi active và bí mật của nút X
    08:43
Phần 49 - Logic thực hiện hiệu ứng chuyển ảnh của Facebook
  • Bài 141
    Logic thực hiện việc chuyển ảnh của Facebook
    03:44
  • Bài 142
    Xác định chỉ số phần tử hiện tại bằng Javascript
    04:48
  • Bài 143
    Xác định chỉ số phần tử tiếp theo bằng Javascript
    08:20
Phần 50 - Hoàn thiện hiệu ứng ảnh Facebook
  • Bài 144
    Xử lý hoàn thiện logic cho nút Next facebook
    07:17
  • Bài 145
    Xử lý nút Prev Facebook
    03:50
Phần 51 - Bài tập nâng cao cho phần tương tác ảnh Facebook
  • Bài 146
    Bài tập làm hoàn chỉnh hiệu ứng ảnh facebook
    05:09
Phần 52 - Đổ bê tông' kiến thức qua bài tập thực hành Javascript
  • Bài 147
    CSS3 tóm tắt các thuộc tính cơ bản.mp4
    23:32
  • Bài 148
    Áp dụng thuộc tính tâm quay kết hợp với javascript.mp4
    19:21
  • Bài 149
    Áp dụng hiệu ứng CSS3 sử dụng thuộc tính tâm quay.mp4
    09:14
  • Bài 150
    Sử dụng After Before kết hợp với Scale.mp4
    09:35
  • Bài 151
    Sử dụng thuộc tính Transform Style và Perspective cho hiệu ứng 3D.mp4
    17:17
  • Bài 152
    Thực hành thuộc tính CSS 3D qua bài tập đặc trưng tạo hình lập phương bằng 6 div.mp4
    15:56
  • Bài 153
    Thực hành làm hiệu ứng Youtube bằng Javascript - Phần 1 khởi động.mp4
    12:57
  • Bài 154
    Thực hành làm hiệu ứng Youtube bằng Javascript - Phần 2 xử lý Javascript.mp4
    09:56
  • Bài 155
    Thực hành Javascript qua bài tập làm tương tác trên Lazada.vn.mp4
    03:12
  • Bài 156
    Tạo hiệu ứng Logo cho website Lazada.vn.mp4
    05:50
  • Bài 157
    Xử lý phần cuộn chuột cho website Lazada.vn.mp4
    12:26
  • Bài 158
    Hoàn thiện phần hiệu ứng logo cho website Lazada.vn.mp4
    07:35
  • Bài 159
    Xử lý phần hiệu ứng cuộn chuột thay đổi menu cho Lazada.mp4
    12:26
  • Bài 160
    Xử lý hiệu ứng tương tác cho nút 'Tất cả danh mục'.mp4
    05:32
  • Bài 161
    Xử lý phần logic của việc click vào nút 'Tất cả danh mục'.mp4
    05:59
  • Bài 162
    Hoàn thiện phần tương tác menu của Lazada.mp4
    07:10
  • Bài 163
    Khởi động hiệu ứng Content Slider với phần HTML.mp4
    06:27
  • Bài 164
    Xử lý giao diện Content Slider với CSS.mp4
    09:07
  • Bài 165
    Logic và thao tác với phần nút điều hướng Content Slider.mp4
    09:32
  • Bài 166
    Phần Javascript tương tác với nội dung.mp4
    09:04
Giá khóa học 249.000đ
  • Chủ đề Tin học văn phòng
  • Số bài học 166
  • Thời lượng video 22:03:39
Thêm vào giỏ hàng
Mua 1 lần
học trọn đời
Học mọi lúc
mọi nơi
Dễ hiểu
dễ áp dụng
Kiến thức
sâu rộng
Nguyễn Đức Việt
Giảng viên Thiết kế web tại FPT - Arena
22
Học viên
91
Bài giảng
1
Đánh giá
Tốt nghiệp đại học Bách Khoa Hà Nội, khóa 49, khoa Công nghệ phần mềm. Giảng viên Thiết kế web tại FPT - Arena. Với 5 năm kinh nghiệm giảng dạy và làm việc trong lĩnh vực thiết kế web, anh đã đào tạo hàng nghìn học viên đã tốt nghiệp và làm việc trong lĩnh vực thiết kế, đặc biệt là thiết kế web chuyên nghiệp. Tham gia rất nhiều dự án web cho FPT và các dự án về thiết kế web dựa trên ngôn ngữ lập trình mã nguồn mở.
  • Hướng dẫn thanh toán