Monthly Archives: April 2016

Basic Structure and Styling

I’m trying out a different approach with this project. Most of the time I build the back-end first, with functional API’s and real working data before beginning the UI. As a result, changes in the requirements of the UI sometimes make it necessary to modify the back-end for overlooked features. As a result, I want to try to build a semi-static UI with dummy data, then see what data requirements can minimally fulfill the UI.

I’ve been a little busy these past few days with other projects, so I’ve only been able to log 4.5 hours so far. I’ve marked an approximate 8% completion for the minimal front-end code so far, which gives me 56.25hr remaining for the front-end. This estimate will become more accurate over time, but seeing that this placeholder UI is essentially the wireframe and requirements list for the project, these numbers might be useless for now!

Here’s how it looks so far:


I’m using Unsplash for the placeholder images, which is nice since they’re random (refreshing!). It looks like Product Hunt, well, because my main design inspiration for now is Product Hunt. I’ll worry about branding and individuality later after I get to the fun NLP parts of the project.

I’ve also set up a basic Express server, which I’ll populate with placeholder data as the outputs. That way I can populate the placeholders with the REST API and have a halfway functional front-end by the end of this initial phase.

I’m trying out a documentation schedule for a new project I’m starting called NewsMelon. It will be a combination of information retrieval and text summarization. That is, NewsMelon will find multiple news articles about a story and provide a summary of that information. The goal will be to build an MVP within the next  two weeks, using a Node based webserver with Flask for the NLP and React/Redux for the front-end. I haven’t built anything major with Node.js yet, so I’m hoping I’ll get acquainted with some useful packages and Express.js.

The tentative tech stack is listed below:


  • Node.js running Express.js as the static file server / CRUD REST API
  • MongoDB as the main DB ( to experiment with a JSON based data storage system )
  • Python Flask as an endpoint to access NLP functions
  • NLP: NLTK/Goose Extractor/Newspaper ( to extract article data from news article URLs )
  • LevelDB? via LevelUP for full-text-search on the Node webserver


  • React: UI
  • Material-UI: Basic Material Design style guide with React components ( for dev speed )
  • Redux: front-end state management ( may not use if the application is simple enough )
  • SASS: for stylin’

+ webpack for building/npm for package management

With an ambitious goal of 2 weeks ( maybe 6 weeks to be realistic ), I’ll try to post major updates for insights I gain and issues I come across every few days.