Real-time Kanban board with Vue.js and Hamoni Sync
A kanban board is a workflow visualization tool that enables you to optimize the flow of your work. In this post, I’ll show you how to build a real-time kanban board in Vue.
To follow along you’ll need to have some knowledge about Vue and its single file component. You’ll also need the following tools:
- Node.js & npm (follow this link to download an installer for your OS)
- Vue CLI. If you don’t have this, run
npm install -g vue-cli
in the command line to install it.
If you have no knowledge about Vue, you can read my previous post before continuing with this one.
Setup the project
We’ll set up the project using Vue CLI, which is a simple command line interface (CLI) for scaffolding Vue.js projects. Open the terminal and run vue init webpack-simple realtime-kanban-board
. You'll get some prompts, accept the default values by pressing enter and select y
when asked if you want to use saas
. Before running the command, you can change realtime-kanban-board
to your preferred project name. Once this is set up, run the following command to install the dependencies from the scaffolded template:
cd realtime-kanban-board
npm install