Spine is a lightweight framework for building JavaScript web applications. Spine gives you an MVC structure and then gets out of your way, allowing you to concentrate on the fun stuff, building awesome web applications.

Spine is opinionated in its approach to web application architecture and design. Spine’s architecture complements patterns such as de-coupled components and CommonJS modules, markedly helping with code quality and maintainability.

The library is written in CoffeeScript, but doesn’t necessarily require CoffeeScript to develop applications. You can use CoffeeScript or JavaScript, whichever language you’re most familiar with.

Spine is tiny, the core library comes in at around 600 lines of CoffeeScript. Being lightweight and simple is fundamental to Spine, and it’s only dependency is jquery or zepto.

Core values

Why should you use Spine?

JavaScript frameworks are a dime a dozen, and more are appearing everyday. So what makes Spine so special?

But don’t take our word for it. Take a look at the source of the example applications, and decide for yourself.

Components

CoffeeScript

Spine is written in CoffeeScript, a little language that compiles into JavaScript. You don’t have to write Spine applications in CoffeeScript, pure JavaScript will work fine. However, using CoffeeScript will be the path of least resistance, and the one we personally advocate.

CoffeeScript won’t be everyone’s cup of tea, and no doubt it’ll turn some people off the framework. However, if you’ve qualms about the language, at least give it a chance and check it out; you should understand what you’re missing. CoffeeScript has a lot to offer.

For an introduction to the language, see the The Little Book on CoffeeScript.

Spine’s documentation caters for both JavaScript and CoffeeScript developers; you can toggle source code examples between the two languages using the silver handles:

Alternatively, you can toggle the language site-wide by using the language selector in the top right of the documentation.

Learning Spine

Spine itself is fairly straight-forward, as the library is small and the API minimal. However, it’s the concepts behind JavaScript web applications that can be tricky to grasp at first. Moving state to the client-side, rendering on the client-side, and structuring your JavaScript using MVC and CommonJS modules can all be quite a learning curve.

It’s for this reason, that Spine’s docs read more like guides than raw API documentation, explaining the concepts and context to the solutions Spine brings. The pure API documentation is also available once you’re familiar with the library.

If you’re new to Spine, you should first check out the four main guides:

  1. Classes
  2. Models
  3. Controllers
  4. Views

Then you should experiment with the getting started guide, learning about generating Spine apps, and using Hem.

Finally it is definitely recommended to browse the source of spine itself as well as the source of some example applications, such as the Todos and Contacts apps.

Companion guide

Spine was originally built alongside a book, JavaScript Web Applications by O’Reilly. The book is a really good introduction to MVC, dependency management, templates and testing, all useful concepts whichever framework you end up using.

JavaScript Web Applications