Přidej si svou IT školu do profilu a najdi spolužáky zde na síti :)

5. díl - Jednoduchý redakční systém v Symfony - Struktura projektu

PHP Symfony Základy Jednoduchý redakční systém v Symfony - Struktura projektu

ONEbit hosting Unicorn College Tento obsah je dostupný zdarma v rámci projektu IT lidem. Vydávání, hosting a aktualizace umožňují jeho sponzoři.

Vítám všechny středně pokročilé a pokročilé programátory u pokračování kurzu tutoriálů o tvorbě webových aplikací v PHP frameworku Symfony. V minulém díle, Dokončení kalkulačky v Symfony, který byl věnován spíše začátečníkům, jsme dokončili první jednoduchou aplikaci a dnes bych se tak chtěl posunout někam dál. Začneme nový projekt, kterým bude jednoduchý redakční systém s editorem článků. To je již zajímavější webová aplikace, na které si můžeme vyzkoušet další věci, které nám Symfony nabízí (hlavně práci s ORM nad databází). Konkrétně dnešní díl bude tedy věnován především struktuře našeho projektu a jeho základnímu nastavení.

Struktura projektu

Reálné komerční projekty mají spoustu tříd a určitě bychom si v nich nevystačili pouze s rozdělením struktury projektu na modely, kontrolery a šablony. Mít v jedné složce desítky souborů je minimálně nepřehledné. Kód by se špatně spravoval a z vlastní zkušenosti mohu říci, že byste se dostali do bodu, kdy byste psali podobné metody znovu a znovu místo toho, abyste parametrizovali nějakou existující, protože byste zkrátka ani nevěděli, že v projektu nějaká podobná již je. A to je začátek konce. :) Jak z toho ven?

Jmenné prostory a systém bundlů

Třídy rozdělíme do logických skupin a určitě vás nepřekvapí, že za tímto účelem využijeme jmenných prostorů. To je přesně ten nástroj určený k řešení právě problému s vysokým počtem tříd. Protože budeme počítat s tím, že náš projekt poroste, což je vždy dobré, nespokojíme se ani s jednoduchým rozdělením složek MVC do několika podsložek. Celou aplikaci rozdělíme ještě do tzv. Symfony bundlů.

Vlastních bundlů bývá v průměrně velké webové aplikaci obvykle poměrně nízký počet (např. kolem 3) a můžeme je chápat jako samostatné části, ze kterých se aplikace skládá. Ovšem, co se týče bundlů třetích stran, těch může být i v menší aplikaci relativně velký počet, protože slouží jako pluginy. Pokud si pak jednou napíšeme vlastní bundle např. na E-shop, můžeme ho později použít i v ostatních projektech, které jsou na našem systému postavené a to aniž bychom něco složitě upravovali. V každém projektu budou zároveň jen ty bundly, které jsou zapotřebí, aby nebyl příliš složitý nebo abychom zákazníkovi prostě nedávali veškeré naše know-how. :) V tomto projektu si však vystačíme pouze se základním AppBundle (v Symfony pak lze pojmenování bundlů řešit včetně jmenných prostorů):

  • AppBundle - Bude obsahovat hlavní jádro aplikace, které dokáže spravovat články a uživatele. Jedná se v podstatě o základní CMS (Content Management System, správa obsahu).

Mimochodem, všimněte si, že celý náš web budeme programovat v angličtině, čeština je v programování pouze pro začátečníky a v reálných aplikacích by se objevovat neměla. Důvodem je zejména fakt, že se angličtině v kódu nevyhneme (už jen samotné PHP je anglicky a budeme používat i další třídy třetích stran) a míchat 2 jazyky do sebe je nepřehledné.

Struktura webu

Pro náš projekt budeme potřebovat klasicky webový server (např. Apache) s PHP ve verzi 5.5.9 nebo vyšší a MySQL databázi (případně můžete použít i jinou SQL databázi) a postavíme ho klasicky na Symfony Standard Edition ve verzi 3.2.7. Pokud nevíte, jak rozchodit webový server s databází, doporučuji článek Instalace Apache, MySQL a PHP na Windows a pokud nevíte, jak získat a zprovoznit Symfony Standard Edition, vřele doporučuji přečíst si předchozí díl Symfony Standard Edition a IDE. Nyní tedy předpokládám, že máme před sebou čerstvě nainstalovaný Symfony Standard Edition a my v něm provedeme několik následujících změn.

Příprava projektu

  • Za předpokladu, že jste to již neudělali, tak přímo do kořenové složky našeho projektu si přidáme .htaccess, který zajistí automatické přesměrování všech požadavků do složky web/. Tento soubor může vypadat třeba takto:
<IfModule mod_rewrite.c>
        RewriteEngine On
        RewriteRule ^$ web/ [L]
        RewriteCond %{REQUEST_FILENAME} !-f
        RewriteCond %{REQUEST_FILENAME} !-d
        RewriteCond %{REQUEST_URI} !^web/
        RewriteRule ^(.*)$ web/$1
</IfModule>
  • Poté můžeme odstranit pro nás nepotřebné soubory a složky jako tests/, phpunit.xml.dist a README.md.

Konfigurace projektu

Dále musíme ještě přesunou a nastavit pár základních věcí.

Vývojářský režim

Začneme přepnutím celého projektu do vývojářského režimu. To uděláme tak, že přímo ve složce web/ nebudeme směrovat na soubor app.php, ale na připravený soubor app_dev.php. Zařídíme to jednoduchou úpravou souboru web/.htaccess:

...
RewriteRule ^ %{ENV:BASE}/app_dev.php [L]
...

Přesun Twig šablon do AppBundlu

Přesuneme si složku app/Resources/, která obsahuje Twig šablony, do našeho src/AppBundle/, protože chceme mít vše hezky pohromadě. Dále si můžete přejmenovat složku Resources/default na Resources/Defau­lt, což není povinné, jenom pak ale musíte dbát na velká a malá písmena podle svého pojmenování. Po tomto přesunu je potřeba ještě upravit pár souvisejících věcí.

src/AppBundle/Con­troller/Defau­ltController.php

Nejdříve upravíme cestu k přesunuté šabloně ve výchozím kontroleru:

<?php

namespace AppBundle\Controller;

use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
use Symfony\Bundle\FrameworkBundle\Controller\Controller;
use Symfony\Component\HttpFoundation\Response;

/**
 * Výchozí kontroler.
 * @package AppBundle\Controller
 */
class DefaultController extends Controller
{
        /**
         * Výchozí vykreslovací metoda tohoto kontroleru.
         * @return Response HTTP odpověď
         * @Route("/", name="homepage")
         */
        public function indexAction()
        {
                return $this->render('AppBundle:Default:index.html.twig', [
                        'base_dir' => realpath($this->getParameter('kernel.root_dir') . '/..') . DIRECTORY_SEPARATOR
                ]);
        }
}
src/AppBundle/Re­sources/views/De­fault/index.html­.twig

Na konec upravíme ještě cestu k rodičovské šabloně i v samotném souboru index.html.twig:

{% extends 'AppBundle::base.html.twig' %}
...

Přidání vlastního CSS

Na závěr si ještě přidáme vlastní CSS.

src/AppBundle/Re­sources/public/css/sty­le.css

Vytvoříme si v našem AppBundle ve složce Resources/ složku public/ pro veřejné zdroje jako např. CSS, JavaScript, obrázky atd. V ní pak složku css/ a do ní umístíme soubor style.css, který bude vypadat takto:

body {
    font-family: verdana, serif;
    font-size: 14px;
    width: 900px;
    margin: 0 auto;
}

h1 {
    text-align: center;
    color: #444444;
    text-shadow: 3px 3px 3px #aaaaaa;
}

footer {
    font-size: 11px;
    text-align: center;
    padding-top: 20px;
}

article {
    text-shadow: 3px 3px 3px #aaaaaa;
}

nav ul {
    list-style-type: none;
}

nav li {
    float: left;
    margin-right: 15px;
}

nav a {
    background: #6FA4F8;
    color: white;
    padding: 5px 10px;
    border-radius: 10px;
    text-decoration: none;
    border: none;
}

nav a:hover {
    background: #2976f8;
    color: #EEEEEE;
    text-decoration: none;
}

button[type="submit"] {
    background: #6FA4F8;
    color: white;
    padding: 5px 10px;
    border-radius: 10px;
    border: 0;
}

button[type="submit"]:hover {
    background: #2976f8;
    color: #EEEEEE;
    cursor: pointer;
}

input[type="text"], input[type="email"], input[type="password"] {
    width: 250px;
    border-radius: 5px;
    border: 1px solid #aaaaaa;
    padding: 0.3em;
}

button[type="submit"] {
    padding: 10px 25px;
    display: block;
    margin: 20px auto 0;
    font-weight: bold;
}

textarea {
    border-radius: 5px;
    border: 1px solid #aaaaaa;
    width: 483px;
    height: 90px;
}

.message {
    border: 1px solid #9DC2F8;
    background: #DBE8F8;
    padding: 3px;
}

Pokud jsme vše udělali správně, měli bychom být stále schopni web spustit, vidět úvodní stránku a naše adresářová struktura by měla vypadat přibližně takto:

  • app/ - Nyní obsahuje již pouze konfiguraci celého projektu
  • bin/ - Obsahuje spustitelné PHP skripty, především bin/console
  • src/ - Obsahuje zdrojové kódy a další soubory našeho projektu
    • AppBundle/ - Zdrojové kódy a další soubory AppBundlu
      • Controller/ - Kontrolery
      • Resources/ - Šablony a další zdroje
        • public/ - Složka pro veřejné zdroje (obsahuje další podsložky pro různé zdroje)
        • views/ - Složka pro šablony (obsahuje další podsložky pro jednotlivé kontrolery)
  • var/ - Úložiště automaticky generovaných souborů (např. logy, cache, sessions aj.)
  • vendor/ - Složka pro knihovny třetích stran (Composer)
  • web/ - Kořenový adresář celého webu (přístupový bod, kde všechny umístěné soubory jsou přístupné zvenčí)

Tímto dnešní lekce končí, všechno jsme si hezky připravili a příště se tedy rovnou vrhneme na programování. Čeká nás Objektově Relačním Mapování nad databází a začneme pracovat na našem AppBundlu. ;)


 

 

Článek pro vás napsal Jindřich Máca
Avatar
Jak se ti líbí článek?
5 hlasů
Autor se věnuje převážně webovým technologiím, ale má velkou zálibu ve všem vědeckém, nejen ze světa IT. :-)
Aktivity (3)

 

 

Komentáře

Avatar
MArtin
Člen
Avatar
MArtin:3. srpna 15:41

Paci sa mi ten celkom dobry tweak cisteho projektu. .htacces do zlozky web je bezna vec, ale tie presuvacky niektorych zloziek, je celkom dobry napad a hlavne viac to zprehladnuje projekt od zaciatku namiesto kadeakych overridov alebo postupneho presuvania suborov. Jednoducho sa to presunie hned na zaciatku. Dobry napad!

 
Odpovědět  +2 3. srpna 15:41
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 1 zpráv z 1.