Montage is an elegant, open source HTML5 framework maintained by Montage Studio that rivals native SDKs, yet is easier to learn. It offers modular components, two-way data binding, and much more. Join us on irc.freenode.net#montage. Sign up for our beta to build Montage applications in the cloud.
Montage is a new type of application framework powered by standard web technologies. Designed with an eye toward maintainability and performance, Montage simplifies the development of rich HTML5 applications by providing modular components, real-time two-way data binding, object serialization with DOM mapping, event handling, a managed component draw cycle, CommonJS dependency management, and many more conveniences to help build robust single-page web applications.
Montage makes it easier to manage your application and UI state with data bindings. A UI component or Montage object can establish a simple or bi-directional binding with another component or object. When the bound property, or deeper property path, of the bound object is updated then the source object is kept in sync.
Montage uses functional reactive bindings (FRB). Unlike “traditional” bindings, FRB can gracefully bind long property paths and the contents of collections. They can also incrementally update the results of chains of queries including maps, flattened arrays, sums, and averages as well as add and remove elements from sets based on the changes to a flag. FRB makes it easy to incrementally ensure consistent state. FRB is built from a combination of powerful functional and generic building blocks, making it reliable, easy to extend, and easy to maintain.
For more information, see FRB.
Montage fully supports CommonJS modules and is a part of the Node and npm package ecosystem.
For more information, see CommonJS.
To get started with Montage, you will need the following:
To start using Montage, follow these steps:
Download and run the prebuilt Node.js installer for your platform from the Node.js website.
minit, the Montage Initializer.
minitis a command line utility that will help kickstart your Montage project by generating prebuilt Montage application templates and components and placing the associated files inside the proper directories of your project.
Mac OS X / Linux
$ mkdir -p ~/.npm $ sudo npm install -gq [email protected]
Run the "Node.js command prompt"
$ npm install -gq [email protected]
minitto create your Montage project:
$ minit create:app -n yourappname
Note: If you get an EACCES warning when trying to run
sudo chown -R ~/.npmand then use
$ minit create:app -n hello. This is a workaround due to a bug in npm.
This generates a new directory—yourappname, which contains the default Montage application template, including the production dependencies—in your current directory.
To verify your installation, switch to yourappname directory and serve your new Montage project using
$ cd yourappname $ minit serve &
Point your browser to http://localhost:8083/.
You should see the contents of the Welcome component—a simple single-page application, which is explicitly loaded to accompany our two-part quick start tutorial tutorial.
For a quick introduction on how to assemble Montage components into a user interface, refer to “Hello Montage” in our Quick Start tutorial. For more information on Montage components, bindings, event handling, serialization etc. refer to the documentation (be patient: we are currently in the process of updating the docs).
Tests are in the
npm testto run the tests in NodeJS or open
test/run.htmlin a browser.
To run the tests in your browser, simply use
npm run test:jasmine.
To run the tests using Karma use
npm run test:karmaand for continious tests run with file changes detection
npm run test:karma-dev. Finally to open a remote debug console on karma use
npm run test:karma-debug.