Skip to content
Sample Processing Sketch using JSON data from ExpressJS app
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

JSON & Processing

Installation instructions at bottom

Processing Sketch

Located in the processing_json folder. Requires the JSON-Processing library

Download the library and put it in your Processing Library ~/Documents/Processing/libraries. Create the 'libraries' directory if it does not already exist. Restart Processing.

Open the procession_json.pde inside Processing application.

ExpressJS Web App Routes

  • / - displays web page that redisplays JSON data in form every 5 seconds
  • /reset - will reset the JSON data
  • /json - the main JSON data url

Updating a circle

Provide the circle's embeded doc ID along with color, x, y and size


Create a new circle

Just provide the x and y positions. Defaults will be provided for size and color




Web page form

Uses Hogan template rendering engine

Running the code

Once you have the code downloaded to your computer

Configure MONGOLAB variable

Add your MONGOLAB_URI connection string to your .env file


Copy an existing .env file into this directory.

Install Node Modules

npm install

If you haven't already, create a new app on Heroku (cedar), this will add an additional remote GIT path to Heroku. (Assumes you have Heroku Toolbelt installed)

heroku create --stack cedar

Set up MongoDB and .env

Add free MongoLab account add-on for your MongoDB

heroku addons:add mongolab:starter

Heroku and MongoLab have provided a mongodb:// connection string in your Heroku config. This is your "username and password" to get access. We can keep the connection string out of the code and private by putting it inside a .env environment variable file.

Get your connection URI

heroku config | grep MONGOLAB_URI

Copy the Mongo URI connection string starting from mongodb:// to the end, will look like


Add local config variable for MongoLab

echo MONGOLAB_URI=mongodb:// >> .env

Get the party started

Install Node Modules

npm install

Run locally

foreman start

Visit on your browser at http://localhost:5000

Run on Heroku

Commit all changes

git commit -am "my commit message"

Push to Heroku

git push heroku master

Open in browser the lazy man way

heroku open
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.