# ZK Beginner Trainning - MVC * Learn by Example * Start from Example Project * Declaring Domain Class * Building User Interface * Implementing UI Logic * Approach Comparison --- # Learn by the Example * 2 features: search and view details <aside class="notes"> demo application features </aside> --- # Start from Example Project * [setup intellij](https://www.zkoss.org/wiki/ZK_Installation_Guide/Quick_Start/Create_and_Run_Your_First_ZK_Application_with_IntelliJ_and_ZKIdea) * [maven setup](https://www.zkoss.org/wiki/ZK%20Installation%20Guide/Maven%20Setup) * [developement best-practice](https://www.zkoss.org/wiki/ZK_Developer%27s_Reference/Development-time_Best_Practices) * create from an archetype * clone and import from https://github.com/zkoss-demo/gettingStarted * intellij will automatically update archetype from specified repository <aside class="notes"> </aside> --- # Declaring Domain Class --- # Building User Interface * 3 areas * tag, attribute, setter-getter * component usage and document <aside class="notes"> * split the screen into 2 parts horizontally<br/> * create a new zul, put searchMvc.zul to another screen </aside> --- # Implementing UI Logic - Overview ## Steps 1. create a controller 2. apply the controller 3. adding event listeners ## The Flow to Handle a User Action --- # Implementing UI Logic ## prototype with zscript ## search cars ## display car details --- # Approach Comparison --- # Q & A * full source code at https://github.com/zkoss-demo/gettingStarted