Skip to content

derekyle/Scheme

 
 

Repository files navigation

Scheme

Scheme is a clone of Asana, the popular project management app. Scheme was made with Ruby on Rails and React.js.

Screenshots

Registration Page

registration_page

Task Detail

task_detail

Project Drawer

project_drawer

Invite Modal

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

About

an Asana clone on Rails with React/Flux

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 95.2%
  • Ruby 2.4%
  • CSS 2.0%
  • Other 0.4%