Nette Documentation Preview

syntax
Piszemy pierwszą aplikację!
***************************

.[perex]
Poznajmy wspólnie Nette Framework, tworząc jednocześnie prosty blog z komentarzami. Zróbmy to!

Po pierwszych dwóch rozdziałach będziesz miał swój własny działający blog i będziesz gotowy do publikowania swoich niesamowitych postów, chociaż funkcje będą dość mocno ograniczone po ukończeniu tych dwóch rozdziałów. Aby uczynić rzeczy milszymi dla Twoich użytkowników, powinieneś również przeczytać kolejne rozdziały i wciąż ulepszać swoją aplikację.

.[tip]
Ten samouczek zakłada, że ukończyłeś dokument [instalacyjny |nette:installation] i pomyślnie skonfigurowałeś swoje narzędzia. Zakłada również, że rozumiesz [programowanie obiektowe w PHP |nette:introduction-to-object-oriented-programming].

Proszę używać PHP 8.1 lub nowszego. Kompletną aplikację można znaleźć [na GitHubie |https://github.com/nette-examples/quickstart/tree/v4.0].


Strona powitalna .[#toc-the-welcome-page]
=========================================

Zacznijmy od utworzenia nowego projektu w katalogu `nette-blog`:

```shell
composer create-project nette/web-project nette-blog
```

W tej chwili powinna być uruchomiona strona powitalna projektu internetowego. Wypróbuj ją, otwierając przeglądarkę i przechodząc do następującego adresu URL:

```
http://localhost/nette-blog/www/
```

i zobaczyć stronę główną Nette Framework:

[* qs-welcome.webp .{url: http://localhost/nette-blog/www/} *]

Aplikacja działa i można rozpocząć edycję.

.[note]
Jeśli jest problem, [spróbuj tych kilku wskazówek |nette:troubleshooting#Nette-Is-Not-Working-White-Page-Is-Displayed].


Zawartość projektu internetowego .[#toc-web-project-s-content]
==============================================================

Projekt internetowy ma następującą strukturę:

/--pre
<b>nette-blog/</b>
├── <b>app/</b>              ← adresář s aplikací
│   ├── <b>Core/</b>         ← podstawowe niezbędne klasy
│   ├─── <b>UI/</b>          ← prezentery, szablony i inne.
│   │   └── <b>Home/</b>     ← Katalog prezenterów Home
│   └── <b>Bootstrap.php</b> ← zaváděcí třída Bootstrap
├── <b>bin/</b>              ← skripty spouštěné z příkazové řádky
├── <b>config/</b>           ← konfigurační soubory
├── <b>log/</b>              ← logování chyb
├── <b>temp/</b>             ← dočasné soubory, cache, …
├── <b>vendor/</b>           ← knihovny instalované Composerem
│   └── <b>autoload.php</b>  ← autoloading všech nainstalovaných balíčků
└── <b>www/</b>              ← veřejný adresář - jediný přístupný z prohlížeče
    └── <b>index.php</b>     ← prvotní soubor, kterým se aplikace spouští
\--

Katalog `www/` służy do przechowywania obrazów, plików JavaScript, arkuszy stylów CSS i innych publicznie dostępnych plików. Tylko ten katalog jest dostępny z Internetu, więc ustaw katalog główny swojej aplikacji, aby wskazywał właśnie na niego (możesz to ustawić w konfiguracji Apache'a lub nginxa, ale zróbmy to później, teraz nie jest to ważne).

Najważniejszym dla nas folderem jest `app/`. Znajdziemy tu plik `Bootstrap.php`, który zawiera klasę służącą do załadowania całego frameworka i skonfigurowania aplikacji. Tutaj włącza się [autoloading |robot-loader:], ustawia się [debugger |tracy:] i [trasy |application:routing].


Czyszczenie .[#toc-cleanup]
===========================

Web Project zawiera splash page, który usuwamy zanim zaczniemy cokolwiek programować. Nie krępuj się więc zastąpić zawartości strony `app/UI/Home/default.latte` słowami "Hello world!".


[* qs-hello.webp .{url:-} *]


Tracy (debugger) .[#toc-tracy-debugger]
=======================================

Niezwykle ważnym narzędziem programistycznym jest [debugger Tracy |tracy:]. Spróbuj wywołać błąd w `app/UI/Home/HomePresenter.php` (np. Usuwając nawias w definicji klasy HomePresenter) i zobacz, co się stanie. Pojawi się strona z powiadomieniem, która wyraźnie opisuje błąd.

[* qs-tracy.avif .{url:-}(debugger screen) *]

Tracy pomoże nam ogromnie, gdy będziemy szukać błędów w aplikacji. Zwróć też uwagę na pływający w prawym dolnym rogu ekranu pasek Tracy Bar, który zawiera informacje z uruchomionej aplikacji.

[* qs-tracybar.webp .{url:-} *]

Oczywiście w trybie produkcyjnym Tracy jest wyłączona i nie wyświetla żadnych wrażliwych informacji. W tym przypadku wszystkie błędy są przechowywane w folderze `log/` Spróbujmy. W pliku `app/Bootstrap.php` odkomentuj następującą linię i zmień parametr wywołania na `false`, tak aby kod wyglądał jak poniżej:

```php .{file:app/Bootstrap.php}
...
$configurator->setDebugMode(false);
$configurator->enableTracy($appDir . '/log');
...
```

Po odświeżeniu strony nie zobaczymy już Tracy. Zamiast tego pojawi się przyjazny dla użytkownika komunikat:

[* qs-fatal.webp .{url:-}(error screen) *]

Zajrzyjmy teraz do katalogu `log/`. Tutaj (w pliku `exception.log`) znajdziemy zalogowany błąd, a także znaną nam stronę z komunikatem o błędzie (zapisaną jako plik HTML o nazwie zaczynającej się od `exception-`).

Ponownie skomentuj linię `// $configurator->setDebugMode(false);`. Tracy automatycznie włączy tryb deweloperski na localhost i wyłączy go wszędzie indziej.

Możemy naprawić stworzony przez nas błąd i kontynuować pisanie aplikacji.


Wyślij podziękowania .[#toc-send-thanks]
========================================

Pokażemy Ci sztuczkę, która pozwoli Ci zadowolić autorów open source. Prosty sposób na rozgwiazdkowanie bibliotek, z których korzysta twój projekt na GitHubie. Po prostu zacznij:

```shell
composer thanks
```

Spróbuj!

{{priority: -1}}
{{sitename: Nette Quickstart}}

Piszemy pierwszą aplikację!

Poznajmy wspólnie Nette Framework, tworząc jednocześnie prosty blog z komentarzami. Zróbmy to!

Po pierwszych dwóch rozdziałach będziesz miał swój własny działający blog i będziesz gotowy do publikowania swoich niesamowitych postów, chociaż funkcje będą dość mocno ograniczone po ukończeniu tych dwóch rozdziałów. Aby uczynić rzeczy milszymi dla Twoich użytkowników, powinieneś również przeczytać kolejne rozdziały i wciąż ulepszać swoją aplikację.

Ten samouczek zakłada, że ukończyłeś dokument instalacyjny i pomyślnie skonfigurowałeś swoje narzędzia. Zakłada również, że rozumiesz programowanie obiektowe w PHP.

Proszę używać PHP 8.1 lub nowszego. Kompletną aplikację można znaleźć na GitHubie.

Strona powitalna

Zacznijmy od utworzenia nowego projektu w katalogu nette-blog:

composer create-project nette/web-project nette-blog

W tej chwili powinna być uruchomiona strona powitalna projektu internetowego. Wypróbuj ją, otwierając przeglądarkę i przechodząc do następującego adresu URL:

http://localhost/nette-blog/www/

i zobaczyć stronę główną Nette Framework:

Aplikacja działa i można rozpocząć edycję.

Jeśli jest problem, spróbuj tych kilku wskazówek.

Zawartość projektu internetowego

Projekt internetowy ma następującą strukturę:

nette-blog/
├── app/              ← adresář s aplikací
│   ├── Core/         ← podstawowe niezbędne klasy
│   ├─── UI/          ← prezentery, szablony i inne.
│   │   └── Home/     ← Katalog prezenterów Home
│   └── Bootstrap.php ← zaváděcí třída Bootstrap
├── bin/              ← skripty spouštěné z příkazové řádky
├── config/           ← konfigurační soubory
├── log/              ← logování chyb
├── temp/             ← dočasné soubory, cache, …
├── vendor/           ← knihovny instalované Composerem
│   └── autoload.php  ← autoloading všech nainstalovaných balíčků
└── www/              ← veřejný adresář - jediný přístupný z prohlížeče
    └── index.php     ← prvotní soubor, kterým se aplikace spouští

Katalog www/ służy do przechowywania obrazów, plików JavaScript, arkuszy stylów CSS i innych publicznie dostępnych plików. Tylko ten katalog jest dostępny z Internetu, więc ustaw katalog główny swojej aplikacji, aby wskazywał właśnie na niego (możesz to ustawić w konfiguracji Apache'a lub nginxa, ale zróbmy to później, teraz nie jest to ważne).

Najważniejszym dla nas folderem jest app/. Znajdziemy tu plik Bootstrap.php, który zawiera klasę służącą do załadowania całego frameworka i skonfigurowania aplikacji. Tutaj włącza się autoloading, ustawia się debuggertrasy.

Czyszczenie

Web Project zawiera splash page, który usuwamy zanim zaczniemy cokolwiek programować. Nie krępuj się więc zastąpić zawartości strony app/UI/Home/default.latte słowami „Hello world!“.

Tracy (debugger)

Niezwykle ważnym narzędziem programistycznym jest debugger Tracy. Spróbuj wywołać błąd w app/UI/Home/HomePresenter.php (np. Usuwając nawias w definicji klasy HomePresenter) i zobacz, co się stanie. Pojawi się strona z powiadomieniem, która wyraźnie opisuje błąd.

debugger screen

Tracy pomoże nam ogromnie, gdy będziemy szukać błędów w aplikacji. Zwróć też uwagę na pływający w prawym dolnym rogu ekranu pasek Tracy Bar, który zawiera informacje z uruchomionej aplikacji.

Oczywiście w trybie produkcyjnym Tracy jest wyłączona i nie wyświetla żadnych wrażliwych informacji. W tym przypadku wszystkie błędy są przechowywane w folderze log/ Spróbujmy. W pliku app/Bootstrap.php odkomentuj następującą linię i zmień parametr wywołania na false, tak aby kod wyglądał jak poniżej:

...
$configurator->setDebugMode(false);
$configurator->enableTracy($appDir . '/log');
...

Po odświeżeniu strony nie zobaczymy już Tracy. Zamiast tego pojawi się przyjazny dla użytkownika komunikat:

error screen

Zajrzyjmy teraz do katalogu log/. Tutaj (w pliku exception.log) znajdziemy zalogowany błąd, a także znaną nam stronę z komunikatem o błędzie (zapisaną jako plik HTML o nazwie zaczynającej się od exception-).

Ponownie skomentuj linię // $configurator->setDebugMode(false);. Tracy automatycznie włączy tryb deweloperski na localhost i wyłączy go wszędzie indziej.

Możemy naprawić stworzony przez nas błąd i kontynuować pisanie aplikacji.

Wyślij podziękowania

Pokażemy Ci sztuczkę, która pozwoli Ci zadowolić autorów open source. Prosty sposób na rozgwiazdkowanie bibliotek, z których korzysta twój projekt na GitHubie. Po prostu zacznij:

composer thanks

Spróbuj!