Bạn đam mê phát triển ứng dụng web và muốn trở thành một Frontend Developer chuyên nghiệp? Bạn muốn xây dựng những ứng dụng web hiện đại, hiệu năng cao với React.js và Next.js? Khóa học React Pro Max chính là câu trả lời bạn đang tìm kiếm!
Giới thiệu Khoá Học React Pro Max với Next.js – Làm Chủ Toàn Diện React.JS Hiện Đại Cùng Hỏi Dân IT:
Khóa học React Pro Max được thiết kế để giúp bạn làm chủ toàn diện React.js và Next.js, hai trong số những công nghệ frontend phổ biến và mạnh mẽ nhất hiện nay. Với khóa học này, bạn sẽ được trang bị đầy đủ kiến thức và kỹ năng để xây dựng các ứng dụng web phức tạp, đáp ứng các tiêu chuẩn cao về hiệu năng và trải nghiệm người dùng.
Lợi ích khi tham gia:
- Nắm vững nền tảng React.js: Hiểu sâu các khái niệm cốt lõi như components, state, props, JSX và cách ứng dụng chúng để xây dựng giao diện người dùng.
- Làm chủ Next.js: Tìm hiểu về các tính năng đặc biệt của Next.js như Server-Side Rendering (SSR), Static Site Generation (SSG), routing, và cách tối ưu hóa hiệu năng ứng dụng.
- Thực hành với dự án thực tế: Áp dụng kiến thức đã học vào các dự án thực tế, rèn luyện kỹ năng giải quyết vấn đề và tư duy lập trình.
- Cập nhật kiến thức mới nhất: Luôn được cập nhật những xu hướng và công nghệ mới nhất trong lĩnh vực React.js và Next.js.
- Mở rộng cơ hội nghề nghiệp: Tăng khả năng cạnh tranh trên thị trường việc làm và tìm kiếm những cơ hội nghề nghiệp hấp dẫn.
Ai phù hợp với khóa học:
- Người mới bắt đầu: Những người muốn tìm hiểu về React.js và Next.js từ đầu.
- Lập trình viên Frontend: Những người muốn nâng cao kỹ năng và kiến thức về React.js và Next.js.
- Sinh viên: Sinh viên các ngành liên quan đến công nghệ thông tin muốn tìm hiểu về phát triển frontend.
- Những người muốn tự học: Những người muốn tự học và khám phá thế giới React.js.
Nội dung khóa học:
Chapter 0 : Giới thiệu
#0. Demo Kết quả đạt được
#1. Hướng Dẫn Download Tài liệu khóa học
#2. Yêu cầu của khóa học
#3. Về khóa học này
#4.1 Hướng Dẫn Sử Dụng Khóa Học Hiệu Quả
#4.2 Về tác giả
Chapter 1: Setup Environment
#5. Công cụ code IDE
#6. Browser
#7. Node.JS
#8. Quản lý code với Git
Chapter 2 : Ôn tập javascript
#9. Cách học kiến thức Javascript hiệu quả
#10. Destructuring Assignment
#11. Spread syntax
#12. Conditional Operator (Toán tử điều kiện)
#13. Optional Chaining
Chapter 4 : React Hook
#30. Event Handler
#31. State là gì ?
#32. useState Hook
#33. Bài tập về State (part 1)
#34. Bài tập về State (part 2)
#35. Passing Function từ Cha sang Con (Parent to Child)
#36. Lift up State
#37. Vòng đời của component
#38. Về React Cơ Bản
Chapter 5 : Setup Dự Án Backend
#39. Giới thiệu tổng quan về dự án thực hành
#40. Cài đặt Postman
#41. Cài đặt Mongodb Compass tại local
#42. Setup database MongoDB Atlas
#43. Kích hoạt dự án backend
#44. Run dự án backend
Chapter 6 : Routing với React ( Client Side )
#45. React Router
#46. Tạo Route Users
#47. Design table User
#48. Backend và API là gì
#49. Postman để test API
#50. Gọi API với React
#51. Mô hình stateless
#52. Hiển thị list User
#53. Sử dụng key React hiệu quả
Chapter 7 : Hướng dẫn sử dụng Chorme Dev Tool ( Bổ trợ )
#54. Thành phần của dev tool
#55. Kỹ thuật check api
#56. Nguyên tắc khi gọi API không có kết quả
Chapter 8 : Module Users
#57. Tích hợp antd
#58. Design giao diện Admin
#59. CSS với React
#60. Tích hợp SASS (SCSS)
#61. Antd Table
#62. Hiển thị danh sách Users
#63. Antd Modal
#64. Design Modal Add New
#65. API Add New User
#66. Bài tập Add New User
#67. Bài tập Design Modal Update User
#68. Bài tập Update User
#69. Design Delete User
#70. Bài tập Delete User
#71.1 Pagination
#71.2 Antd Pagination
#71.3 Update Token
#72. Bài tập Paginate User
Chapter 9 : Tối ưu hóa hiệu năng Form React
#73. Controlled Component vs Uncontrolled Component
#74. Thư viện hỗ trợ Uncontrolled Component
#75. Create User (Uncontrolled Component)
#76. Update User (Uncontrolled Component)
Chapter 10 : React Hiện Đại Với Next.JS
#77. Vấn đề tồn đọng với cách viết React cũ (CSR)
#78. Nextjs là gì
#79. Nextjs làm frontend hay backend ?
#80. Setup dự án với Nextjs (tích hợp MUI)
#81. Cấu trúc dự án Next.js
#82.1 React children
#82.2 React Fragment
#83. Cách đọc tài liệu của Nextjs
#84. Chuyện Next.js ngốn RAM
Chapter 11 : Next Routing
#85. Tạo base giao diện
#86. Routing với nextjs
#87. Định nghĩa route
#88. Phân biệt cách code UI với React
#89. MUI là gì
#90. Cách sử dụng MUI component
Chapter 12 : Module HomePage
#91. Bài tập Design App Bar
#92. Navigating
#93. Share Layout
#94. Server Component
#95. Client Component
#96. Use Client
#97. Bài Tập Design Main Content
#98. Design Footer
#99. Nextjs Environment Variables
#100. Fetch music from backend
#101. Fetch data với Nextjs
#102. Fetch Data HomePage
#103. Fetch Wrapper
#104. Hoàn thiện HomePage
Chapter 13 : Module WaveSurfer
#105. Dynamic Route
#106. Search Params
#107. Giới thiệu về Wavesurfer
#108. Next.JS Public Folder
#109. Wavesurfer Basic
#110. React Ref
#111. Fetch track from Remote
#112. Tạo wavesurfer hook
#113. Sử dụng useMemo hook
#114. Handle Event với useCallback
#115. Add Bar Width
#116. HTML Canvas Gradients
#117. Add Gradients
#118. Add Time
#119. Add Hover
#120. Remove ID by Ref
#121. Add Customize Bar
#122. Add Comment
#123. Add Tooltip
Chapter 14 : Module Auth
#124. Tài liệu về Authentication với Next.js
#125. Giới thiệu về Next-auth
#126. Test Next Auth
#127. Debugs với Next.js và VSCode
#128. Config Next-Auth Routes
#129. Config Github Provider
#130. Luồng hoạt động của Next-auth ?
#131. Config Session Cho Client
#132. Config Session cho Server
#133. Customize Session
#134. Login with Credentials
#135. Nested Layout với Route Group
#136. Bài tập design Login Form
#137. Chữa Bài Tập Design Login
#138. Modify login page with Social Media
#139. Modify login page with Credential
#140. Hiển Thị Thông Báo Lỗi Khi Login
Chapter 15 : Module Tracks
#141. Bài tập hiển thị danh sách tracks (admin)
#142. Chữa bài tập hiển thị danh sách tracks (admin)
#143. Delete a track (admin)
#144. Ý Tưởng Design Upload Track
#145. Input Type File
#146. Tích hợp MUI Tabs
#147. Tích hợp Drag/Drop
#148. Bài tập Design Tab Information
#149. API Upload Single File
#150. Upload file with Axios
#151. Axios with Percents
#152. Upload track complete
#153. Add Custom Message
#154. Profile Page
#155. Bài tập render List images
#156. Customize track footer
#157. Quản lý React State Global
#158. Tích hợp React Context
#159. Play/Pause Track with Context
#160. Bài Tập Update view detail
Chapter 16 : Module Like,Comments
#167. Điều cần biết về SEO
#168. Công cụ check SEO
#169. Metadata
#170. SEO 1: Tối ưu hóa project
#171. SEO 2: Đặt tên Title/Description (Static) cho web page
#172. SEO 3: Đặt tên Title/Description (Dynamic) cho web page
#173.1 Cách hosting ảnh FREE (Bonus)
#173.2 SEO 4: Share link website trên Facebook/Twitter
#174. SEO 5: Thêm logo cho website
#175. SEO 6: Url với slug
#176. SEO 7: Robot.txt, sitemap và manifest.json
#177. SEO 8: JSON-LD
#178. SEO 9: Next.js Image
#179. Add Progress Bar
#180. Handle Error
#181. Middleware
#182. Add Loading
#183. Nextjs Build Script
#184. Build với Docker
#185. Phân tích kết quả Next.js build
#186. SSR và Static Site Generation
#187. SSG và generateStaticParams
#188. NextJS Caching
#189.1 Revalidating data (Time based revalidation)
#189.2 Revalidating data (On-demand revalidation)
#190. Bài tập Playlist Page
#191. Bài tập Likes page
#192. Bài tập Chức năng search
#193. Login with Google
#194.1 Fix bug dự án
#194.2. Upgrade Next.js Version (và các thư viện khác)
#195. Why NextJS ?
#196. Nhận xét về Level Fresher
#197. Nhận xét về khóa học này
#198. What’s next – Học gì tiếp theo ?
#199. Chuyện công nghệ update
#200. Một vài lưu ý về Next.js Update
#201. Next.js 14 có gì hot ?
#202. Setup Next.js 14 Only
#203. Setup Antd
#204. Bài tập Design Login Form với Antd
#205. Khái niệm Flick giao diện
#206. Setup Antd với Render trên Server
#207. Tổng quan về Server Actions
#208. Handle Form với Server
#209. Loading State và useFormStatus Hook
#210. Handling Response Data và useFormState Hook
#211. Các công cụ sử dụng với Server Actions
#212. Call Server Actions from Functions ?
#213. Design Giao Diện CRUD
#214. Bài Tập Create User Actions
#215. Bài Tập Update User Actions
#216. Bài Tập Delete User Actions
#217. Update Dự Án SoundCloud Sử Dụng Next.js 14
#218. So sánh Server Actions và Route Handler
#219. Tổng kết về Server Actions
Kết:
Khóa học React Pro Max là một hành trình tuyệt vời để bạn trở thành một Frontend Developer chuyên nghiệp. Với kiến thức và kỹ năng được trang bị từ khóa học, bạn sẽ tự tin xây dựng những ứng dụng web hiện đại, chất lượng cao và đáp ứng được nhu cầu của thị trường.