Reactjs Cơ Bản
Introduce và phân tích kiến thức
ReactJS thông tin cần biết
Tích hợp Bootstrap
Xây dựng Component
Sử dụng Props, Event, Ref và State
Tìm hiểu LifeCycle
Hệ thống kiến thức và mở rộng
React Hooks cơ bản (Update version 16.8.x)
Đây là khóa học nâng cao, ZendVN chỉ nhận các bạn học viên đã học xong khóa học Lập trình Frontend Offline tại ZendVN; hoặc các bạn đã có làm các kiến thức vững về HTML, CSS, Javascript, jQuery
Khóa học Lập trình ReactJS - JS Framework hướng dẫn học viên làm chủ ReactJS và NextJS, sử dụng ReactJS và NextJS trong các ứng dụng thực tế. Thông qua kiến thức của khóa học này, học viên hoàn toàn có thể tự tìm hiểu các Javascript Framework khác như Angular, VueJS
Các bạn phù hợp tham gia khóa học:
- Những bạn đã có kiến thức cơ bản về Javascript, HTML, CSS, Javascript ES6 hoặc
- đã học xong khóa học Lập trình Frontend Offline tại ZendVN hoặc
- đã học xong khóa học Lập trình Frontend Online tại ZendVN
- Sinh viên năm 3 năm 4 muốn tiếp cận với các Javascript Framework một cách bài bản.
- Đã có kiến thức về JS Framework nhưng chưa vững, cần thực hành nhiều dự án thực tế.
Hình thức học
- Kết hợp cả hai hình thức học Online và Offline.
- Học Online là hình thức được tặng kèm các khoá học có liên quan với chương trình hiện tại trên hệ thống ZendVN.
- Đặc thù riêng của ReactJs học viên phải học thêm phiên bản mới của nó là React Hooks.
- Học viên sẽ xem trước video quay sẵn ở nhà để nắm sơ lược về phiên bản cũ (Class Component)
- Trên lớp Offline sẽ được học và áp dụng vào phiên bản mới nhất của ReactJs, kết hợp ôn tập, đào sâu, và thực hành với các dự án kèm các tình huống thực tế để nâng cao và khắc sâu kiến thức.
Kết quả đạt được sau khi tham gia khóa học
- Có tư duy lập trình cốt lõi của một người Front End Developer.
- Có khả năng xây dựng các ứng dụng Web Front End hiện đại theo dạng SPA
- Rèn luyện và có khả năng tra cứu thông tin, đọc tài liệu liên quan tới Front End.
- Được tiếp cận và học hỏi với nhiều kỹ thuật hay và khó từ giảng viên thông qua các dự án thực tế.
- Thực hành và tích hợp được với hệ thống Back End thông qua API.
- Học viên sẽ được cung cấp miễn phí mã nguồn Back End để cài đặt trong máy tính cá nhân và mã nguồn Front End tĩnh để luyện tập với ReactJs.
Các kiến thức khác được hướng dẫn
- Được chia sẻ và định hướng từ giảng viên đã và đang có kinh nghiệm đi làm thực tế.
- Luôn cập nhật kiến thức và tư duy lập trình mới nhất tính tới thời điểm hiện tại phù hợp với mong muốn tuyển dụng của doanh nghiệp hiện nay.
- Rèn luyện tư duy giải quyết vấn đề và tự tra cứu tài liệu.
- Tư vấn viết CV và kinh nghiệm phỏng vấn.
Hỗ trợ 24/7
Group Zalo hỗ trợ 24/7 trực tiếp từ Giảng viên và Mentor.
Projet và thực hành thực tế
Cung cấp các tình huống thực hành, các project thực tế được lồng ghép vào nội dung học, áp dụng ngay vào công việc.
Video Review
Tất cả bài làm của bạn đều được giảng viên quay video review từng dòng code, giúp bạn hoàn thiện cách viết code và tối ưu code.
Thời gian linh động
Bạn sử dụng thời gian rãnh của mình để học tập vào bất kỳ lúc nào bạn muốn.
Tự chủ tốc độ học
Chương trình học đã được cá nhân hóa, tốc độ học nhanh hay chậm hoàn toàn do bạn quyết định.
NỘI DUNG
Chương trình học lập trình 1 kèm 1 là chương trình học lập trình đặc biệt, nội dung học tương đương nội dung ZendVN đang giảng dạy các lớp lập trình offline tập trung (8 học viên) ở Hồ Chí Minh
Phần 01
Ôn tập về Javascript DOM và xử lí event trong Javascript thuần.
Nhập môn ReactJs, cách cài đặt, nâng và giảm version trong mã nguồn ReactJs. Tìm hiểu về Semantic versioning.
Tìm hiểu Babel, Webpack là gì?
Cách sử dụng State và Props trong ReactJs.
Kỹ thuật Props Down - Event Up trong ReactJs.
Phần 02
Tìm hiểu và ôn tập về ReactJs qua các video học ở nhà.
Thực hành và làm việc với Array trong ReactJs.
Tìm hiểu các cách Thêm, Xoá, Sửa thông qua các methods của ES6: map, filter, concat, sort, ... khi làm việc với Array.
Hiểu cách ReactJs tối ưu hiệu suất ứng dụng với key.
Cách tự xây dựng UI Components tối ưu và có khả năng tái sử dụng cao.
Phần 03
Tìm hiểu và ôn tập về ReactJs qua các video học ở nhà.
Tìm hiểu về Redux và mô hình Redux cơ bản với Action, Reducer, Store, Dispatch.
Kết hợp React với Redux bằng thư viện react-redux.
Cách sử dụng Redux trong React Hooks.
Luyện tập Pet Project sử dụng Redux kết hợp với React.
Phần 04
Tìm hiểu và ôn tập về ReactJs qua các video học ở nhà.
Hiểu về khái niệm API. Cách tương tác với API.
Học về Redux và mô hình Redux nâng cao với Middlewares và APIs.
Cách xử lý bất đồng bộ (Asynchronous Programming) trong Javascript.
Cách tổ chức mã nguồn chuẩn với Redux.
Phần 05
Tìm hiểu và ôn tập về ReactJs qua các video học ở nhà.
Tìm hiểu React Router và áp dụng.
Tìm hiểu React Router sử dụng trong React Hooks.
Một số Patterns thường dùng (HOC, Custom Hooks, ...).
Cách tổ chức mã nguồn cho Router trong dự án thực tế.
Phần 06
Xây dựng cấu trúc mã nguồn cho Project thực tế.
Cài đặt hệ thống Back End vào máy tính cá nhân
Cài đặt và kết nối Database với Back End
Cấu hình port, domain tại máy tính cá nhân.
Cách sử dụng Postman để gọi APIs.
Phần 07
Xây dựng chức năng Latest Articles
Xây dựng chức năng Popular List
Xây dựng chức năng Articles List
Xây dựng tính năng Pagination phía Front End kết hợp với Back End thông qua APIs.
Xử lý ngày giờ trong Javascript với thư viện DayJs.
Phần 08
Tìm hiểu về cơ chế bảo mật Token Based Authentication và Json Web Token ứng dụng trong ReactJs.
Cách xử lý Form, Error Handling, Validate Form trong ReactJs và Javascript.
Xây dựng tính năng Form Login, Form Register và Logout.
Kỹ thuật duy trì trạng thái đăng nhập người dùng với token.
Phần 09
Xây dựng tính năng tìm kiếm theo từ khoá, tìm kiếm theo danh mục kết hợp với Router và Query String.
Xây dựng Pagination cho kết quả tìm kiếm.
Ứng dụng Custom Hooks. tối ưu Pagination có tính tái sử dụng cao.
Hiện thực tính năng Highlight Search.
Phần 10
Xây dựng tính năng Menu đa cấp và tương tác với dữ liệu thật với Back End thông qua APIs.
Kỹ thuật xử lí đệ quy dữ liệu trong Javascript với Array.
Kỹ thuật xử lí render đệ quy Component trong ReactJs.
Xây dựng tính năng bài viết chi tiết. Đổ dữ liệu dạng HTML.
Phần 11
Xây dựng tính năng Comments và Reply Comments.
Cách xử lí dữ liệu cho Comments hai cấp.
Ứng dụng Custom Hooks để xây dựng tính năng Pagination cho Parent Comment và Child Comment.
Xây dựng tính năng thêm mới Comment kết hợp với xác thực người dùng.
Phần 12
Tìm hiểu về Ant Design và các UI Components.
Cách sử dụng UI Components phổ biến từ Ant Design.
Tìm hiểu về styled-components. Xây dựng CSS theo dạng modules trong ứng dụng ReactJs.
Cách Override CSS từ các Components có sẵn của Ant Design.
Phần 13
Tiếp tục tìm hiểu về Ant Design và các UI Components, Layouts.
Xây dựng Layout trang Dashboard với Ant Design.
Cách cấu hình Router 2 cấp để xây dựng trang Admin.
Kỹ thuật giới hạn truy cập người dùng vào trang Admin.
Phần 14
Xây dựng tính năng Update thông tin Profile trong trang Dashboard.
Kỹ thuật gọi API để upload hình ảnh trong Javascript.
Xây dựng tính năng thay đổi mật khẩu.
Kỹ thuật xử lí Form và Validate Form với Ant Design.
Phần 15
Xây dựng tính năng đa ngôn ngữ cho Website.
Các ngôn ngữ hỗ trợ: Tiếng Việt, Tiếng Anh, Trung Quốc và Tiếng Pháp.
Cách tổ chức và cấu hình mã nguồn cho ứng dụng đa ngôn ngữ.
Cách sử lí tình huống phức tạp với đa ngôn ngữ, số ít, số nhiều, truyền biến, ...
Phần 16
Tìm hiểu về Server Side Rendering (SSR) và Client Side Rendering (CSR).
Nhập môn NextJs kết hợp với ReactJs.
Cách cài đặt dự án NextJs.
Tìm hiểu Data Fetching và Dynamic Routing trong NextJs.
Phần 17
Thực hành dự án thực tế với NextJs.
Cách cấu hình Redux kết hợp với NextJs.
Tích hợp mã nguồn ReactJs vào dự án với NextJs.
Chuyển đổi các lời gọi APIs ở phía Client về phía Server.
Tìm hiểu về Next Router.
Phần 18
Thực hành dự án thực tế với NextJs (P2)
Phần 19
Thực hành dự án thực tế với NextJs (P3)
Phần 20
Thực hành dự án thực tế với NextJs (P4)
VIDEO BỔ TRỢ
Video bổ trợ cho từng buổi học được ZendVN xây dựng vô cùng chi tiết gồm các kiến thức nâng cao, bài tập và các tình huống thực tế
Sản phẩm Demo
Các sản phẩm chính được hướng dẫn và các project cuối khóa được xây dựng bởi các bạn học viên tham gia khóa học.
VIDEO ONLINE ĐƯỢC TẶNG KÈM
Giúp học viên xem trước các video khi đến lớp, tận dụng tối đa thời gian trên lớp để thực hành, tương tác cùng giảng viên. Kiến thức video bao gồm tất cả nội dung như lộ trình học bên dưới.
317 Videos
53 Giờ
45 Phút
Phần 1
Phần 2
Xây dựng Project Todo List
Introduce và phân tích kiến thức
Xây dựng và tích hợp giao diện
Phân chia Component của ứng dụng
Hiển thị danh sách các Item
Form Toogle
Xây dựng chức năng Search, Sort, Delete, Add, Edit
Sử dụng localStorage
Tối ưu ứng dụng
Publish ứng dụng
React Hooks với Todo List
Phần 3
Sử dụng Redux với Project TodoList
Introduce và phân tích kiến thức
Xây dựng Tool Convert HTML to JSX
Sử dụng Redux
Hiển thị danh sách các Item với Redux
Form Toogle với Redux
Xây dựng chức năng Search, Sort, Delete, Add, Edit với Redux
React Hooks kết hợp với React Redux
Phần 4
Sử dụng Redux với Project Shopping Cart
Introduce và phân tích kiến thức
Xây dựng cấu trúc ứng dụng
Xây dựng chức năng hiển thị sản phẩm
Xây dựng chức năng Add, Delete, Update sản phẩm vào giỏ hàng
Redux các vấn đề nâng cao
Phần 5
Sử dụng React Router với Project Blog
Introduce và phân tích kiến thức
Sử dụng React Router
Xây dựng cấu trúc ứng dụng
Xây dựng Page và cấu hình Router
Xây dựng Menu và Custom Link
Xây dựng Page Login giới hạn vùng truy cập
Phần 6
Thao tác API với Project SpotifyAPI
Introduce và phân tích kiến thức
Phân tích yêu cầu và xác định giải pháp
Xây dựng cấu trúc ứng dụng
Spotify App và Access Token
Xây dựng trang tìm kiếm Artist, trang Artist, Album
Xây dựng Breadcrumb
Tình huống tự thực hành
Phần 7
Project Task Manager với Firebase
Introduce và phân tích kiến thức
Phân tích yêu cầu và xác định giải pháp
Tích hợp Firebase vào ứng dụng
Xây dựng Task Page - Task Doing
Xây dựng chức năng Notify
Xây dựng Task Page - Task Completed
Xây dựng Signup Page
Xây dựng Signin Page
Hoàn chỉnh các chức năng của ứng dụng
Phần 8
Khám phá NextJs
Giới thiệu NextJs
So sánh SSR, CSR và demo
Cài đặt và một số lưu ý
Tìm hiểu cấu trúc ứng dụng NextJs đầu tiên
Deploy ứng dụng NextJs đầu tiên
Phần 9
Tìm hiểu NextJs cơ bản
Cài đặt và tích hợp Typescript với NextJs và React
Tìm hiểu về khái niệm Pages trong NextJs
Tìm hiểu Dynamic Route
Tìm hiểu Routing Basic
Tìm hiểu Static File Serving và cách cài đặt
Custom lại Webpack và cách dùng File loader
Custom App Component và CSS Module Support
Custom App Component và Typescript
Phần 10
Life Cycle, React Hooks và ứng dụng
Ôn tập Life Cycle cơ bản trong Class Component
Cách sử dụng State Hooks và so sánh
Tìm hiểu về useEffect trong Hooks
Tìm hiểu về useMemo, useCallback, useRef
Tìm hiểu Custom Hooks và useConstructor
Demo ứng dụng Hooks trong tình huống thực tế
Solution 01, 02, 03, 04, 05, 06
Phần 11
Data Fetching và Server API
Khái niệm API là gì?
Postman Collection là gì và cách dùng
Khái niệm Fetch Data trong NextJs
Tìm hiểu getIntialProps trong NextJs
Tìm hiểu về getServerSideProps
Một số lưu ý về Typescript
Static generation và getStaticProps
Tìm hiểu getStaticPaths
Phần 12
Project thực tế (NextJs + React + Typescrpit)
Giới thiệu Project và các chức năng
Khởi tạo và thiết lập cấu trúc dự án
Tạo Master Layout cho ứng dụng
Xây dựng trang Home, Login và Register
Xây dựng trang Create
Xây dựng trang Detail
Xây dựng trang liên quan tới User
Phần 13
Nhóm chức năng Authentication
Thuật ngữ Authentication và Authorization
Tìm hiểu cơ chế Token Based Authentication
Thu thập dữ liệu từ Form Login
Gọi API Login phía Client
Custom API phía Server bằng NextJs
Gọi API Login phía Server
Các kỹ thuật với Cookie phía Client và Server
Kỹ thuật Redirect phía Client và Server
Xử lí Error cho chức năng Login phía Server
Lấy Token từ Custom App và Master Layout
Gọi API Get User Info dựa vào token
Cách sử dụng React Hooks Global State
Ứng dụng Hooks để xây dựng Navigation Guard
Tối ưu mã nguồn cho chức năng Login
Chức năng Logout và Optional Chaining
Thu thâp dữ liệu từ Form Register
Xử lí Error cho chức năng Register phía Client
Gọi API Register phía Client
Cải thiện UI/UX với Loading state
Phần 14
Nhóm chức năng User, Post và tối ưu SEO
Sử dụng Typescript trong Homepage
Gọi API lấy danh sách bài viết phía Server
Render dữ liệu Homepage và một số lưu ý
Chức năng Pagination (Load More Posts)
Xử lí Form cho chức năng Search Post
Gọi API Search Post và Masonry Layout
Highlight keywords cho chức năng tìm kiếm
Filter bài viết theo danh mục (Category)
Gọi API cho chức năng User Detail
Render dữ liệu User Detail
Chức năng thay đổi mật khẩu
Chức năng User Profile và kĩ thuật upload avatar
Loading và Route events trong NextJs
Phân tích chức năng Create Post
Xử lí CheckBox trong React
Xử lí Form Data cho chức năng Create Post
Gọi API cho chức năng Create Post, Post Detail
Render dữ liệu Post Detail và Post Categories
Gọi API cho chức năng List Comments
Render List Comments ra giao diện
Xây dựng chức năng Comment, Edit Post
Các kĩ thuật tối ưu SEO trong mã nguồn
CÂU HỎI THƯỜNG GẶP
Về nội dung: chương trình học lập trình 1 kèm 1 là nội dung học mới nhất tại thời điểm hiện tại (tương đương nội dung ZendVN đang giảng dạy lập trình offline tại Hồ Chí Minh). Ngoài ra, khóa 1 kèm 1 đã bao gồm nhiều khóa học online liên quan và video bài tập nâng cao, nên sẽ có lượng kiến thức nhiều hơn các khóa học online riêng lẻ
Về hình thức học: Nếu đăng ký gói Video & Review hoặc 1 kèm 1 thì bạn sẽ có sự hỗ trợ trực tiếp 24/7 qua group zalo riêng cùng 2 giảng viên, hỗ trợ teamview fix code, voice chat, video review code cho từng bài tập của bạn
Anh Lưu Trường Hải Lân và đội ngũ support của ZendVN sẽ đồng hành cùng bạn trong suốt khóa học này
Khóa học 1 kèm 1 có sự tương tác cao giữa Học viên và ZendVN qua hình thức: hỏi đáp trong group Zalo, teamview, video review code cho từng học viên. Do đó mỗi tháng ZendVN chỉ nhận tối đa 5 học viên, ZendVN sẽ ưu tiên cho các bạn học viên đăng ký và thanh toán học phí sớm.
Để đăng ký, bạn điền thông tin vào Form đăng ký tại trang này, sau đó check mail để xem hướng dẫn nộp học phí.
Các video của từng buổi học đã được ZendVN xây dựng sẵn, bạn hoàn toàn chủ động được thời gian học của mình, tốc độ học nhanh hay chậm là do bạn quyết định, bạn không cần học theo tốc độ của bất kỳ ai, hoàn toàn có thể kết thúc sớm khóa học.
Ngược lại nếu bạn học chậm, bạn cũng không cần lo lắng, ZendVN sẽ đồng hành cùng bạn đến khi bạn hoàn tất khóa học, tuy nhiên thời gian học không kéo dài quá 12 tháng kể từ thời điểm bạn bắt đầu học
Sau khi hoàn tất khóa học và báo cáo project cuối khóa, bạn sẽ được ZendVN cấp giấy xác nhận hoàn thành khóa học, giấy do Công ty Lập trình Zend Việt Nam cấp
Khóa học được kéo dài tối đa là 12 tháng kể từ thời điểm bạn bắt đầu học. Nếu đang trong quá trình học, bạn gặp một vấn đề gì đó không thể tiếp tục tham gia khóa học, ZendVN sẽ bảo lưu khóa học cho bạn trong thời gian tối đa 6 tháng.
CẢM NHẬN CỦA HỌC VIÊN VỀ KHÓA HỌC
ĐĂNG KÝ
Do giới hạn số lượng học viên chỉ 5 bạn / 1 tháng, để hoàn tất đăng ký giữ chỗ các bạn vui lòng đăng ký và hoàn thiện học phí sớm
Hỗ trợ sau khóa học
Sau khi hoàn thành khóa học, học viên sẽ được ZendVN cấp giấy xác nhận hoàn thành khóa học, xác nhận thực tập, hỗ trợ viết CV, kết nối doanh nghiệp và tham gia câu lạc bộ học viên đang đi làm
Xác nhận hoàn thành khóa học
Học viên tham gia trên 80% số buổi học có thành tích học tập tốt, sẽ được cấp giấy chứng nhận hoàn thành khóa học do công ty Lập trình Zend Việt Nam cấp
Xác nhận thực tập doanh nghiệp
Học viên tham gia xây dựng project cuối khóa, chuyên cần trong học tập sẽ được cấp giấy xác nhận thực tập tại công ty Lập trình Zend Việt Nam
CV & Việc làm
Hỗ trợ học viên xây dựng CV, chia sẻ kinh nghiệm phỏng vấn, kết nối việc làm với doanh nghiệp, tham gia câu lạc bộ học viên đã đi làm
Lộ trình các khóa học
Dựa vào kinh nghiệm hơn 15 năm đào tạo lập trình viên, ZendVN đã sắp xếp lộ trình học theo từng hướng nghề nghiệp khác nhau để các bạn học tập hiệu quả nhất (frontend, backend php, backend nodejs, backend java, lập trình di động, ...)
Tư vấn khóa học
Bạn sẽ được tư vấn trực tiếp từ anh Hải Lân về việc chọn khóa học và lộ trình phù hợp với mình nhất
0905 744 470Liên hệ ZaloLiên hệ Facebook
GIỚI THIỆU
Công Ty Cổ Phần Lập Trình Zend Việt Nam - Mã số thuế: 0314390745
Văn phòng: Tầng 5, Tòa nhà Songdo, 62A Phạm Ngọc Thạch, Phường Võ Thị Sáu, Quận 3, Thành phố Hồ Chí Minh
Địa điểm học: Số 01, Khối A1, Toà nhà Đạt Gia, 43 Đường Cây Keo, Tam Phú, Thủ Đức, Hồ Chí Minh
Giấy phép đăng ký kinh doanh số 0314390745 do Sở Kế hoạch và Đầu tư Thành phố Hồ Chí Minh cấp ngày 09/05/2017