Monaca logo
Menu hamburger icon

Getting Started

Onsen UI helps you develop both hybrid and web apps. If developing hybrid apps, you can use it with the Cordova / PhoneGap command line, or with Monaca IDE - cloud-based IDE for Cordova.

Onsen UI with the Cordova

The preferred method is to use cordova command line tool. For that purpose, you need to install node.js and npm command needs to be available.

1. Install Cordova package

$ sudo npm install -g cordova

For more details how to use Cordova tool, please refer to Cordova documentation.

2. Select template

Select one of the templates on the download page.

3. Add platform

You need to add the platform SDK to the project to run on the simulator or device.

$ cd /path/to/the/project
$ cordova platform add ios (or android)

4. Run on the simulator

The following command will run the application in the simulator.

$ cordova emulate

If the command fails, you are missing something. If you want a quicker solution, try Monaca with the following instructions.

Using Onsen UI with Monaca

The benefit of using Monaca with Onsen UI is development in the cloud. You don’t need to setup a local environment to develop for iOS and Android.

1. Sign up to Monaca     Sign Up for Free

2. Create a new project

Create a new project by choosing a template using Onsen UI. After creating the project, open the IDE.

3. Install debugger and run project

You can now run your project on your device. Just install Monaca Debugger and it will download the project and start right away.

4. Build for Android and iOS

Publish your Onsen UI-built app with Monaca for iOS, Android, and Chrome Apps. Easily submit your app to the App Store and Google Play.

Using Onsen UI for Websites

You can use Onsen UI Bower module for a quicker setup.

$ sudo npm install -g bower
$ bower install onsenui

Need Help?

If you have any questions, please ask them on Stack Overflow using the 'onsen-ui' tag. The Onsen UI team and your peers in the community will work together to help solve your issues.

For bug reports and feature requests use our GitHub Issues page.

You may also find helpful information in the resources below: