NETTE

FRAMEWORK

since 2004 by David Grudl

2.1-dev
nette.org
Martin Zlámal
Co se dnes dozvíte?
1. Co je to vlastně ten framework
2. Co je to MVP

3. Něco málo o šablonách
4. Něco málo o prezentační...
Kdo se bez Nette neobejde?
Bandzone.cz, Blueboard.cz, ČSFD, eshop.iaeste.cz, E15.cz,
FRESH-hosting.cz, H1.cz, Primat.cz RO...
Co je to ten framework?
KISS

DRY
Context-Aware Escaping

SEO

cool URL

AJAX / AJAJ
Dependency Injection

Web 2.0
MVC
Tak co je to tedy ten
framework?
Je to nástroj…
„Framework je jako lopatička na pískovišti. Hrad z písku postavíte i
rukam...
Co naopak není framework
Není to WordPress…
„Framework není instantní hrad z písku. Je zapotřebí trošku snahy,
ale s lopat...
MODEL - VIEW - PRESENTER
Model je rozsáhlá vrstva aplikace. Zajišťuje aplikační logiku.
Není to pouze hloupá obálka pro da...
VIEW
Ten, co se rád ukazuje…
Proč vlastně používat šablony?
• Spojení HTML a PHP nikdy nevypadalo dobře.
• A nejde jen o to, jak je to „hnusné“. Není t...
"); alert(1); //XSS ;-)
• Stačí najít jedno opomenuté neošetřené místo. (optional)
• Pokud do neošetřeného místa protlačím...
Jaký kód je „lepší“?
<?php if ($items): ?>
<?php $counter = 1 ?>
<ul>
<?php foreach ($items as $item): ?>
<li id="item-<?p...
Cappuccino? Latte!
Makra
{$variable} vs. {!$variable}
{if $cond} … {elseif $cond} … {else} … {/if}
{ifset $var} … {elseifset $var} … {/ifset}...
Context-Aware Escaping
Jméno: {$name} {$surname}<br>
Věk: {date('Y') - $birth}<br>

<script type="text/javascript">
var po...
Linky a podmínky
<a href="{link edit, 10}">edituj</a>
<ul class="menu">
<li><a href="{link Default:default}">...</a></li>
...
Cykly a podmínky
{foreach $rows as $row}
{if $iterator->first}<table>{/if}

<tr id="row-{$iterator->counter}">
<td>{$row->...
N:makra
Běžné zadání (menu webu):
Vypište data z databáze jako elementy <li>, neznáte dopředu jejich počet a
chceme, aby k...
Řešení:
<ul>
{foreach $data as $item}
<li n:class="$iterator->odd ? alt, $iterator->last ? last">
<a href="#" n:class="$pr...
Helpery
<h1>{$heading|upper}</h1>
{var $title = 'Řekněte, jak se máte?'}
{$title|truncate:20} Řekněte, jak se…
{var $name ...
Shrnutí šablon
• Není důvod je nepoužívat, protože…
• Zvyšují čitelnost a přehlednost výsledného kódu.

• Ulehčují práci a...
MODEL
Ten, co dělá chytrého…
NetteDiagnosticsDebugger
„Tracy“
„Není to pouze obálka pro databázové
dotazy!“
No vlastně je…
NetteDatabase
• Každý nechť používá, co se mu zlíbí, ale když mluvíme o Nette…
• Dibi, LeanMapper, Doctrine2, vlastní…
• N...
Auto-loading tříd
• Require souborů je amatérské a nudné.
• Includují se pouze ty soubory, které se
skutečně použijí.
• Ne...
NetteObject
• Taťka všech objektů, přinášející „Syntactic sugar “ do vašich tříd.
• Dělá třídy striktní (PHP umožňuje zapi...
NetteApplicationApplication, NetteApplicationDiagnosticsRoutingPanel, NetteApplicationRoutersSimpleRouter, NetteArrayList,...
Shrnutí modelu
• Pro debug je velmi užitečný debugger Tracy.

• Pro práci s DB existuje NetteDatabase, nástavba nad PDO.
•...
PRESENTER
Ten, bez kterého to nejde…
Životní cyklus presenteru
1. Inicializace proměnných

parent::startup();

2. Alternativa k render metodě

action<Action>()...
Formuláře
• Formuláře jsou obecně velmi náročné a problematické. Proč?
• Jsou pracné. Musíte psát HTML kód…
• Musíte zajis...
Formuláře v Nette
• Snaží se předchozí problémy maximálně potlačit…
• Generuje HTML5 validační pravidla.
• Poskytuje jedno...
NetteApplicationUIForm
• Dědí od obecné třídy NetteFormsForm

{control signInForm}

protected function createComponentSign...
Routování URL adres
<a n:href="Product:detail $productId">detail produktu</a>

• Routování je obousměrné překládání mezi U...
Dependency Injection
„Podstatou Dependency Injection (DI) je odebrat třídám zodpovědnost
za získávání objektů, které potře...
AJAX / AJAJ
Asynchronous JavaScript and XML1) / JSON2)
Extensible Markup Language
2) JavaScript Object Notation
1)
Legen… wait for it…
…dary, legendary
• XMLHttpRequest – „WTF object“
• S AJAXem to není tak jednoduché…
• Snižuje zátěž webového serveru. To a...
AJAX prakticky (Nette)
Je potřeba několik jednoduchých kroků:
1.

Vyvolat event na straně klienta (JS) – není vazba na kon...
Shrnutí presenteru a AJAXu
• Presenter má vlastní životní cyklus. Každá metoda je vhodná na něco jiného.

• Pro tvorbu for...
DĚKUJI ZA
POZORNOST
ZEMINEM.CZ
FRESH-HOSTING.CZ
Nette Framework - přednáška na ZČU pro KIV/WEB
Nette Framework - přednáška na ZČU pro KIV/WEB
Upcoming SlideShare
Loading in …5
×

Nette Framework - přednáška na ZČU pro KIV/WEB

1,746 views

Published on

Poslední přednáška z předmětu KIV/WEB na ZČU určená pro studenty začínající v oboru webových aplikací.

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,746
On SlideShare
0
From Embeds
0
Number of Embeds
446
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Nette Framework - přednáška na ZČU pro KIV/WEB

  1. 1. NETTE FRAMEWORK since 2004 by David Grudl 2.1-dev nette.org Martin Zlámal
  2. 2. Co se dnes dozvíte? 1. Co je to vlastně ten framework 2. Co je to MVP 3. Něco málo o šablonách 4. Něco málo o prezentační vrstvě 5. Něco málo o modelové vrstvě 6. Jak na AJAX / AJAJ 7. Praktická ukázka (pokud zbyde čas)
  3. 3. Kdo se bez Nette neobejde? Bandzone.cz, Blueboard.cz, ČSFD, eshop.iaeste.cz, E15.cz, FRESH-hosting.cz, H1.cz, Primat.cz ROOT.cz, Mladá fronta, Slevomat, ujop.cuni.cz, Uloz.to, Václav Klaus, můj blog a mnoho dalších…
  4. 4. Co je to ten framework? KISS DRY Context-Aware Escaping SEO cool URL AJAX / AJAJ Dependency Injection Web 2.0 MVC
  5. 5. Tak co je to tedy ten framework? Je to nástroj… „Framework je jako lopatička na pískovišti. Hrad z písku postavíte i rukama, ale lopatička je prostě lepší.“
  6. 6. Co naopak není framework Není to WordPress… „Framework není instantní hrad z písku. Je zapotřebí trošku snahy, ale s lopatičkou to jde skoro samo.“
  7. 7. MODEL - VIEW - PRESENTER Model je rozsáhlá vrstva aplikace. Zajišťuje aplikační logiku. Není to pouze hloupá obálka pro databázové dotazy! View zobrazuje data z modelu. Presenter to celé řídí. Je to nutné? Není, ale dává to smysl.
  8. 8. VIEW Ten, co se rád ukazuje…
  9. 9. Proč vlastně používat šablony? • Spojení HTML a PHP nikdy nevypadalo dobře. • A nejde jen o to, jak je to „hnusné“. Není to ani bezpečné. • Máte jistotu v tom, jak escapovat HTML, XML, CSS, JS, nebo REGEX? • Oproti tomu šablony jsou bezpečné a přehledné. • A navíc šablonováním neztrácíte výkon, takže co vlastně řešíme? • Protiargumenty?
  10. 10. "); alert(1); //XSS ;-) • Stačí najít jedno opomenuté neošetřené místo. (optional) • Pokud do neošetřeného místa protlačíme alert(1); protačíme už vše... • Nyní již snadno získáme například administrátorské session ID. • Session ID můžeme snadno podstrčit a vydávat se tak za administrátora. • Změníme admin hesla, získáme citlivé údaje, zveřejníme citlivé údaje, smažeme databáze, smažeme celý web, přečteme si emaily, smažeme emaily... • To vše jen kvůli zapomenutému htmlspecialchars. Creepy…
  11. 11. Jaký kód je „lepší“? <?php if ($items): ?> <?php $counter = 1 ?> <ul> <?php foreach ($items as $item): ?> <li id="item-<?php echo $counter++ ?>"> <?php echo htmlSpecialChars(mb_convert_case($item, MB_CASE_TITLE)) ?> </li> <?php endforeach ?> </ul> <?php endif?> <ul n:if="$items"> {foreach $items as $item} <li id="item-{$iterator->counter}">{$item|capitalize}</li> {/foreach} </ul>
  12. 12. Cappuccino? Latte!
  13. 13. Makra {$variable} vs. {!$variable} {if $cond} … {elseif $cond} … {else} … {/if} {ifset $var} … {elseifset $var} … {/ifset} {ifCurrent $link} … {/ifCurrent} {$cond ? $value1 : $value2} popř. {$cond ? $value} {foreach $arr as $item} … {/foreach} {for expr; expr; expr} … {/for} {sep} … {/sep} {snippet name} … {/snippet} {dump $variable} popř. {dump}
  14. 14. Context-Aware Escaping Jméno: {$name} {$surname}<br> Věk: {date('Y') - $birth}<br> <script type="text/javascript"> var pole = {$arr}; var name = {$name}; // pozor, zapisuje se bez uvozovek! </script> Jméno: &lt;script&gt;John Doe&lt;/script&gt;<br> Věk: 23<br> //… následuje <script type=… var pole = [1,2,3]; var name = "<script>John";
  15. 15. Linky a podmínky <a href="{link edit, 10}">edituj</a> <ul class="menu"> <li><a href="{link Default:default}">...</a></li> <li><a href="{link}">...</a></li> ... <li {ifCurrent Default:default}class="current"{/ifCurrent}> <a href="{link Default:default}">...</a> </li> <li {ifCurrent Default:*}class="current"{/ifCurrent}> <a n:href="Default:default">...</a> </li> </ul>
  16. 16. Cykly a podmínky {foreach $rows as $row} {if $iterator->first}<table>{/if} <tr id="row-{$iterator->counter}"> <td>{$row->name}</td> <td>{$row->email}</td> </tr> // vzpomínáte na {sep}, {/sep} ? {if $iterator->last}</table>{/if} {/foreach}
  17. 17. N:makra Běžné zadání (menu webu): Vypište data z databáze jako elementy <li>, neznáte dopředu jejich počet a chceme, aby každý lichý řádek měl třídu alt a poslední třídu last. Pokud by byl poslední řádek lichý, má mít obě třídy. A protože jsme puntičkáři, nechceme v kódu žádné prázdné <li class=" "> apod. V <li> elementu bude odkaz, který bude mít třídu current, pokud je odkaz právě aktivní.
  18. 18. Řešení: <ul> {foreach $data as $item} <li n:class="$iterator->odd ? alt, $iterator->last ? last"> <a href="#" n:class="$presenter->isLinkCurrent('Presenter:*') ? current"> {$item} </a> </li> {/foreach} </ul>
  19. 19. Helpery <h1>{$heading|upper}</h1> {var $title = 'Řekněte, jak se máte?'} {$title|truncate:20} Řekněte, jak se… {var $name = 'náš produkt'} {$name|webalize} nas-produkt <img src="{$img|dataStream}"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO 9TXL0Y4OHwAAAABJRU5ErkJggg==">
  20. 20. Shrnutí šablon • Není důvod je nepoužívat, protože… • Zvyšují čitelnost a přehlednost výsledného kódu. • Ulehčují práci a nesnižují výkon aplikace. • Umožňují aplikaci lépe zabezpečit. • Existují makra, n:makra a helpery… Nějaké dotazy k šablonám nebo k tomu, co jsem doposud říkal?
  21. 21. MODEL Ten, co dělá chytrého…
  22. 22. NetteDiagnosticsDebugger „Tracy“
  23. 23. „Není to pouze obálka pro databázové dotazy!“ No vlastně je…
  24. 24. NetteDatabase • Každý nechť používá, co se mu zlíbí, ale když mluvíme o Nette… • Dibi, LeanMapper, Doctrine2, vlastní… • NetteDatabase tvoří nadstavbu PDO a je inspirováno NotORM. (Jakub Vrána) • Databáze se ptá opravdu efektivně (žádné SELECT * FROM). • Ačkoliv se ukazuje, že na SELECT * FROM není nic špatného… • Ale není to ORM. Vadí to však? Jak kdy a jak komu. • Umí udělat v šabloně nesmyslný „bordel“ ( ->related(spojovaci_tabulka) ).
  25. 25. Auto-loading tříd • Require souborů je amatérské a nudné. • Includují se pouze ty soubory, které se skutečně použijí. • NetteLoadersRobotLoader RobotLoader je extrémně pohodlná a návyková droga. Budete mít problém přestat, budete mít problém uvědomit si, že není vždy k dispozici. Nehodlám se ho však nikdy vzdát. Nikdy… (-:
  26. 26. NetteObject • Taťka všech objektů, přinášející „Syntactic sugar “ do vašich tříd. • Dělá třídy striktní (PHP umožňuje zapisovat do neexistujících proměnných). • Dokáže za určitých okolností imitovat gettery a settery. • Umožňuje sebereflexi objektu a to včetně anotací. • Umí toho mnohem více. Callbacky, události, rozšiřující metody…
  27. 27. NetteApplicationApplication, NetteApplicationDiagnosticsRoutingPanel, NetteApplicationRoutersSimpleRouter, NetteArrayList, NetteCachingCache, NetteCachingOutputHelper, NetteCachingStoragesDevNullStorage, NetteCachingStoragesFileJournal, NetteCachingStoragesFileStorage, NetteCachingStoragesMemcachedStorage, NetteCachingStoragesMemoryStorage, NetteCallback, NetteApplicationPresenterFactory, NetteComponentModelComponent, NetteConfigAdaptersIniAdapter, NetteConfigAdaptersNeonAdapter, NetteConfigAdaptersPhpAdapter, NetteConfigCompiler, NetteConfigCompilerExtension, NetteConfigConfigurator, NetteConfigLoader, NetteDatabaseDiagnosticsConnectionPanel, NetteDatabaseDriversMsSqlDriver, NetteApplicationResponsesFileResponse, NetteDatabaseDriversMySqlDriver, NetteDatabaseDriversOciDriver, NetteDatabaseDriversOdbcDriver, NetteDatabaseDriversPgSqlDriver, NetteDatabaseDriversSqliteDriver, NetteDatabaseReflectionConventionalReflection, NetteDatabaseReflectionDiscoveredReflection, NetteDatabaseSqlLiteral, NetteDatabaseSqlPreprocessor, NetteDatabaseTableActiveRow, NetteApplicationResponsesForwardResponse, NetteDatabaseTableSelection, NetteDatabaseTableSqlBuilder, NetteDIContainerBuilder, NetteDIDiagnosticsContainerPanel, NetteDIServiceDefinition, NetteDIStatement, NetteDiagnosticsBar, NetteDiagnosticsBlueScreen, NetteDiagnosticsFireLogger, NetteDiagnosticsLogger, NetteApplicationResponsesJsonResponse, NetteFormsControlGroup, NetteFormsRenderingDefaultFormRenderer, NetteFormsRule, NetteFormsRules, NetteFreezableObject, NetteHttpContext, NetteHttpFileUpload, NetteHttpRequest, NetteHttpRequestFactory, NetteHttpResponse, NetteApplicationResponsesRedirectResponse, NetteHttpSession, NetteHttpSessionSection, NetteHttpUserStorage, NetteImage, NetteLatteCompiler, NetteLatteEngine, NetteLatteHtmlNode, NetteLatteMacroNode, NetteLatteMacrosCacheMacro, NetteLatteMacrosMacroSet, NetteApplicationResponsesTextResponse, NetteLatteParser, NetteLattePhpWriter, NetteLatteToken, NetteLoadersAutoLoader, NetteMailMimePart, NetteMailSendmailMailer, NetteMailSmtpMailer, NetteReflectionAnnotation, NetteSecurityDiagnosticsUserPanel, NetteSecurityPermission, NetteApplicationRoutersCliRouter, NetteSecuritySimpleAuthenticator, NetteSecurityUser, NetteTemplatingTemplate, NetteUtilsFinder, NetteUtilsHtml, NetteUtilsNeon, NetteUtilsPaginator, NetteUtilsPhpGeneratorClassType, NetteUtilsPhpGeneratorMethod, NetteUtilsPhpGeneratorParameter, NetteApplicationRoutersRoute, NetteUtilsPhpGeneratorProperty, NetteUtilsTokenizer, NetteUtilsValidators, NetteModuleMicroPresenter, NetteApplicationRequest, NetteApplicationRoutersRouteList, NetteConfigExtensionsNetteExtension, NetteConfigExtensionsPhpExtension, NetteDatabaseDriversSqlite2Driver, NetteDatabaseTableGroupedSelection, NetteDIContainer, NetteFormsContainer, NetteFormsControlsBaseControl, NetteFormsControlsButton, NetteFormsControlsCheckbox, NetteFormsControlsHiddenField, NetteApplicationUIControl, NetteFormsControlsImageButton, NetteFormsControlsMultiSelectBox, NetteFormsControlsRadioList, NetteFormsControlsSelectBox, NetteFormsControlsSubmitButton, NetteFormsControlsTextArea, NetteFormsControlsTextBase, NetteFormsControlsTextInput,
  28. 28. Shrnutí modelu • Pro debug je velmi užitečný debugger Tracy. • Pro práci s DB existuje NetteDatabase, nástavba nad PDO. • Třídy se načítají automaticky, není potřeba require. • NetteObject dělá z objektů objekty 2.0… Nějaké dotazy k modelu nebo k tomu, co jsem doposud říkal?
  29. 29. PRESENTER Ten, bez kterého to nejde…
  30. 30. Životní cyklus presenteru 1. Inicializace proměnných parent::startup(); 2. Alternativa k render metodě action<Action>(); 3. Zpracování signálů (AJAX) handle<Signal>(); 4. Předání společných prom. beforeRender(); 5. Předání dat do šablony render<View>(); 6. … ??? Cache ??? shutdown();
  31. 31. Formuláře • Formuláře jsou obecně velmi náročné a problematické. Proč? • Jsou pracné. Musíte psát HTML kód… • Musíte zajistit JavaScriptovou validaci. • Musíte zajistit serverovou validaci. • V případě chyby vrátit a vypsat předvyplněný formulář. • Neudělat bezpečnostní chybu a zajistit zpětnou kompatibilitu. • Na nic z toho nezapomenout…
  32. 32. Formuláře v Nette • Snaží se předchozí problémy maximálně potlačit… • Generuje HTML5 validační pravidla. • Poskytuje jednoduchý způsob překladu formulářů. • Ošetřuje XSS, CSRF, UTF-8 attack, … • Umožňuje jednoduše ovlivnit výstupní kód. Někdy…
  33. 33. NetteApplicationUIForm • Dědí od obecné třídy NetteFormsForm {control signInForm} protected function createComponentSignInForm() { $form = new NetteApplicationUIForm; $form->addText('name', 'Jméno:'); $form->addPassword('password', 'Heslo:'); $form->addSubmit('login', 'Přihlásit se'); $form->onSuccess[] = $this->signInFormSubmitted; return $form; } public function signInFormSubmitted(UIForm $form) { $values = $form->getValues(); // ... $this->flashMessage('Byl jsi úspěšně přihlášen.'); $this->redirect('Homepage:'); }
  34. 34. Routování URL adres <a n:href="Product:detail $productId">detail produktu</a> • Routování je obousměrné překládání mezi URL a akcí presenteru. • Nemusíme se v šablonách (a presenterech) starat o URL adresy. • Tvar odkazů lze velmi snadno ovlivnit. Globálně. • SimpleRouter (pokud nelze použít mod_rewrite) – parametry v URL • CliRouter, možno vytvořit si vlastní router • Podpora ONE_WAY jednosměrek, HTTPS, překladů, filtrů… • Debugger panel, SEO a kanonizace
  35. 35. Dependency Injection „Podstatou Dependency Injection (DI) je odebrat třídám zodpovědnost za získávání objektů, které potřebují ke své činnosti (tzv. služeb) a místo toho jim služby předávat při vytváření.“ • Uvedením závislostí v konstruktoru presenteru. Nepraktické. • Injekce závislostí pomocí setrů. Lepší, ale moc práce. • Inject* metody, předek – objekt obsahující závislosti. • Magické injektování pomocí anotace @inject. Trošku kouzlo…
  36. 36. AJAX / AJAJ Asynchronous JavaScript and XML1) / JSON2) Extensible Markup Language 2) JavaScript Object Notation 1)
  37. 37. Legen… wait for it…
  38. 38. …dary, legendary • XMLHttpRequest – „WTF object“ • S AJAXem to není tak jednoduché… • Snižuje zátěž webového serveru. To ano, ale také zvyšuje počet HTTP požadavků… • Jak je to s tlačítkem zpět / vpřed a historií? • Jak je to s adresou URL? Reprezentuje aktuální stav? • Je potřeba signalizovat průběh AJAX požadavku. Ukazuje se, že většina věcí je dnes již vyřešena, nic to však nemění na tom, že je třeba hooodně promyslet, jestli je použití AJAXu pro daný účel vhodné.
  39. 39. AJAX prakticky (Nette) Je potřeba několik jednoduchých kroků: 1. Vyvolat event na straně klienta (JS) – není vazba na konkrétní JS knihovnu 2. Ten na pozadí zavolá handle* metodu z presenteru 3. Vrátíme data do šablony (payload, klasickým způsobem) 4. Invalidujeme (čti překreslíme) snippet (čti logickou část stránky) Více v ukázce…
  40. 40. Shrnutí presenteru a AJAXu • Presenter má vlastní životní cyklus. Každá metoda je vhodná na něco jiného. • Pro tvorbu formulářů existuje NetteApplicationUIForm. • Tvar URL adres lze velmi dobře ovlivnit pomocí tzv. routování. • Snažíme se dodržovat Dependency Injection, je to jednoduché a pohodlné. • Práce s AJAXem je díky frameworku velmi jednoduchá a přímočará. Nějaké dotazy k presenterům nebo k tomu, co jsem doposud říkal?
  41. 41. DĚKUJI ZA POZORNOST ZEMINEM.CZ FRESH-HOSTING.CZ

×