Bài viết được sự cho phép của tác giả Kien Dang Chung
Video trong bài viết
Sau 16 bài học, hôm nay cũng là bài cuối cùng, chúng ta sẽ hoàn thiện những tính năng cuối cùng của ứng dụng Todo List cơ bản. Các công việc đã có thể được tạo ra, cập nhật và xóa khỏi ứng dụng. Tuy nhiên chúng ta chưa có tính năng đánh dấu những công việc nào đã hoàn thành.
Xử lý trạng thái công việc trong Todo List
Trong thiết kế ở bài số 5, bảng todos có trường completed có kiểu dữ liệu Boolean dùng để đánh dấu từng công việc xem đã hoàn thành hay chưa.
Bước 1: Thêm nút Complete vào từng Todo
Trong trang danh sách các công việc /todos, ở mỗi công việc đã có một nút View để xem chi tiết công việc, chúng ta thêm vào một nút Complete để sử dụng chuyển trạng thái khi công việc đã hoàn thành.
Mở view resouces/views/todos/index.blade.php và thêm vào nút Complete:
@extends('layouts.app')
@section('title')
Todos List
@endsection
@section('content')
<h1 class="text-center my-5">TODOS PAGE</h1>
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card card-default">
<div class="card-header">
Todos
</div>
<div class="card-body">
<ul class="list-group">
@foreach($todos as $todo)
<li class="list-group-item">
{{ $todo->name }}
@if(!$todo->completed)
<a href="/todos/{{ $todo->id }}/complete" style="color: white;" class="btn btn-warning btn-sm float-right">Complete</a>
@endif
<a href="/todos/{{ $todo->id }}" class="btn btn-primary btn-sm float-right mr-2">View</a>
</li>
@endforeach
</ul>
</div>
</div>
</div>
</div>
@endsectionCùng thảo luận chút về đoạn code hiển thị nút Complete:
@if(!$todo->completed)
<a href="/todos/{{ $todo->id }}/complete" style="color: white;" class="btn btn-warning btn-sm float-right">Complete</a>
@endifKiểm tra xem một công việc nếu chưa hoàn thành sẽ hiển thị một nút Complete cho công việc đó, khi nhấp vào nó sẽ thực hiện đường dẫn /todos/{todo}/complete. Quay lại với quy trình 3 bước, bạn nhớ chứ.
Bước 2: Đăng ký đường dẫn
Mở file routes/web.php và đăng ký đường dẫn này:
Route::get('todos/{todo}/complete', 'TodosController@complete');Đường dẫn này sẽ được thực thi bởi phương thức complete() trong TodosController.
Bước 3: Xử lý nghiệp vụ trong Controller
Phương thức complete() hiện chưa tồn tại, mở controller ra và thêm phương thức này vào (app/Http/Controllers/TodosController.php):
public function complete(Todo $todo)
{
$todo->completed = true;
$todo->save();
session()->flash('success', 'Todo completed successfully.');
return redirect('/todos');
}Nhắc lại một chút, trong phương thức complete() chúng ta có sử dụng Route Model Binding để truyền Model vào Route tự động và chúng ta cũng sử dụng Laravel Session để lưu thông tin hiển thị thông báo về trạng thái khi chuyển trạng thái của Todo.
Bước 4: Hoàn thành công việc
Sau khi đã chuyển trạng thái, chúng ta chỉ thực hiện chuyển hướng người dùng về trang danh sách /todos, như vậy là kết thúc một chu kỳ yêu cầu từ phía người dùng.
public function complete(Todo $todo)
{
...
return redirect('/todos');
}
Source code: Bài 17 – Hoàn thiện ứng dụng Todo List
Tóm lược khóa học Laravel cơ bản
Khóa học Laravel cơ bản cùng với dự án nhỏ ứng dụng quản lý công việc Todo List đã hoàn thành. Đây là một ứng dụng nhỏ nhưng qua đó chúng ta đã nắm bắt được các khái niệm cơ bản trong Laravel:
- Cài đặt và thiết lập môi trường phát triển Laravel.
- Làm quen với mô hình MVC thực tế và mô hình MVC được áp dụng trong Laravel thông qua các khái niệm về Route, View, Controller, Model.
- Làm việc với database với khá nhiều các khái niệm mới như Migration, Factory, Seeder.
- Nắm bắt được cách thức xây dựng ứng dụng với các file bố cục (layout) và Laravel Blade.
- Thực hiện một chuỗi các hành động CRUD (Create, Read, Update và Delete) với một đối tượng.
Với những kiến thức nền tảng này, bạn có thể tìm hiểu các vấn đề khác trong Laravel và cũng có thể bắt tay xây dựng những ứng dụng web đơn giản khác.
Xem thêm tuyển dụng PHP Laravel lương cao trên TopDev
Mở rộng ứng dụng Todo List
Khóa học đã kết thúc, tuy nhiên để ứng dụng Todo List có thể sử dụng được trong thực tế chúng ta cần thêm một vài tính năng cho nó.
- Tính năng người dùng:
- Chúng ta muốn rằng ứng dụng Todo List này có thể được sử dụng bởi nhiều người dùng khác nhau, do đó cần thêm tính năng về người dùng vào ứng dụng. Mỗi công việc có thể ở dạng public hoặc private để người khác có thể xem hoặc không xem được.
- Công việc có thể chung cho từng nhóm người dùng.
- Mở rộng cho từng Todo:
- Thêm phần đính kèm, một công việc có thể đính kèm các tài liệu dạng văn bản, file nén, hình ảnh, video…
- Thay vì trạng thái chưa hoàn thành và hoàn thành, chúng ta thêm vào đánh giá phần trăm hoàn thành.
- Phân loại công việc theo mức độ như thông thường, khẩn cấp…
- Xóa Todo: chúng ta sử dụng soft delete thay vì xóa hẳn bản ghi khỏi database.
- Thời gian hoàn thành dự kiến
- Thông báo
- Thông báo đến người dùng các công việc quá hạn.
- Cho phép đặt lịch hiển thị các nhắc nhở công việc chung của nhóm người dùng…
Với các tính năng mở rộng trên, ứng dụng Todo list đã có thể đưa lên Internet và sử dụng cho nhiều người khác nhau. Bạn hãy bắt tay vào xây dựng và cùng thảo luận những khó khăn trong phần bình luận nhé. Phần mở rộng ứng dụng Todo List này sẽ tiếp tục trong phần Bonus của Khóa học, các bài viết sẽ sớm public khi hoàn thành.
Chúc các bạn có những bài học hiệu quả, nhớ ủng hộ website thông qua nhấp quảng cáo và subcribe kênh youtube Allaravel nhé!
Bài viết gốc được đăng tải tại allaravel.com
Có thể bạn quan tâm:
- Todo List: Liên kết Route và Model tự động trong Laravel
- Bỏ túi Cheatsheet React cho năm 2022 (kèm ví dụ thực tế)
- Vue.js là gì?
Xem thêm các việc làm công nghệ hấp dẫn trên TopDev
Testing là một chức năng quan trọng mà bất kì ngôn ngữ nào cũng cần phải có, viết unit test cũng là một việc mà bất kì lập trình viên nào cũng cần phải làm, thậm chí với một vài cộng đồng như Golang và Ruby thì người ta bảo thủ tới mức xem việc publish một project không có unit test giống như là một cái tội luôn vậy đó :))
https://www.facebook.com/groups/HRDVietnam/
Hầu hết các phần mềm đọc sách như iBook hay Amazon Cloud Reader có khả năng đồng bộ tiến trình đọc của bạn qua nhiều thiết bị giúp cho việc chuyển đổi giữa các thiết bị dễ dàng hơn, bạn có thể đọc liên tục mà không gặp trở ngại gì.
Tuỳ thuộc vào mục đích của loại sách mà chúng ta đang muốn đọc, không phải bất cứ quyển sách nào cũng đáng để đọc ngấu nghiến, có những quyển sách chúng ta chỉ nên lướt qua một lần hoặc là bỏ hẳn không nên đọc nữa, hoặc những cuốn sách chúng ta ít quan tâm hơn nhưng vẫn biết nó hữu dụng. Cách tốt nhất là phân loại nó thành các thể loại sách để đọc theo 2 mức độ (trong bài gốc có 3 mức độ nhưng mức độ 3 mình không nghĩ là nó thích hợp):
Đây chính là Swagger API documentation đó các bạn! Sử dụng nó, các bạn sẽ biết ứng dụng của chúng ta có bao nhiêu request URL được expose. Thông tin của mỗi request URL như thế nào, và chúng ta có thể sử dụng Swagger API documentation này để gọi đến các request URL thực tế luôn.