Imitation is the sincerest form of flattery.
This is a clone of the Todoist web-app.
Here's how it looks:
Visit a live instance to check it out!
You can also deploy your own copy to heroku:
This is a standard Rails app, using webpacker to manage JS modules.
You'll need Ruby, bundler, yarn and Postgres installed. All the following steps are to be executed in the root directory of this repository.
- Run
bundle install
to install the required Rubygems - Run
yarn install
to install the required NPM packages - Run
createdb tudu_development
to create a development database - Run
rake db:migrate db:seed
to create database schema and sample records - Run
rails s
to spin up the Rails dev server - Run
./bin/webpack-dev-server
to spin up the webpack dev server
Hit localhost:3000 and you should be ready to go!
The backend is written in Ruby + Rails, and the frontend in Typescript + Vue.js.
A few interesting files to look at:
- Tasks
- Creating tasks
- Editing tasks
- Completing tasks
- Re-ordering tasks
- Nested/indented tasks
- Projects
- Switching between project views
- Creating projects
- Editing projects
- Re-ordering projects
- Deleting projects
- Color picker
- Labels
- Creating labels
- Editing labels
- Viewing tasks for a label
- Rendering labels in task-item
- Assigning labels via task-editor
- Priorities
- Due dates
- Filters
- Karma
- Keyboard Shortcuts
- Task List
-
a
to open editor at bottom of list -
A
to open editor at top of list
-
- Task Editor
-
Enter
to create new task and open editor below -
Esc
to cancel -
Shift + Enter
to save and create new one below -
Ctrl + Enter
to save and create new one above
-
- Task List