The best place to start with Onsen UI is our Getting Started page.
Built on top of AngularJS, Onsen UI is open source, free and open for all. Onsen UI is designed and implemented to deliver unprecedented user experience for your apps. Applications can be built using HTML tags web developers already know and love. We love AngularJS and all the power it brings. But we've also added support for JQuery so developers less familiar with AngularJS can take advantage of Onsen UI, too.
Onsen UI also includes Onsen CSS Components, a free resource of UI templates with "theme roller" functionality. Developers can pick and choose, grab the code they need, and they're off and running. And they can create their own templates and submit to Onsen UI to be included with other templates available.
Our Monaca IDE fully supports Onsen UI plugin.
Onsen UI is tested with the following browsers and mobile OS.
- Android 4.0.2+
- iOS7+
- Windows Phone 8.1+
- Google Chrome
- Safari
Click here to see Onsen UI in action!
- AngularJS: for directives
- Topcoat: for fast UI css
- HammerJS: for touch, swipe handling
- Font Awesome: for icons
See the Onsen UI Getting Started page.
See the Onsen UI Getting Started Page and scroll down to the Using Onsen UI with Monaca section.
A new build is generated every time the code changes. It can be downloaded on this page.
Please use this with caution. However, we are very grateful if people try it out so we can find bugs and things to improve before the sharp releases.
- Clone this repository
$ git clone https://github.com/OnsenUI/OnsenUI.git
- Open the terminal from OnsenUI directory
$ cd OnsenUI
- Install dependencies using npm
$ npm install
- Install gulp (globally)
$ [sudo] npm install -g gulp
- Type gulp to start building
$ gulp build
The files will be built and copied into build, demo/lib/onsen/, and app/lib/onsen/ folder.
$ npm install
$ [sudo] npm install -g gulp
$ gulp serve
- Then navigate your browser to http://0.0.0.0:8000/demo/index.html
Onsen UI has end-to-end testing using Protractor. Use the following command to run the tests:
$ npm install
$ gulp test
It will take some time the because it will download a stand-alone Selenium Server and a Chrome webdriver the first time it's executed.
To run a single test or a group of tests use the --specs
parameter and provide a comma-separated list of spec files:
$ gulp test --specs test/e2e/lazyRepeat/scenarios.js
Our Monaca IDE makes it super easy to create Onsen UI project, but if you want to use other IDEs, we provide project templates for you in the project-templates
repository. You will see the instruction on how to run the project there.
See the current Onsen UI docs.
Run gulp task to develop Onsen UI itself with livereload.
gulp serve
Access http://0.0.0.0:8000/demo/index.html and your code changes will be reloaded.
Please see the following file for information about upcoming releases and what will be included.
Please tell us if you have any suggestions for features that you would like to see included.
Please see the full list of contributors.
Please see our document on contributing.
If anything about Onsen UI is unclear, please ask a question on Stackoverflow, and tag it "onsen-ui". An Onsen UI support engineer will answer it.
You can also join our Gitter channel if you want to talk about Onsen UI.
If you have any requests or comments regarding the development of Onsen UI, please feel free to direct them to the Twitter account (@Onsen_UI).