Video

Trong hướng dẫn tính năng của dự án vue js 3 này, chúng ta sẽ thực hành với cái kiến thức như gọi api và xác thực dữ liệu trong db trong vue js 3. - Tạo form login - Xử lý logic login với dữ liệu gọi từ api

Trong hướng dẫn tính năng của dự án vue js 3 này, chúng ta sẽ thực hành với cái kiến thức như validate dữ liệu trong vue js 3. - Validate dữ liệu trong form nếu người dùng không nhập gì - Validate đúng định dạng dữ liệu email

Trong hướng dẫn tính năng của dự án vue js 3 này, chúng ta sẽ thực hành với cái kiến thức như sweetalert2, Redirect trang trong vue js 3. - Cài đặt thư viện sweetalert2 - Show alert thông báo thành công nếu đăng ký user thành công - Redirect đến màn hình home

Trong hướng dẫn tính năng của dự án vue js 3 này, chúng ta sẽ thực hành với cái kiến thức như json-sever, axios trong vue js 3. - Cài đặt thư viện api json-sever - Sử dụng axios để kết nối api và đăng ký dữ liệu vào db

Trong hướng dẫn tính năng của dự án vue js 3 này, chúng ta sẽ thực hành với cái kiến thức như vue-router, json-sever, axios trong vue js 3. - Xóa các code và component có sẵn không cần thiết - Tạo 2 component SignUp & Home - Cài đặt thư viện vue-router - Tạo form đăng ký với html & css

Nội dung trong video Yêu cầu:Cài đặt Nodejs Tiếp theo chạy các lệnh bên dưới trong powershell để hoàn thành cài đặt: npm create vue@latest cd your-project-name npm install npm run dev

Giả sử bạn đang xây dựng một Ứng dụng quản lý người dùng và bài viết đơn giản. Dưới đây là các chức năng cụ thể mình sẽ triển khai trong ứng dụng Demo này: 1.Xác Thực Người Dùng: Đăng ký, đăng nhập, và đăng xuất. 2.Quản Lý Người Dùng: Hồ sơ cá nhân, cập nhật thông tin người dùng. 3.Quản Lý Bài Viết: Tạo, xem chi tiết, cập nhật, xóa bài viết của user đang login. Hiển thị danh sách bài viết của u...

Nội dung video - Ví dụ cập nhật dữ liệu từ api - Ví dụ xóa dữ liệu từ api

Nội dung video - Cài đặt server api với json-server() (Sau khi cài đặt json-server thành công, chúng ta có thể thao tác lấy, thêm mới, câp nhật, xóa dữ liệu thông qua api từ server api này) - Giới thiệu một số url api - Cài đặt thư viện axios - Trong Vue.js 3, Axios thường được sử dụng để gọi API và lấy dữ liệu từ server. - npm install axios - Ví dụ lấy dữ liệu từ api - Ví dụ thêm mới dữ liệu t...

Nội dụng video - Watchers trong Vue.js 3 giúp bạn quản lý các thay đổi dữ liệu một cách linh hoạt và mạnh mẽ, giúp ứng dụng của bạn phản ứng nhanh và chính xác với các tương tác của người dùng - Ví dụ bạn có thể sử dụng watcher để ghi lại hoặc theo dõi lịch sử thay đổi của dữ liệu

Nội dung video - Teleport component được sử dụng để hiển thị 1 phần template của component vào 1 vị trí khác trong cấu trúc DOM - Nó thường được sử dụng với những thứ như modals,tooltips..

Nội dụng video Dynamic Component cho phép giao diện chuyển đổi linh hoạt giữa các components khác nhau Dựa trên tương tác của người dùng, thể hiện sức mạnh và tính linh hoạt của các components động trong Vue.js 3

Nội dụng video - Sử dụng slots trong Vue.js 3 cho phép bạn tạo các component linh hoạt và tái sử dụng bằng cách chèn nội dung tùy chỉnh từ component cha vào component con - Slots giúp bạn tách biệt cấu trúc và nội dung của component, làm cho mã dễ quản lý và bảo trì hơn

Nội dụng video - Watchers trong Vue.js 3 giúp bạn quản lý các thay đổi dữ liệu một cách linh hoạt và mạnh mẽ, giúp ứng dụng của bạn phản ứng nhanh và chính xác với các tương tác của người dùng - Ví dụ bạn có thể sử dụng watcher để ghi lại hoặc theo dõi lịch sử thay đổi của dữ liệu

Vue JS 3 #18 Sử dụng thuộc tính Computed

Vue JS 3 #17 Validate Submit Form

Vue JS 3 #16 Submit Form

Vue JS 3 #15 Sử dụng ref để truy cập phần tử DOM

Vue JS 3 #14 Truyền dữ liệu từ component con đến cha

Vue JS 3 # 13 Class binding vs style binding

Vue JS 3 #12 HTML tag binding

Vue JS 3 #11 Tái sử dụng Component

Vue JS 3 #10 Truyền dữ liệu component cha đến con

Vue JS 3 #9 Sử dụng For Loop

Vue JS 3 #8 Sử dụng if else

Vue JS 3 #7 Sử dụng Two way binding

Vue JS 3 #6 Sử Dụng Event Click

Vue JS 3 #5 Sử Dụng Interpolation và Data

Vue JS 3 #4 Tạo component đầu tiên