Kanban Board App

Deployed at https://kanban-jack.up.railway.app

Description

This is a simple web application allowing the user to create Kanban boards, inspired by tools like Trello. The web app allows the user to #. After logging in, they can create and delete boards and for each one configure a set of columns and add cards to it. Cards have a title and a description, and it is possible to drag & drop them between columns. The state of the user’s board persists between sessions.

Technology Stack

• SvelteKit / Svelte - Application framework
• TailwindCSS - CSS framework
• TypeScript - Programming language
• Prisma - ORM
• PostgreSQL - Database
• Auth.js - Authentication library
• Zod - Schema validation library
• Railway - Deployment platform

Installation and Usage

Clone the repository

git clone https://github.com/therosbif/kanban
cd kanban

Create a .env file in the project root directory and add the required environment variables

a .env.example file is provided as a reference

Local

Install dependencies

pnpm install

Run the following command to initialize a fresh database

pnpm prisma db push

Start the development server

npm run dev

Open your web browser and navigate to http://localhost:5173 to use the application.

Docker

Dockerfile and docker-compose.yml files are provided in the docker directory.

cp docker/* ./
cp docker/.* ./
docker-compose up
pnpm prisma db push

Dockerfile has to be put in docker directory to avoid interference with Railway deployment.

Available Scripts

In the project directory, you can run:

• npm run dev: Runs the app in development mode.
• npm run build: Builds the app for production.
• npm run preview: Serves the production build for preview.
• npm run check: Checks the project for type and lint errors.
• npm run check:watch: Watches the project for type and lint errors.
• npm run lint: Lints the project files.
• npm run format: Formats the project files.
• npm run prepare: Generates Prisma Client.

Dependencies

The following dependencies were used in this project:

• @auth/sveltekit: SvelteKit adapter for authentication library.
• prisma @prisma/client: Prisma ORM for database access.
• @steeze-ui/svelte-icon @steeze-ui/heroicons: Icon library.
• @sveltejs/adapter-node: Svelte adapter for Node.js server.
• @sveltejs/adapter-vercel: Svelte adapter for Vercel platform.
• nodemailer: Node.js module for sending emails.
• zod: TypeScript-first schema validation library.
• svelte-dnd-action: Drag & drop library for Svelte.

Known Issues

• Email login is not working in production due to the fact that the SMTP server is not whitelisted.