Basic Node.js and Backbone.js application I

14 Abr

This is the first post of a serie where I gonna explain how to build a simple application based in Node.js and Backbone.js. The idea behind this post is trying to use as many technologies as we can to build a web application. In the last year there are some Javascript frameworks and libraries that are getting a lot of popularity in web development. In this first post we are going to enumerate which technologies we are going to use, REST API and the environments where we are going to deploy all. I’ll also give a brief about the project itself. So let’s go.

Libraries, frameworks and environments.

  • Node.js. It’s a event-driven I/O server-side JavaScript environment based on V8. Nowadays there are    many projects that are been built using Node.js instead of other more common server-side frameworks like JEE, .NET, Ruby or Python. The big (and short) idea behind Node.js is that uses a non-blocking I/O model and every request is handle by the same single thread. Node.js has been receiving a great support for the developer community. You can take a look at its GitHub project, and see that people are developing many modules for it.
    In our case we are gonna use Express.js. Express.js is a Node.js web framework based on Sinatra. It’s very easy to start with it and that’s the reason why I’m gonna use it.
  • Backbone.js. One of the main problem with the front-side layer is that as you project grows your Javascript or JQuery code may look not well structured. To fill that gap there are some framework that are emerging lately. Frameworks like Backbone.js, Knockout.js, JavascriptMVC or Spine.js try to help us to bring some order in our front-end code. If you wanna know more about them I truly recommend you taking a look at Addy Osmany’s blog. He’s writting a really nice book called Essential JavaScript Design Patterns to help us understand and explain the different trends that are emerging today in Javascript development. I’ve choosen Backbone.js because I think that it’s probably the most used framework today. It follows the MVC pattern somehow although it’s now strictly what you might expect for that pattern. I recommend you reading about that before you start to work with Backbone.js.
  • Jade. It’s a Node.js template engine ‘heavily influenced by Haml‘ that help us to write HTML5 code in a efficient and smart way. We are writting our HTML5 pages using this template engine. What we are going to do is create a layout from where other pages are going to inherit some configuration.
  • Less. It’s a dynamic stylesheet language that provides us a way to create CSS3 very easily. With it you can use some concepts like variables, inheritance or mixins in your CSS3. There are some other dynamic stylesheet languages out there like SaSS or Stylus (you cand find a nice comparison here).
  • Leaflet. It’s a Javascript  library that allows us to create interactive maps in our sites. It’s really simple to use and besides that gives us a great level of customization.

Rest API.

In order to build our application we need some data. Our data sources will be Twitter and Yahoo API, and for that purpose we are going to call to their REST API.

  • Twitter API. Provides REST support to get any data we want from Twitter. For our application we need to use to resources URL:
    • Get search. We are interested in getting tweets regarding some topic we can search for. You have to add a query parameter to the URL in order to look for specifics tweets within Twitter.
    • Get users/show. We need to indicate to the user_id parameter the user’s id from who we want to extract some information such location or screen name.
  • Yahoo API. Yahoo probably has the better API along Google in order to use its services. There are some many services you can use with it. Some of them were explained in a previous post. In this project we are going to use:
    • Yahoo Geoplanet. We are use the Yahoo Geoplanet API to get latitude and longitude from a specified city in the world. The only thing we are going to need is saying the city from we  want to know its coordinates.

To use the Twitter API we don’t need to posses a developer key, but we have some limitations in the users/show services (we are restricted to use more than 150 request per hour). In the case of the Yahoo API we need to sign up in order to get a valid App identifier.

Deploying our application.

Well, so we want to develop our application and test it in our local enviroment and after that we want to deploy it to the cloud. I’ve choosen some PaaS in order to upload it.

  • Heroku. Heroku is a PaaS (Platform as a Service) that is built to upload your application to the cloud.  Besides that it gives us many services (NoSQL, Message Queue services and so on) to make our applications better. You need to sign up to get an account. Fortunately, there is a special account where you can upload your application for free.
  • Cloud Foundry: Cloud Foundry is a PaaS created by VMWare quite similar to Heroku. It has support for several development stacks (JEE, Ruby or Node.js). As with Heroku it gives you some services (not as many than with Heroku) to your application. You can sign up for a free acount here.
  • Amazon Web Services. Both Heroku and Cloud Foundry can be consider PaaS, but with AWS we are talking about Iaas (Infrastructure as a Service). With AWS you have a machine (an instance) where you can install, deploy or use any stuff you like (a node.js application in our case). Althought, it’s quite easy to start with Heroku or Cloud Foundry than AWS I want to try AWS because it’s the base from some PaaS (Heroku uses AWS for example).  We are using Amazon Elastic Compute Cloud (Amazon EC2) to deploy our application to the Cloud.

A few words about the project.

The project is quite simple. We want a simple HTML5 page with a text field and a search button. We write a work in the text field and we will look for tweets relating to that word in Twitter. Besides that we will show some extra information of it and use leaflet to present it. Easy, isn`t it?. I’ll explain in the next write up how to develop it.


You could be interested in reading the other posts:

4 comentarios

Publicado por en 14 abril, 2012 en web


Etiquetas: , , , , , , , , , , , , ,

4 Respuestas a “Basic Node.js and Backbone.js application I


Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de

Estás comentando usando tu cuenta de Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s

A %d blogueros les gusta esto: