Lập Kế Hoạch Các Tính Năng Cần Triển Khai

Trước khi bắt đầu triển khai, việc đầu tiên là sắp xếp các tác vụ từ danh sách công việc cần làm (to do) sang trạng thái đang làm (doing). Sau khi hoàn thành bước sắp xếp, chúng ta có thể bắt đầu thực hiện.

Khởi Tạo Dự Án Với Laravel 11

Hiện tại, phiên bản mới nhất của Laravel là 11 và PHP là 8.3. Do đó, mình sẽ sử dụng cả hai phiên bản này cho dự án của mình. Để tiến hành khởi tạo dự án, mình sẽ sử dụng cơ sở dữ liệu SQLite trước. Nếu gặp phải vấn đề, mình có thể nâng cấp lên MySQL sau. Khởi tạo dự án với câu lệnh: composer create-project laravel/laravel learn-easy.

Sau khi hoàn tất khởi tạo, mình sẽ thiết lập git và đẩy dự án lên GitHub. Để giúp mọi người hiểu rõ hơn, git là phần mềm quản lý phiên bản cho mã nguồn ở local, trong khi GitHub cung cấp giao diện để sử dụng git dễ dàng hơn và lưu trữ mã nguồn trên internet. Điều này có nghĩa là bạn có thể sử dụng git ngay cả khi không có mạng, nhưng cần có mạng để truy cập GitHub.

Tiếp theo, mình sẽ khởi tạo git flow, một công cụ CLI hữu ích giúp quản lý quy trình làm việc với git dễ dàng hơn. Mình sẽ tạo hai nhánh: main và develop. Các tính năng mới sẽ được phát triển dựa trên nhánh develop. Sau khi hoàn thành, mình sẽ merge các tính năng này vào nhánh develop và sau đó vào nhánh main khi sẵn sàng triển khai.

Cài Đặt Laravel Breeze

Để triển khai các tính năng như đăng nhập, đăng ký, chỉnh sửa hồ sơ và quên mật khẩu cho người dùng, chúng ta chỉ cần cài đặt Laravel Breeze. Để thực hiện việc này, bạn sử dụng lệnh: composer require laravel/breeze --dev. Sau đó, chạy lệnh php artisan breeze:install để bắt đầu cài đặt. Trong quá trình cài đặt, bạn sẽ có nhiều tùy chọn: Blade với Alpine, Livewire, Inertia.js, hoặc sử dụng API.

Nếu bạn đã có kiến thức về Blade, mình khuyên nên sử dụng Blade với Alpine. Nếu bạn muốn học về Livewire hay Inertia.js, hãy chọn tùy chọn tương ứng. Mình muốn học Inertia.js, vì vậy mình sẽ chọn Inertia.js với React.

Tiếp theo, mình chọn dark mode cùng với TypeScript. Mặc dù không cần thiết phải sử dụng dark mode ngay lập tức, việc có nó từ đầu sẽ giúp tiết kiệm thời gian cho việc viết mã sau này. Cuối cùng, mình sẽ chọn Pest cho việc kiểm thử, bởi mình muốn học công cụ mới này.

Chạy Chương Trình

Khi sử dụng Inertia.js, mình cần chạy đồng thời hai lệnh: php artisan serve và yarn run dev. Truy cập vào địa chỉ localhost:8000, bạn sẽ thấy hai liên kết Log in và Register trên trang chủ. Nhấn vào các liên kết này để kiểm tra chức năng đăng nhập, đăng ký và quên mật khẩu. Công việc còn lại là thay đổi logo cho ứng dụng.

Thay Đổi Logo

Thay vì tìm kiếm logo trên internet, mình sẽ sử dụng AI để tạo logo. Mình sẽ truy cập trang Copilot và yêu cầu ‘Generate logo for learning in square’. Sau đó, mình chọn logo phù hợp và chuyển đổi nó thành favicon, sau đó sao chép vào thư mục public. Chỉ cần thêm đường dẫn của favicon vào phần head của file app.blade.php. Cũng như vậy, bạn chỉ cần thay đổi đường dẫn trong component ApplicationLogo.tsx để cập nhật logo. Như vậy, mình đã hoàn thành bước khởi tạo và triển khai các tính năng cho người dùng. Cuối cùng, mình sẽ di chuyển các tác vụ đã hoàn thành từ trạng thái doing sang done.
source: viblo