Scheme

Scheme is a clone of Asana, the popular project management app. Scheme was made with Ruby on Rails and React.js. Check it out at schemeapp.com.

Screenshots

Registration Page

Task Detail

Project Drawer

Invite Modal

Technical Details

Scheme users can prioritize tasks by dragging and dropping them into the desired order.

Task order is maintained in a linked-list data structure. Each task knows the IDs of its next and previous tasks, and every project knows its last_task_id. To assemble the tasks in the correct order and avoid n+1 queries, Scheme retrieves an unordered group of tasks within a project, hashes them by ID, and then references the next_task_ids to create an array of tasks in the user’s designated order.

var sortTasks = function (tasksObj, lastTaskId) {
  // start by inserting last task into ordered array
  var taskArr = [tasksObj[lastTaskId]];
  // then insert the previous task, until !previous_task_id
  while (taskArr[0].previous_task_id) {
    taskArr.unshift(tasksObj[taskArr[0].previous_task_id]);
  }

  return taskArr;
};

Thanks to the linked-list structure, re-ordering tasks within a project is an O(1) time operation, and requires updating only 3-5 task records, no matter how many tasks a project includes.

Features

Add / delete / complete tasks
Assign tasks and set deadlines
Create projects to organize tasks
Invite other users to join your "team"
Drag-n-drop ordering of tasks
Drag-n-drop uploading of profile pictures
Comment on tasks
See new tasks and comments from other users in realtime

Technologies Used

React.js
Flux
Ruby on Rails
JSON API
PostgreSQL
Pusher
Sendgrid
Heroku

Original Design Docs

alexlevin/Scheme