Task Listing Refresh

  • CoffeeScript
  • Rails
  • RequireJS
  • Sass
  • Webpack
(4/16-4/16)
  • Architecting
  • Backend
  • Frontend
  • Full-Stack
  • SPAs

Summary

Reskinned and ported most-trafficked page from RequireJS to Webpack.

Achievements

  • advocated for the adoption of Webpack to replace RequireJS
  • ported from RequireJS to Webpack
  • achieved near-pixel-perfect re-skinning of page
  • paid down tech debt as RequireJS is phased out of our stack
  • architected a Webpack implementation paradigm while also involving junior engineers in the discussion

Overview

In a unique position given my previous experience with the UX, I took an opportunity when tasked by Product and Design to not only reskin the Listing but also to upgrade it.

Given that no one besides me really knew how RequireJS was working in the application and given its falling-out-of-favor in the general community as a module-loading solution, it was time to upgrade it to Webpack.

Here's what the Task Listing looked like before:

Before

Here's the mock from Design:

Mock

In chronological order, here's what I did:

  1. Upgraded DataTables from 1.9 to 1.10
  2. Refactored JavaScript towards more of an OO paradigm
  3. Applied new skin
  4. Ported JavaScript for RequireJS to CoffeeScript for Webpack
  5. Deployed

...and here's what I delievered:

with modal
without modal


anthony at bluxomelabs dot com