Lekce 1 - Wicket - Seznámení a nastavení
Apache Wicket je populární framework pro tvorbu webů v jazyce Java. Na českém internetu jej používají například společnosti Vodafone, Air Bank a další. Než se pustíme do tvorby webu s použitím tohoto frameworku, budeme potřebovat stáhnout a nastavit další software.
Obsah tutoriálu:
1. díl
- stažení a spuštění vývojového prostředí Eclipse IDE
- stažení, rozbalení a spuštění servletového kontejneru Apache Tomcat
- nastavení Apache Tomcat v Eclipse
- stažení a nastavení Maven (nástroj pro správu, řízení a automatizaci buildů aplikací)
- vygenerování projektu pomocí Maven
2. díl
- krátké seznámení s Wicketem
- úpravy vygenerovaného projektu
3. - 7. díl
- vytvoření nového projektu
- layout
- práce s odkazy a obrázky
- nastavení titulku okna v prohlížeči
- kaskádové styly
- anglická a česká verze popisků webu (lokalizace)
- modely
- formulář a ukládání do databáze
8. - 12. díl
- vkládání JavaScriptu a CSS
- validace formuláře
- přihlašování
- sezení (session)
- autentifikace
Eclipse IDE
Začneme stažením a nastavením vývojového prostředí. V rámci tohoto tutoriálu budeme používat Eclipse IDE, které si můžete stáhnout zde.
Z uvedeného odkazu si stáhněte Eclipse IDE for Java EE Developers. Stažený .zip soubor si rozbalte do složky (např. Eclipse). V rozbaleném adresáři nalezněte eclipse.exe a program spusťte dvojklikem.
Při prvním spuštění se vás Eclipse zeptá na název a umístění workspace (pracovní plochy). Zadejte tedy název (např. Wicket) a umístění, kde v počítači chcete mít svůj workspace uložen.
![Apache Wicket](images/2798/wicket01/01.png)
Když zavřete úvodní záložku, objeví se standardní rozložení pracovaní plochy v Eclipse (může se mírně lišit).
![Apache Wicket](images/2798/wicket01/02.png)
Tomcat
Dále budeme potřebovat aplikační server (servletový kontejner), ve kterém poběží naše webová aplikace. Možností je více, ale my budeme používat Apache Tomcat, který si můžete stáhnout zde. V tomto tutoriálu budeme používat Tomcat ve verzi 7.0.
Stažený .zip soubor rozbalte. V adresáři {adresář, kde byl .zip
rozbalen}/apache-tomcat-{verze}/bin/ spusťte startup.bat (pro Windows) |
startup.sh (pro Linux). Nyní si otevřete prohlížeč a do adresního řádku
napište http://localhost:8080/
. Pokud vše
proběhlo v pořádku, uvidíte následující obrazovku.
![Apache Wicket](images/2798/wicket01/03.png)
Tomcat server vypnete spuštěním shutdown.bat (shutdown.sh v Linuxu). Jak je vidět na následujícím snímku, localhost:8080 je nedostupný (server je vypnutý).
![Apache Wicket](images/2798/wicket01/04.png)
Tomcat v Eclipse
Tomcat je možné spouštět přímo z Eclipse. Spusťte si Eclipsu. Otevřete si "Server View" (Windows -> Show View -> Servers). V okně "Servers" -> pravým tlačítkem -> New -> Server. V okně "Select the server type" rozbalte Apache a vyberte "Tomcat v7.0 Server", můžete nechat defaultní nastavení -> Next -> Browse, označte složku s rozbalenými soubory Tomcatu -> Next -> Finish.
![Apache Wicket](images/2798/wicket01/05.png)
![Apache Wicket](images/2798/wicket01/06.png)
![Apache Wicket](images/2798/wicket01/07.png)
![Apache Wicket](images/2798/wicket01/08.png)
![Apache Wicket](images/2798/wicket01/09.png)
Maven
Maven je Java framework, který pomáhá programátorům pracovat s projekty (vytváření, sestavování, nasazování,…)
V případě, že to myslíte s programováním v Javě vážně, Maven určitě znáte. Dobrou zprávou je to, že zvládnutí Mavenu na základní uživatelskou úroveň není nijak složité. Je to nástroj, který má programátorům práci usnadňovat a ne ji přidávat. A to také dělá.
Nejdříve si zjistěte, zda Maven již nemáte nainstalován. V command line
(Windows) napište mvn -v
.
Ve Windows spustíte command line následujícím způsobem. Start a do
políčka pro vyhledávání programů napište cmd
. Vyberte
program cmd.exe a spusťte jej.
Pokud získáte podobný výpis:
Apache Maven 3.1.0 (893ca28a1da9d5f51ac03827af98bb730128f9f2; 2013-06-28 04:15:32+0200) Maven home: D:\Rozbalene\apache-maven-3.1.0 Java version: 1.7.0_55, vendor: Oracle Corporation Java home: C:\Program Files\Java\jdk1.7.0_55\jre Default locale: en_US, platform encoding: Cp1250 OS name: "windows 7", version: "6.1", arch: "amd64", family: "windows"
Maven máte na svém počítači nainstalovaný.
Pokud Maven na svém počítači nemáte, můžete si jej stáhnout zde. Rozbalte stažený archív do vámi zvolené složky. V ní se vytvoří složka apache-maven-{verze}.
Nyní nastavte proměnné prostředí. Ve Windows 7 je postup následující:
Start -> Computer -> pravým tlačítkem na Computer -> Properties
-> Advanced system settings -> Environment Variables. Přidejte novou
proměnnou M2_HOME s cestou k adresáři s Mavenem. Tuto novou proměnnou
přidejte do cesty (Path) a to tak, že označíte proměnnou path, stisknete
"Edit" a na konec řádku přidáte %M2_HOME%\bin;
.
Dále by jste se měli přesvědčit, že máte nastavenou proměnnou s názvem JAVA_HOME, která by měla odkazovat na umístění Java JDK (např. C:\Program Files\Java\jdk1.7.0_55), a že je tato proměnná také v path (%JAVA_HOME%\bin;).
Pokud máte vše nastaveno otevřete si nový command line tool a napište
mvn -v
. Nyní byste měli dostat výpis uvedený výše.
Vygenerování projektu pomocí Maven
V command line (cmd.exe) vytvořte novou složku (mkdir nazev_nove_slozky). Přepněte se do nově vytvořené složky (cd nazev_nove_slozky). Na adrese https://wicket.apache.org/…ckstart.html nastavte parametry nového projektu (GroupId: cz.mujweb | ArtifactId: MujWebZakladni | Version: ponechat | Server: Any but Wild Fly), okopírujte vygenerovanou část z textové oblasti "Command Line", vložte ji do command line na vlastním počítači a stiskněte enter. Tím se vygeneruje maven projekt dle nastavení.
GroupId: názvy balíčků (package) v projektu ArtifacktId: název projektu
![Apache Wicket](images/2798/wicket01/10.png)
Ve zvoleném adresáři se vygenerovala následující adresářová struktura
![Apache Wicket](images/2798/wicket01/11.png)
Importování vygenerovaného projektu do Eclipse
Vygenerovaný projekt je nyní potřeba importovat do vývojového prostředí. Otevřete Elicpse IDE, File -> Import -> Maven, Existing Maven Project -> Next -> Browse -> označte adresář s vygenerovaným Maven projektem -> označte projekt, který chcete importovat (v případě, že se v daném adresáři nachází více projektů) -> finish.
![Apache Wicket](images/2798/wicket01/12.png)
![Apache Wicket](images/2798/wicket01/13.png)
![Apache Wicket](images/2798/wicket01/14.png)
Nasazení projektu na Tomcat server z Eclipse IDE
Z předchozí části byste měli mít přidaný Tomcat server do prostředí Eclipse (záložka "Servers"). Díky tomuto nastavení je možné nasadit (deploy) projekt na server přímo z prostředí Eclipse. Nejdříve je potřeba nastavit, který projekt (z Eclipse workspace) se má na server nasadit. Kromě vlastního projektu, byste v „Project Explorer" měli též vidět projekt "Servers", který obsahuje vaše nastavení pro server.
Klikněte pravým tlačítkem na server uvedený v záložce "Servers" -> Add and Remove -> přidejte projekt do části "Configured" -> finish.
![Apache Wicket](images/2798/wicket01/15.png)
![Apache Wicket](images/2798/wicket01/16.png)
Projekt nyní spustíte (nasadíte) následujícím způsobem. Klikněte pravým tlačítkem na Tomcat server v záložce "Servers" -> Start.
![Apache Wicket](images/2798/wicket01/17.png)
![Apache Wicket](images/2798/wicket01/18.png)
K nasazenému projektu se můžete připojit na adrese http://localhost:8080/MujWebZakladni/.
![Apache Wicket](images/2798/wicket01/19.png)
Gratuluji. Právě jste si vytvořili, nasadili a spustili svůj první web ve Wicketu.
Zapnutí serveru:
- Pravým tlačítkem a volba Start.
- Klávesovou zkratkou Ctrl + Alt + R (stejné pro restart).
- Kliknutí na ikonu play (zelená s bílou šipkou do prava).
Vypnutí serveru
- Stejným způsobem, jakým se zapínal. Pouze se vybere volba Stop.
- Klávesovou zkratkou Ctrl + Alt + S.
- Kliknutím na ikonu s červeným čtvercem.
- Vypnutím (restartováním) Eclipse IDE.
V další lekci, Wicket - Úprava vygenerovaného projektu, si řekneme něco více o frameworku WIcket a web si upravíme.