Cách triển khai đăng nhập và đăng ký trong Laravel 10 Vue 3

Trong hướng dẫn này, bạn sẽ tìm hiểu cách tạo thông tin đăng nhập, đăng ký, đăng xuất, quên mật khẩu, hồ sơ và đặt lại mật khẩu bằng cách sử dụng giàn giáo laravel 10 vue js ui auth. Để thực hiện đăng nhập và đăng ký trong Laravel 10 Vue 3, hãy làm theo các bước sau

Mục lục

  • Bước 1: Tạo dự án Laravel 10 mới
  • Bước 2: Thiết lập cơ sở dữ liệu
  • Bước 3: Cài đặt giao diện người dùng Laravel
  • Bước 4: Thiết lập giàn giáo xác thực Vue Js
  • Bước 5: Cài đặt gói NPM
  • Bước 6: Chạy máy chủ phát triển 
     

Bước 1: Tạo dự án Laravel 10 mới

Trước hết, hãy mở cmd hoặc terminal của bạn và điều hướng đến thư mục máy chủ web cục bộ của bạn bằng cách sử dụng lệnh sau:

//for windows user
cd xampp/htdocs

//for ubuntu user
cd var/www/html

Tiếp theo, chạy lệnh sau trên cmd để cài đặt ứng dụng laravel mới nhất:

composer create-project --prefer-dist laravel/laravel LaravelVuejsAuth

Bước 2: Thiết lập cơ sở dữ liệu

Khi bạn đã cài đặt Laravel trên máy chủ của mình. Tiếp theo, bạn cần thiết lập cơ sở dữ liệu với dự án Laravel. Vì vậy, hãy mở ứng dụng Laravel đã tải xuống của bạn trong bất kỳ trình soạn thảo văn bản nào và tìm tệp .env và thiết lập cơ sở dữ liệu như:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=db name
DB_USERNAME=db user name
DB_PASSWORD=db password

Bước 3: Cài đặt giao diện người dùng Laravel

Tiếp theo chạy lệnh sau trên cmd để cài đặt gói ui LARAVEL:

composer require laravel/ui

Bước 4: Thiết lập giàn giáo Vue Auth

Khi bạn đã cài đặt laravel ui, bây giờ bạn cần chạy lệnh sau trên cmd để cài đặt gói vue giàn giáo xác thực trong laravel:

php artisan ui vue --auth

Bước 5: Cài đặt gói NPM

Tiếp theo, mở lại cmd và chạy lệnh sau vào đó để cài đặt nút js:

npm install

Sau đó gõ lệnh sau vào cmd để chạy npm:

npm run dev

Và chạy lệnh sau trên cmd để tạo bảng cơ sở dữ liệu:

php artisan migrate

Bước 6: Chạy máy chủ phát triển

Cuối cùng, chạy lệnh sau trên cmd để khởi động máy chủ phát triển:

php artisan serve

Mở trình duyệt web và nhấn vào url sau trên đó:

http://127.0.0.1:8000/

Trong hướng dẫn này, bạn đã học cách tạo thông tin đăng nhập, đăng ký, đăng xuất, quên mật khẩu, hồ sơ và đặt lại mật khẩu trong laravel 10 bằng cách sử dụng giàn giáo vue js ui auth.

1.30 GEEK