OpenShift Cartridge to get you started with Spark.js

I have spent a bit of time fig­ur­ing out how to get spark.js, node.js and Open­Shift all work­ing togeth­er and if you have read the last two post you may have seen some of the progress. Recent­ly I have cre­at­ed a car­tridge for Open­Shift, com­bin­ing every­thing into a rel­a­tive­ly easy to use pack­age. I hope it can save some­one some time and get their spark.io devices up and report­ing on the web faster!

Syn­op­sis (If you are in a hur­ry):

  1. Cre­ate Open­Shift Account: https://openshift.redhat.com
  2. Add a new appli­ca­tion and paste http://cdk-hippreality.rhcloud.com/manifest/9a1945721358ad2b20e7fd8c41f396ca2981014a into Code Any­thing input field.
  3. After com­plet­ing the forms and build­ing the appli­ca­tion, click through the appli­ca­tion, log in to Spark and see your devices and details list­ed in the web­site.

First, there are a ton of resources I need to thank for putting this togeth­er. Open­Shift and the car­tridge devel­op­ment kit (CDK) were a great start­ing point. The spark.js repo was an awe­some source of infor­ma­tion, along with the jade, node.js, express and the spark.io sites. Now, the good stuff!

First, if you do not have an Open­Shift account, you can cre­ate one for free here: https://openshift.redhat.com . Sign up, wait for an email and log in.

Once you are in, you can cre­ate a new appli­ca­tion by click­ing on the but­ton and you will see all of the great car­tridges already avail­able. How­ev­er, instead of select­ing one of them, scroll down to the “Code Any­thing” area and paste in this link to the cus­tom car­tridge: http://cdk-hippreality.rhcloud.com/manifest/9a1945721358ad2b20e7fd8c41f396ca2981014a

Once you hit next, it will ask you for a domain name and the name of the appli­ca­tion you are cre­at­ing. Once you have filled those in, you can scroll down to “Cre­ate Appli­ca­tion” and when you hit the but­ton it will build the site for you.

After the install com­pletes you will be able to see a list of your appli­ca­tions and when you click on the one you just cre­at­ed it will pro­vide you a link to the name of the appli­ca­tion and domain you select­ed ear­li­er. If you click on the link, you will see all of the parts from the pre­vi­ous posts run­ning in a sim­ple page. Just two lines of text and a but­ton.

Click on “Login to Spark” and put in your spark.io cre­den­tials and you will be sent to a page giv­ing you infor­ma­tion about your devices! This is just a start­ing point, using the frame­work you can cre­ate your own pages, but­tons and inter­ac­tions with your devices, which will be avail­able through this site!

If you want to start cus­tomiz­ing the page, use the link pro­vid­ed in your appli­ca­tion to clone your git local­ly and start build­ing your web appli­ca­tion! For sim­ple changes, to make sure every­thing is work­ing, you can edit routes/index.js title to reflect your own page infor­ma­tion. From here, your imag­i­na­tion is the only limitation…that and time!

Resources

For more infor­ma­tion relat­ed to Open­Shift and Node.js, refer to my last two posts. Good Luck!

Email about spark.js and now my Saturday is gone!

A lit­tle while back I saw an email about spark.js and thought it would be cool to check it out. This Sat­ur­day morn­ing I fig­ured I would down­load it and play around a lit­tle while it stopped rain­ing out­side. 6 hours lat­er…

First, I must say I am not a node.js expert, but I have some expe­ri­ence with Ver­sion Con­trol Sys­tems (VCS, Sub­ver­sion as an exam­ple), I do know JavaScript and I have tin­kered around with var­i­ous lan­guages, hard­ware etc. All that being said, it took a bit for me to get a work­ing envi­ron­ment to play around with spark.js the way I want­ed to!

Here were the steps I took and snags I found. This is all on Win­dows 7

  1. Install node.js http://nodejs.org/download/
  2. Install spark.js https://github.com/spark/sparkjs

From here you can try out some stuff and get respons­es in the con­sole, you can actu­al­ly stop here, but I thought I would take it a few steps fur­ther to cre­ate a “true” devel­op­ment envi­ron­ment.

  1. Cre­ate a free account on Open­Shift https://developers.openshift.com/en/getting-started-overview.html
    1. If you have not seen this, it is pret­ty cool. You can get 3 small gears for free and they can host your node.js appli­ca­tion (among oth­er things!)
  2. When you go through the process on the above page, you will need to install Git (http://git-scm.com/downloads) which is super easy to use and have up and run­ning.
  3. You will also need Ruby to use the rhc gem to inter­act with your Open­Shift appli­ca­tion through com­mand line. http://rubyinstaller.org/downloads/ I used Ruby 1.9.3-p545 and it worked with only one issue. If you check the box to add Ruby to your PATH, it does not work.
    1. Try >echo %PATH% to check, from com­mand line
    2. If it is not there you can try >set PATH=C:\RUBY193\bin:%PATH% to add it. Make sure you use your actu­al path.
  4. Install the rhc gem and set it up: https://developers.openshift.com/en/getting-started-client-tools.html
  5. Install express and save your­self some time: http://expressjs.com/starter/installing.html
  6. You can con­nect your git to your Open­Shift App to make it sim­ple to man­age your code, just make a key and drop it into the Open­Shift Inter­face.

Now, if every­thing is set­up and con­nect­ed prop­er­ly, you can actu­al­ly tail your appli­ca­tion from your con­sole with rhc, add code to your local git and push it to your app and view your appli­ca­tion through your own URL. Mine as an exam­ple: http://nodejs-hippreality.rhcloud.com/ .

Server.js

var express = require('express');
var app = express();
app.get('/', function (req, res) {
res.send('Hello World!');
});
var port = process.env.OPENSHIFT_NODEJS_PORT || 8080
var host = process.env.OPENSHIFT_NODEJS_IP || "127.0.0.1";
var server = app.listen(port, host, function () {
console.log('Example app listening at http://%s:%s', host, port);
});

After you com­mit your code, the appli­ca­tion auto­mat­i­cal­ly restarts and you should see your Hel­lo World.

All this and I nev­er even got to the spark.js (beyond return vars in the con­sole). That will be com­ing next!