README

This is a sample project / template to give you a head start on your project using a lot of pre-configured tools and services.

Basically it is based on

• React 19

• React Router v7 (RR) in framework mode

• Postgres Database

• kysely (SQL query builder)

• Mantine React Table (Table component)

• remix-hook-form / react-hook-form (Form handling)

And some other tools and services. Details you will find (or later should find, if documented) in the antora documentation.

Cloning

You can simply clone this repository and remove the .git directory

git clone https://github.com/rattermeyer/rr-mantine-template
cd rr-mantine-template
rm -rf .git

Or use a tool like tiged

tiged rattermeyer/rr-mantine-template

Pre-requisites

• Docker

• Docker Compose

• devbox (optional, but recommended, to have a consistent development environment)

Install devbox

Using devbox is the easiest way to get started. Follow the instructions on the website to install devbox.

And then run the following command to install the project

devbox shell

This makes the necessary tools available in the CLI.

Create a .env file

Create a .env file in the root of the project. Use the env.sample file as a template.

cp env.sample .env

Edit your .env file and set the values for the environment variables. This should match your environment. Normally, it should only be necessary to change HOST_IP to the IP address of your host machine or of your docker bridge interface. This is used for example by the caddy reverse proxy to forward requests to the started RR application.

Creating TLS certificates

We are using mkcert to create locally trusted TLS certificates.

To create the TLS certificates, run the following command:

mkcert -install
mkcert "*.127.0.0.1.nip.io"

This will create the certificates in the current directory.

Move certificates to the correct location

Move the certificates to the correct location:

mv *io*.pem docker-compose/caddy/certs

Start infrastructure

To start the infrastructure, run the following command:

docker-compose up -d

You should check if all services are running:

docker-compose ps --services

And it should return:

pgbouncer
caddy
dex
ldap
postgres
smtp

Migrate the database

Although the postgres init scripts already set up the "chinook" database, we also create additional tables for the application.

For migration, we use Liquibase

To migrate the database, run the following command:

cd backend
./gradlew :db-migrations:update

Install the frontend dependencies

To install the frontend dependencies, run the following command:

cd frontend
yarn install

As we are using Yarn PnP, it is not really downloading anything.

Start the frontend

To start the frontend, run the following command:

yarn dev

Access the application

You can now access the application at http://localhost:5173

Access the customers pages

You can now access the customers pages at http://localhost:5173/customers

For authentication you can use the following credentials (via ldap) :

Username	Password
[email protected]	changeme
[email protected]	changeme

Now you can start looking around or change anything to your needs.

Build additional documentation

The additional project documentation is built with Antora.

To build the documentation, run the following command:

cd docs
docker-compose up -d
./gradlew antora

After the build, you can open the documentation by openining the index.html, on Mac

open build/site/docs/index.html