Site

This repository contains the code for our site, https://kotlindiscord.com (which has not yet launched).

Here's a list of the main technologies we're using:

• Fomantic UI (Community fork of Semantic UI)
• Kotlin (of course)
• KTor
• Pebble Templates
• PostgreSQL (via Exposed and Harmonica)

Setting Up Your Environment

In order to work on this project, we require that you have the following things installed:

• OpenJDK 11 or later
• NodeJS 12 or later with NPM

We also recommend the use of IntelliJ IDEA. The instructions below will assume that you're using IDEA, so remember to adjust if you're using a different editor.

Installing Dependencies

In order to make use of Fomantic UI (The CSS framework we've used here), you'll need to install it. Simply run npm i after cloning the repository, and Fomantic UI will be installed to src/semantic and compiled into build/semantic.

If you clear your build directory (or modified something in src/semantic), you can rebuild Fomantic by opening a terminal in src/semantic and running npx gulp build.

We are currently not customising Fomantic UI, so we added the src/semantic directory to the .gitignore. This may change in the future.

Setting Up IDEA

• Install the Pebble plugin. You'll need this to work with the Pebble templates we use in this project.
• Open the project in IDEA and allow it to import the build.gradle.
• Set up Pebble templates:
  • Open the Settings window from the File menu, expand Languages & Frameworks in the sidebar and navigate to Template Data Languages.
  • Click the dropdown next to Project Language, and select Pebble.
  • Click the + on the right-hand side of the window and select src/main/resources/templates.
  • Select the Language dropdown for the entry you just created, and change it to HTML.
  • Repeat for src/main/resources/templates/css, selecting CSS for the language.

Running the Project

To run the project, simply use the run Gradle task. You'll need to set the following environment variables, or the application will fail to start - feel free to leave their values empty if you're not working with them, though.

• DB_PASSWORD / DB_URL / DB_USER: Database connection details. Assumes postgres.
• DISCORD_CLIENT_ID / DISCORD_CLIENT_SECRET: These are used for Discord OAuth logins and correspond with the relevant settings in the Discord developer area.
• API_KEY: Used to authenticate requests against the API.

Tips

• When working with templates, you can use {{ role("Role") }} to insert a span containing the given role name, coloured appropriately to match the role colour on Discord.

  If this isn't flexible enough for you, you can use the classes defined in generated/roles.css.