Skip to content
A very simple Karibu-DSL-based application
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
gradle/wrapper
src
.gitignore
.travis.yml
LICENSE
Procfile
README.md
build.gradle.kts
gradlew
gradlew.bat

README.md

Powered By Vaadin on Kotlin Build Status Heroku

Karibu-DSL Example App / Archetype

Template for a simple Kotlin-DSL application that only requires a Servlet 3.0 container to run. Just clone this repo and start experimenting!

Uses Karibu-DSL; for more information about the Karibu-DSL framework please see https://github.com/mvysny/karibu-dsl . For more information on Vaadin please see https://vaadin.com/docs/-/part/framework/tutorial.html

Getting Started

To quickly start the app, make sure that you have Java 8 JDK installed. Then, just type this into your terminal:

git clone https://github.com/mvysny/karibu-helloworld-application
cd karibu-helloworld-application
./gradlew build appRun

The app will be running on http://localhost:8080/

Since the build system is a Gradle file written in Kotlin, we suggest you use Intellij IDEA to edit the project files. The Community edition is enough to run the server via Gretty's ./gradlew appRun. The Ultimate edition will allow you to run the project in Tomcat - this is the recommended option for a real development.

Workflow

To compile the entire project, run ./gradlew.

To run the application, run ./gradlew appRun and open http://localhost:8080/ .

To produce a deployable production mode WAR:

  • change productionMode to true in the servlet class configuration (located in the MyUI.kt file)
  • run ./gradlew
  • You will find the WAR file in build/libs/karibu-helloworld-application.war

This will allow you to quickly start the example app and allow you to do some basic modifications.

Client-Side compilation

The project is using an automatically generated widgetset by default. When you add a dependency that needs client-side compilation, the Vaadin Gradle plugin will automatically generate it for you. Your own client-side customisations can be added into package "client".

Debugging client side code @todo revisit with Gradle

  • run "mvn vaadin:run-codeserver" on a separate console while the application is running
  • activate Super Dev Mode in the debug window of the application

Developing a theme using the runtime compiler

When developing the theme, Vaadin can be configured to compile the SASS based theme at runtime in the server. This way you can just modify the scss files in your IDE and reload the browser to see changes.

To use the runtime compilation, run ./gradlew clean appRun. Gretty will automatically pick up changes in theme files and Vaadin will automatically compile the theme on browser refresh. You will just have to give Gretty some time (one second) to register the change.

When using the runtime compiler, running the application in the "run" mode (rather than in "debug" mode) can speed up consecutive theme compilations significantly.

It is highly recommended to disable runtime compilation for production WAR files.

Development with Intellij IDEA Ultimate

The easiest way (and the recommended way) to develop Karibu-DSL-based web applications is to use Intellij IDEA Ultimate. It includes support for launching your project in any servlet container (Tomcat is recommended) and allows you to debug the code, modify the code and hot-redeploy the code into the running Tomcat instance, without having to restart Tomcat.

  1. First, download Tomcat and register it into your Intellij IDEA properly: https://www.jetbrains.com/help/idea/2017.1/defining-application-servers-in-intellij-idea.html
  2. Then just open this project in Intellij, simply by selecting File / Open... and click on the build.gradle file. When asked, select "Open as Project".
  3. You can then create a launch configuration which will launch this example app in Tomcat with Intellij: just scroll to the end of this tutorial: https://kotlinlang.org/docs/tutorials/httpservlets.html
  4. Start your newly created launch configuration in Debug mode. This way, you can modify the code and press Ctrl+F9 to hot-redeploy the code. This only redeploys java code though, to redeploy resources just press Ctrl+F10 and select "Update classes and resources"

Dissection of project files

Let's look at all files that this project is composed of, and what are the points where you'll add functionality:

Files Meaning
build.gradle.kts Gradle build tool configuration files. Gradle is used to compile your app, download all dependency jars and build a war file
gradlew, gradlew.bat, gradle/ Gradle runtime files, so that you can build your app from command-line simply by running ./gradlew, without having to download and install Gradle distribution yourself.
.travis.yml Configuration file for Travis-CI which tells Travis how to build the app. Travis watches your repo; it automatically builds your app and runs all the tests after every commit.
.gitignore Tells Git to ignore files that can be produced from your app's sources - be it files produced by Gradle, Intellij project files etc.
src/main/resources/ A bunch of static files not compiled by Kotlin in any way; see below for explanation.
logback.xml We're using Slf4j for logging and this is the configuration file for Slf4j
webapp/ static files provided as-is to the browser. See below for explanation
mytheme/ Vaadin Theme which is generally a bunch of SCSS files compiled to one large CSS. Read more at Creating and Using Themes
src/main/kotlin/ The main Kotlin sources of your web app. You'll be mostly editing files located in this folder.
MyUI.kt When Servlet Container (such as Tomcat) starts your app, it will show the components attached to the main UI class, or in this case, the MyUI class. The MyUIServlet defines which UI to use and where to map the application to.
MyUITest.kt Automatically run by Gradle to test your UI; see Karibu Testing for more information.

More Resources

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.