angryziberangryziber
56

Kotlin Jooby Svelte Template

screenshot of Kotlin Jooby Svelte Template
svelte
scss

App template using Kotlin + Jooby + Svelte + Selenide, including how to write tests and run everything in Docker

Github

Overview

Jooby/Kotlin + Svelte/Bootstrap app template is a relatively lightweight modern app template that combines the Jooby framework for server-side API development with Kotlin, and the Svelte framework for building the user interface on the client side. The template also utilizes Bootstrap for styling and layout. This template is no longer actively used for new projects, but the author recommends Klite framework for server-side development with Kotlin and Vite for client-side development with Svelte.

Features

  • Server API using Jooby
  • Postgres database integration (runnable using docker-compose)
  • Liquibase for database migration
  • Server unit tests using JUnit5 and Mockk
  • Repository integration tests run on the same database instance but a different schema
  • UI built with Svelte and Snowpack
  • TypeScript support for UI development
  • UI tests using Web Test Runner and TypeScript
  • End-to-end tests using Selenide to drive the actual browser backed by H2 database
  • Efficient Docker usage with cached layers and Gradle dependency downloads
  • Static server-side rendered pages using Pebble templates
  • Automatic TypeScript types from Kotlin classes in UI API
  • Minimal dependency injection (30 lines)
  • Minimal JDBC extensions instead of ORM and transaction management (100 lines)
  • Simple client-side router used in the root component
  • Three layers of testing: UI (client-side components), server-side (unit tests + repositories), and end-to-end using Selenide
  • Rollback of repository tests to avoid recreating the database each time
  • E2E tests perform login once and then use fake login for quicker navigation

Summary

Jooby/Kotlin + Svelte/Bootstrap app template is a lightweight and modern app template that combines the Jooby framework with Kotlin on the server-side and Svelte on the client-side. It offers features such as efficient Docker usage, internationalization support, and three layers of testing. The template also provides a simple client-side router and minimal dependency injection and JDBC extensions instead of using ORM and transaction management frameworks. Though no longer used for new projects, the template serves as a good reference for implementing similar app structures.

svelte
Svelte

Svelte is a modern front-end framework that compiles your code at build time, resulting in smaller and faster applications. It uses a reactive approach to update the DOM, allowing for high performance and a smoother user experience.

scss
SCSS

SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.