Portfolio · Mar 2017

CMS + D3.js Visualization

D3-gif



Technology

  • Keystone.js
  • D3.js
  • Express
  • Node.js
  • MongoDB


Concept A · A Tool to Easily Update Content

I was inspired by keystone.js and its ability to create easy to use CMS systems. I've developed CMS systems using keystone.js professionally and after much success decided to implement it in my own portfolio website.



Images can be uploaded and automatically become hosted on Cloudinary.com, a great option to ease the burden on loading for your pages.



You can work on a "post" and save it in Draft form, or publish it straight away. This is also great for blogs and other content-heavy websites. The CMS also allows non-tech people to contribute to the contenting process.



The end result is this entire website.



cms-intro

cms-all-posts

cms-post-page

cms-source-code

cms-cloudinary



Concept B · A Fun, Interactive D3.js Visualization

Adapted from bl.ocks.org, I set up a customized, interactive D3.js visualization on the homepage.

D3-gif



Overview of D3.js code:

D3-1 D3-2 D3-3