Dzięki Smarty całkowicie oddzielimy warstwę prezentacji naszej aplikacji i zgodnie ze wzorcem MVC w pełni odseparujemy ją od reszty aplikacji. Na początek może krótkie wprowadzenie do tego czym jest i jak powinien być rozumiany wzorzec MVC. Nazwa tego wzorca to skrót od Model-View-Controller, a więc Model-Prezentacja-Kontroler.
Jest to ogólnie przyjęty wzorzec projektowania aplikacji, który rozdziela ją na 3 niezależne, ale współpracujące ze sobą warstwy. Warstwa modelu odpowiada za wszystkie dane jakie przetwarza aplikacja, zarządza dostępem do bazy i zajmuje się przetwarzaniem wszystkich elementów z którymi pracuje aplikacja. Warstwa prezentacyjna odpowiada za wyświetlanie przetwarzanych przez warstwę modelu danych użytkownikowi i za interfejs komunikacji z nim. Warstwa kontrolera natomiast steruje tym wszystkim i zarządza aplikacją określając sposób w jaki przetwarzane w modelu dane przekazać użytkownikowi w warstwie prezentacji. Jest to wzorzec bardzo praktyczny, efektywny i traktowany już obecnie jako standard w projektowaniu aplikacji. Smarty pracować bedzie w drugiej z omówionych warstw - a więc prezentacyjnej.
Instalacja
Instalacja Smarty sprowadza się do pobrania bibliotek składających się na silnik oraz dołączeniu ich do własnej aplikacji. Najnowszą wersję pakietu pobierzemy zawsze z oficjalnej strony: http://www.smarty.net/. W dziale download znajdziemy link do repozytorium na GitHUB-ie, które następnie pobierzemy sobie na dysk. Pobierzmy zatem Smarty w wersji spakowanej zipem: https://github.com/smarty-php/smarty/archive/master.zipPod tym linkiem znajduje się zawsze najnowsza, stabilna wersja biblioteki Smarty.
Możemy też odwiedzić repozytorium bezpośrednio: https://github.com/smarty-php/smarty
Jeśli natomiast chcemy pobrać bibliotekę za pomocą GIT-a, to link do sklonowania repozytorium wygląda tak:
[code]git clone https://github.com/smarty-php/smarty.git[/code]
Smarty możemy także pobrać za pomocą Composera - pisałem o tym w tym artykule, przy okazji omówienia podstaw obsługi Composera. Aby zainstalować z poziomu Composera, tworzymy plik composer.json w folderze, gdzie chcemy pobrać Smarty o treści:
[code]
"require": {
"smarty/smarty": "~3.1"
}[/code]
Następnie uruchamiamy Composera i instalujemy:
[code]$ composer install[/code]
Zaczynamy
Niezależnie, którego sposobu użyliśmy, trafiły do nas te same pliki.Rozpakujmy pobrane archiwum (jeśli pobraliśmy plik .zip) i skopiujmy zawarty w archiwum katalog:
[code]/libs[/code]
do katalogu z naszym projektem, np.
[code]C:/www/smarty/libs[/code]
(będę się tu posługiwał takim przykładem, gdzie C:/www to Document Root webserwera)
W katalogu /libs znajdują się wszystkie potrzebne dla nas biblioteki.
Jeśli chcemy zobaczyć Smarty w działaniu to skopiujmy również katalog /demo i zobaczmy:
[code]http://localhost/smarty/demo/[/code]
Teraz, aby móc zacząć pracę ze Smarty musimy utworzyć trzy podkatalogi w katalogu z naszym projektem:
- C:/www/smarty/templates
- C:/www/smarty/templates_c
- C:/www/smarty/cache
Muszą mieć one uprawnienia do zapisu przez PHP, co na Windowsach nie wymagać będzie żadnych zabiegów, ale już na Linuxach trzeba tym katalogom ustawić:
[code]chmod 775[/code]
W folderach:
- /templates - trzymać będziemy nasze szablony w postaci plików .tpl
- /templates_c - tutaj trzymane będą skompilowane do kodu PHP wersje szablonów
- /cache - trzymany tu będzie finalnie wygenerowany i skompilowany przez Smarty widok
Jak widać po samej strukturze folderów - Smarty kompiluje szablony do wersji z normalnym kodem PHP. Dzięki temu biblioteka działa szybciej, gdyż nie musi za każdym razem parsować od nowa tego samego szablonu, a jedynie podstawić zmienne do wersji skompilowanej.
Pierwszy projekt
Stworzymy sobie teraz pierwszy projekt z użyciem Smarty i zobaczymy jak to mniej więcej działa.Utwórzmy plik:
[code]C:/www/smarty/index.php[/code]
tak, aby mieć do niego dostęp z poziomu:
[code]http://localhost/smarty/index.php[/code]
i dołączmy do niego bibliotekę Smarty:
[code]
<?php
/* index.php */
require '/libs/Smarty.class.php';
$smarty = new Smarty;
?>[/code]
Będzie to nasz główny plik z kodem PHP.
Następnie utwórzmy prosty plik z szablonem strony:
[code]C:/www/smarty/templates/index.tpl[/code]
I jako zawartość wklejmy mu prosty kod HTML:
[code]
<html>
<head>
<title>Smarty</title>
</head>
<body>
<h1>Testujemy Smarty</h1>
</body>
</html>[/code]
(pamiętajmy o rozszerzeniu - plik mówi mieć końcówkę .tpl, a nie .php)
Mamy już dwa bazowe pliki, których będziemy tutaj używać, zobaczmy teraz na jakiej zasadzie działa Smarty.
Po stronie kodu - index.php
W pliku index.php znajdować się będzie cały kod z jakiego składać się będzie nasza prosta, przykładowa aplikacja. Kod ten nie będzie wyświetlać żadnych danych, będzie jedynie je generować i przetwarzać. Wszelkie dane jakie będą miały być wyświetlone na ekranie zostaną z poziomu tego pliku wysłane do silnika Smarty, który następnie przetworzy nasz szablon (znajdujący się w pliku .tpl) i podstawi do niego wygenerowane przez naszą aplikację dane, a następnie taki szablon - uzupełniony o nasze dane wyświetlli na ekranie.Skąd jednak Smarty ma wiedzieć co i gdzie ma wyświetlić? Musimy mu o tym powiedzieć, a zrobimy to za pomocą metody:
[code]$smarty->assign('nazwa', $zmienna);[/code]
Metoda assign() przypisuje zmienne do szablonu i mówi silnikowi Smarty, aby w miejscu w szablonie, które zostanie oznaczone znacznikiem nazwa wstawić wartość zmiennej $zmienna.
Po stronie szablonu - /templates/index.tpl
W pliku index.tpl nie znajdzie sie ani jedna linijka kodu PHP. Zamiast tego, w miejscach, gdzie mają wyświetlić się dane generowane przez PHP wstawimy odpowiednie znaczniki z nazwami.Znacznik taki będzie miał w szablonie postać:
[code]{$nazwa_znacznika}[/code]
Jak więc widzimy, znacznik to nazwa ze znakiem dolara objęta w nawiasy klamrowe.
Nazwę tę definiujemy podczas przypisania zmiennej w pliku index.php metodą $smarty->assign().
I tak na przykład:
[code]$smarty->assign('site_title', $title);[/code]
czyli przypisanie wykonane w kodzie w pliku index.php, spowoduje, że w pliku index.tpl, w miejscu gdzie wystąpi znacznik:
[code]{$site_title}[/code]
wyświetlona zostanie wartość zmiennej $title.
Zobaczmy to na prostym przykładzie:
Plik index.php:
[code]
<?php
/* index.php */
// dołączamy bibliotekę Smarty
require '/libs/Smarty.class.php';
$smarty = new Smarty;
// tworzymy zmienne
$title = 'Smarty test';
$time = date('H:i:s');
$text = 'Hello World!';
$footer = 'a to stopka';
// przypisujemy zmienne do szablonu
$smarty->assign('site_title', $title);
$smarty->assign('time', $time);
$smarty->assign('text', $text);
$smarty->assign('footer', $footer);
$smarty->display('index.tpl');
// renderujemy widok z szablonu index.tpl
?>[/code]
Teraz w pliku /templates/index.tpl:
[code]
<html>
<head>
<title>{$site_title}</title>
</head>
<body>
<h2>{$text}/h2>
Obecna godzina to: {$time}
<br /><br />
{$footer}
</body>
</html>
[/code]
Zapisujemy pliki i wchodzimy na:
[code]http://localhost/smarty/index.php[/code]
Wyświeti nam się:
Zaglądając w źródło zobaczymy, że jest to dokładnie nasz szablon wypełniony odpowiednimi zmiennymi:
[code]<html>
<head>
<title>Smarty test</title>
</head>
<body>
<h2>Hello World!</h2>
Obecna godzina to: 22:52:10
<br /><br />
a tutaj stopka
</body>
</html>[/code]
I to tyle tytułem podstawowego wprowadzenia do Smarty.
Wiemy już jak mniej więcej to działa, więc w kolejnych artykułach zajmiemy się dalszymi kwestiami i już normalną pracą ze Smarty.
Brakuje tam:
OdpowiedzUsuń$smarty->assign('footer', $footer);
Dzięki za zwrócenie uwagi. Poprawione :)
UsuńThanks for sharing this interesting fact of PHP language to develop a website. The points or tricks that you shared in this blog was great and easy to understand. Keep sharing to us.
OdpowiedzUsuńWhat a great information you provided sir, some of my friend even don't know PHP Full Form or HTTP Full Form
OdpowiedzUsuńArtículo imprescindible para crear aplicaciones informaticas
OdpowiedzUsuńgracias por tu ayuda