wojtek0123 / kanban

My first angular app to train how to build angular apps. Kanban is a task manager for teams

KanbanAngular

Kanban is an app to manage tasks in a team. For now owner of project / board cannot add more person to board but I am thinking how to implement this and websocket to everyone has up-to-date version of board.

• Features
• Live
• Built with
• Screenshots
• To do
• How to run on local machine
• What I learned

User can:

• register / login
• add, remove and update project, board, column, task and subtask
• drag and drop task between columns
• drag and drop columns (change of order)
• change color of dots next to column name and tag background
• filter tasks by tags or title
• sort tasks by title, updated and created time

Live demo

Warning! First load an app after login can last up to 2 minutes.

This is fault of render.com node js app hosting. This problem isn't appear on localhost.

Built with:

• angular
• nodejs
• supabase
• graphql
• prisma
• apollo server

Screenshots

To do:

• implement the ability to change the order of columns
• implement websocket (subscription)
• add more person to one board
• add additionally views of tasks (table and kanban)
• write tests for components
• write tests for pipes
• write tests for services
• write tests for quards

What I learned:

• reactive form
• how rxjs works and how to use some of the rxjs operators
• how to create more reactive code
• components should be divide on smart and dumb

How to run on local machine:

git clone https://github.com/wojtek0123/kanban.git
cd kanban
cd client
npm install
npm run serve

create new terminal and go to kanban folder

cd server
npm install
npm run dev

Client and dev server must go simultaneously. Dev servers:

• app is available on localhost:4200
• server is available on localhost:4000