Thiết kế giao diện Web đơn giản với PHP

Mặc dù các CMS mã nguồn mở như WordPress, Joomla,… đã trở nên phát triển và giúp việc xây dựng website trở nên chuyên nghiệp hơn. Tuy nhiên vai trò của việc lập trình thuần vẫn rất quan trọng. Khi mã nguồn có nhiều người dùng thì cấu trúc của nó cũng có thể nhiều người biết đến khiến tính bảo mật website trở nên kém hơn. Đó là lý do mà rất ít các trang báo lớn hay các trang thương mại lớn họ không sử dụng CMS. Trong bài viết này mình sẽ chia sẻ với bạn cách viết một trang web bằng ngôn ngữ PHP. 

Tạo database và cấu trúc folder

Trong hướng dẫn này mình chỉ hướng dẫn tạo ra một trang web đơn giản. Vì thế nên CSDL mình sẽ tạo ra 3 bảng đơn giản như sau:

Bảng user: lưu trữ thông tin đăng nhập của người dùng

• Với bảng trên mình sẽ tạo ra 4 trường lần lượt là:
  • id_user: có kiểu int, thuộc tính tự tăng AUTO_INC...và nó là trường khóa chính.
  • username: sẽ lưu tài khoản đăng nhập của người dùng. Mình để đại kiểu text, bạn có thể để kiểu varchar vì nó thường không chứa dấu và ký tự giới hạn.
  • pass: thì dùng để lưu mật khẩu và mình cũng để tương tự trường username.
  • name: trường để lưu tên của user.

Bảng category: Lưu trữ các danh mục của bài viết

• Mình sẽ tạo 4 trường cho bảng này như sau:
  • id_cat: có kiểu int, thuộc tính tự tăng AUTO_INC...và nó là trường khóa chính.
  • name_cat: lưu tên của danh mục, có kiểu text.
  • slug_cat: lưu lại tên không dấu, không khoảng cách của danh mục để làm đường dẫn thân thiện sau này.
  • status: đánh dấu trạng thái của danh mục, dùng kiểu tinyint.

Bảng post: Lưu các thông tin về một bài đăng.

• Các trường của bảng này như sau:
  • id_post: có kiểu int, thuộc tính tự tăng AUTO_INC...và nó là trường khóa chính.
  • id_cat: id của danh mục. Thật ra thiết kế như thế này chưa hoàn toàn đúng, vì một bài đăng có thể ở trong nhiều danh mục, nên quan hệ của nó là N-N tuy nhiên ở đây mình chỉ thiết kết cơ bản kiểu 1 bài đăng chỉ có 1 danh mục thôi.
  • id_user: id của user tạo bài post.
  • title: tiêu đề của bài post
  • description: mô tả của bài post
  • content: nội dung của bài post
  • slug_post: tương tự slug_cat.
  • status: trạng thái của bài post
  • date: ngày đăng bài post.
  • Mình bổ sung thêm một trường là thubnail nhé, để lưu đường dẫn hình ảnh đại diện. Mình quên mất.

Như vậy mình đã có Database rồi. Các bảng này mình thiết kế đơn giản, không theo chuẩn và mình cũng không phân tích kỹ. Nếu các bạn làm một dự án nghiêm túc mình khuyên các bạn nên bỏ thời gian để nghiên cứu kỹ về CSDL vì nó ảnh hưởng rất nhiều sau này. Và bây giờ chúng ta sẽ tiến hành xây dựng cấu trúc folder cho website.

• Cấu trúc này thường không giống với những gì bạn đã học ở trường vì ở đây mình muốn mọi Request của người dùng chỉ thông qua một file duy nhất là index.php. Điều này cũng thông dụng với hầu hết các CMS hiện nay.
• Mục admin tạm thời chưa quan tâm, bạn cứ xem nó như một website khác đi. Mục public là mục mình sẽ chứa toàn bộ các file như css, js, img,… nói chung là những file mà người dùng có thể truy cập trực tiếp. Mục site sẽ chứa những file xử lý như các action, database, widget,…..
• Các mũi tên màu đỏ chỉ các yêu cầu của người dùng. Khi họ đưa ra một yêu cầu đến 1 action nào đó nó sẽ gọi đến các widget để hoàn thành giao diện và trả lại cho file index hiển thị (đường màu xanh).

Tạo các action trong PHP

Đầu tiên mình cần lấy biến action trong file index. Bạn mở file index và code như sau:

biến này được lấy ở đâu?, chính là trên URL của browser. Bạn thử gõ vào đường dẫn: http://localhost/hocphp/?action=post. Sau đó thêm đoạn echo trong file index.php như sau:

Đầu tiên mình sẽ tạo ra một biến $path để lưu đường dẫn đến cái file action cần xử lý. Sau đó thì mình sẽ kiểm tra xem file đó có tồn tại hay không. Và mình sẽ sử dụng hàm require để require file đó vào. Cũng với đường dẫn http://localhost/hocphp/?action=post bạn mở file post.php trong thư mục action và thêm vào dòng bất kỳ, F5 lại bạn sẽ thấy kết quả.

Tương tự như vậy, nếu gọi ?action=cat thì nó sẽ gọi vào file cat.php. Và nếu không có biến action thì mặc định nó sẽ require action home. Bạn có thể thêm một file 404.php trong action để thay thế cho cái echo nếu action tìm là không thấy.