Pages

Thứ Năm, 19 tháng 6, 2014

Hướng dẫn sử dụng template enginer Smarty cho người mới bắt đầu

Tình hình thấy nhiều bạn thích học PHP, mình cũng là newbie thoi, mình mở topic này chia sẻ những gì mình biết cho các bạn yêu thích biết hướng đi, nên bắt đầu từ đâu trong việc sử dụng template enginer Smarty
- Vậy template enginer Smarty là gì, tại sao phải sử dụng template Smarty trong lập trình PHP?

Thông thường khi lập trình PHP bạn thường hay viết lẫn cả phần HTML với mã lệnh PHP trên một trang. Điều này sẽ dẫn đến rất rối nhất là khi bảo trì. Hoặc là 1 ngày đẹp trời khách hàng của bạn không thích giao diện của website hiện tại, họ đòi hỏi phải thay giao diện khác. Bạn là người viết ra và cũng là người bảo trì thì không sao nhưng nếu bạn viết ra sau đó người khác bảo trì, việc đọc lại source code là 1 điều hết sức khó khăn. Hơn nữa, việc chỉnh sửa template theo cách viết thông thường rất mất thời gian.


[color=#5F5F5F]Vậy làm sao để giải quyết vấn đề trên: làm thế nào để độc lập mã PHP và mã HTML trên 1 website hay nói cách khác làm sao để tách biệt được việc thiết kế và lập trình website? Một website ra đời là sự kết hợp giữa thiết kế đồ họa và lập trình, làm sao để việc thiết kế không ảnh hưởng đến lập trình hay nói cách khác khi tạo ra 1 giao diện mới thì người lập trình không phải thay đổi phần chức năng bên lập trình PHP của mình


Vì lí nhiều do này nhiều template ra đời như Smarty, PHP Savant, PHPlib, Yats, FastTemplate,... trong đó nổi bật nhất là Smarty và PHP Savant.


Tại sao ta lại chọn template enginer Smarty?
- Thứ nhất vì nó dễ sử dụng, dung lượng nhẹ
- Hộ trợ cache giúp tải trang nhanh hơn
- Được hỗ trợ tài liệu dễ đọc
- Được xây dựng trên kiến trúc 3 tầng
  • Presentation Logic Layer : Nơi đặt bố cục Website , trình diễn dữ liệu được lấy ra từ Business Logic Layer:
    +CSS
    +Image
    +JavaScript
    +XML
    +RSS
  • Business Logic Layer : Các Nghiệp Vụ trên hệ Thống
  • Data Access Layer : Các Class tương tác với Database
    Presentation Logic Layer <=> Business Logic Layer <=> Data Access Layer
- Hỗ trợ các hàm cho hệ thống riêng trong template
- Cung cấp trình debug console
- Plugins: cung cấp cho việc sử dụng lại code
- Filters, Smarty Internals,...


Chúng ta bắt đầu làm cài đặt và làm 1 ví dụ đơn giản nhé!

Bước 1: bạn download library Smarty từ địa chỉ: http://www.smarty.net/download Hiện tại version mới nhất là 3.0.6
Sau khi download bạn giải nén

İmage


Bước 2: Tạo các thư mục cho project

- Bạn tạo 4 thư mục: templates, templates_c, cache, includes trong www/myWebsite/
- Tạo thư mục template: www/myWebsite/templates/default/ chứa giao diện
- Bạn copy thư mục libs (Smarty vừa download) vào root/www/myWebsite/includes và rename thành "smarty" nhé!

- Ta tạo file cấu hình "config.php" trong thư mục /includes cho project, file này khởi tạo Smarty, cấu hình database,...
- Tạo file index.php trong www/myWebsite, và template của nó là index.html trong myWebsite/templates/default/
Như vậy cấu trúc các thư mục sau khi tạo như sau:

İmage

Bước 3: Cấu hình khởi tạo Smarty
- Bạn mở includes/config.php và paste code cấu hình sau:
Thay đổi $path_site nhé
Mã PHP: (SELECT ALL)
// Config pages$path_site "/myWebiste/";  // đường dẫn thư mục website, slash đầu và cuối dòngdefine('_BASE'$_SERVER['DOCUMENT_ROOT'].$path_site);   // đường dẫn tuyệt đối E:/Wamp/www/myWebsite/
// Smarty config
include _BASE.'includes/smarty/Smarty.class.php';$smarty = new Smarty;$smarty->template_dir _BASE.'/templates/default/';  // template folder$smarty->compile_dir _BASE.'/templates_c'// template cache$smarty->cache_dir _BASE.'/cache'// php cache $smarty->config_dir _BASE.'/includes/smarty/config'// smarty cache$smarty->compile true// end able compiler, debug 

Bước 4: Xong cấu hình, ta thử tạo 1 template đơn giản nhé!
Template hiển thị: "Chào mừng bạn: Phú"; với giá trị "Phú" là 1 giá trị được tạo ra từ biến $name trong index.php
- Mở myWebsite/index.php

Mã PHP: (SELECT ALL)
// include file configrequire 'includes/config.php';$name "Phú";  // tạo biến$smart->assign("person",$name);  // nạp $name vào tempalate, tạo ra biến person cho template sử dụng$smarty->display("index.html");  // nạp template index.html?>


- Mở myWebsite/templates/default/index.html và tạo ra 1 template đơn giản
Mã PHP: (SELECT ALL)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml">
<
head>
<
meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<
title>Hello World</title>
</
head>
  
<
body>
    <
h1>Chào mừng bạn: {$person} !</h1>
</
body>
</
html

- Chạy http://localhost/myWebsite/index.php và xem kết quả

Chúc các bạn thành công, thắc mắc liên hệ qua email: dinhanhtuan68@gmail.com