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)
Loading...
Nội dung chính trong khóa học
Đâ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.
Cam kết trong khóa học
- Giới hạn chỉ 8 học viên / 1 lớp, cầm tay chỉ việc từng học viên, đảm bảo học viên được kèm cặp sát và nắm kiến thức tại mỗi buổi học
- Hạn chế học lý thuyết, tăng thực hành thực tế: Học viên được cấp các video để học lý thuyết khi ở nhà, vào lớp học viên sẽ làm các bài tập thực tế và mở rộng
- Học viên được hướng dẫn cách tư duy giải quyết bài toán, đọc nghiên cứu tài liệu, tìm kiếm trên Google
- Học viên được trang bị kiến thức đủ để đi làm, kiếm tiền.
- Học viên được giới thiệu việc làm nếu có nhu cầu
LỘ TRÌNH HỌC
ZendVN liệt kê chi tiết lộ trình học và kết quả học trong 20 buổi
Buổi 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.
Buổi 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.
Buổi 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.
Buổi 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.
Buổi 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ế.
Buổi 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.
Buổi 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.
Buổi 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.
Buổi 9
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.
Buổi 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.
Buổi 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.
Buổi 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.
Buổi 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.
Buổi 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.
Buổi 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, ...
Buổi 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.
Buổi 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.
Buổi 18
Thực hành dự án thực tế với NextJs (P2)
Buổi 19
Thực hành dự án thực tế với NextJs (P3)
Buổi 20
Thực hành dự án thực tế với NextJs (P4)
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.
ĐIỂM KHÁC BIỆT
Điểm khác biệt và lợi ích khi tham gia khóa học Offline tại ZendVN.com
Hỗ trợ hệ thống học Online
Học viên được cấp tài khoản để học video lý thuyết ở nhà, trên lớp thực hành, học các kiến thức nâng cao và làm các bài tập mở rộng
Cầm tay chỉ việc
10 học viên / lớp, đảm bảo học viên được kèm cặp sát và nắm kiến thức ngay tại mỗi buổi học. Học viên được review code và hướng dẫn tối ưu code
Hỗ trợ 24/7
Ngoài hỗ trợ trực tiếp ở lớp học, học viên được hỗ trợ từ Giảng Viên ngay tại group Zalo của lớp trong suốt chương trình học
Project và thực hành thực tế
Học viên được hướng dẫn xây dựng các chức năng thực tế trong từng buổi học, không học lý thuyết suông, có sản phẩm của chính mình
Hỗ trợ học lại miễn phí
Học viên tham gia trên 80% số buổi nhưng cảm thấy chưa tự tin, chưa vững về kiến thức sẽ được học lại miễn phí vào khóa học kế
Hỗ trợ học phí
ZendVN hỗ trợ rất nhiều hình thức ưu đãi học phí cho học sinh sinh viên, học viên cũ và các bạn đăng ký nhóm
Chia sẻ cuối khóa học
Buổi tổng kết khóa học (cafe, tiệc nhẹ) để giảng viên và học viên có những chia sẻ, định hướng nghề nghiệp cùng nhau
Cộng đồng học viên
Học viên được tham gia nhóm cộng đồng học viên Offline tại ZendVN, nơi kết nối và chia sẻ kiến thức, việc làm, tuyển dụng
CẢM NHẬN CỦA HỌC VIÊN VỀ KHÓA HỌC
VIDEO ONLINE ĐƯỢC TẶNG KÈM
Giúp học viên học trước kiến thức lý thuyết trước mỗi buổi học, 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.
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
ĐĂNG KÝ
Do giới hạn số lượng học viên chỉ 8 bạn / 1 lớp, để hoàn tất đăng ký giữ chỗ các bạn vui lòng hoàn thiện 2 bước hướng dẫn bên dưới
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
ĐỊA CHỈ HỌC
Số 01, Khối A1, Tòa nhà Đạt Gia, 43 Đường Cây Keo, Tam Phú, Thủ Đức, Hồ Chí Minh
Địa chỉ học xa bạn quá?!
Bạn đừng lo lắng nhé, ZendVN đã xây dựng chương trình học online từ xa cùng giảng viên cho các bạn ở xa rồi nè! Nội dung học giống 100% nội dung học của lớp học offline, ngoài ra bạn sẽ có group hỗ trợ riêng cùng 2 giảng viên và video nhận xét bài tập riêng cho bạn. Bạn tham khảo khóa học ở đây nha
HÌNH ẢNH LỚP HỌC
Trong suốt quá trình học tại lớp, giảng viên và học viên sẽ cùng thảo luận, phân tích, thực hành các tình huống và bài tập thực tế
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, ...)
Quy trình đăng ký khóa học
Quy trình đăng ký khóa học lập trình tại ZendVN
Tìm hiểu
Đăng ký
Thanh toán
Xem video
Đến lớp
Tìm hiểu
Đăng ký
Thanh toán
Xem video
Đến lớp
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
0383308983Liê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