umarmughal/phonon-framework

Phonon is a lightweight & scalable Javascript/CSS3/HTML5 mobile framework to develop a single page application based on Phonegap / Apache Cordova.

Phonon: the light weight, scalable, flexible and customizable HTML5 Web - Mobile Framework

Originally, Phonon has been created for building hybrid apps with Apache Cordova by using web technologies such as HTML, CSS and JavaScript. Phonon gives an intuitive and amuzing way of building apps. For example, the app's workflow can be defined with page events. This framework is also an UI framework proposing many features that are generic, which means they don't differ from mobile platforms. On the other hand, you can define your style according to the platform, because Phonon adds the OS class in the body tag. The main JavaScript file called phonon-core.js is only 23 kB! This file is the minimal file for running Phonon with basic CSS only components. Then you can load each component that you need. Since the version 1.0.0 released in August 2015, Phonon became browser-friendly which means you can build hybrid apps with Cordova or web apps!

Quick Start

The best place to start with Phonon is the Getting Started section

Documentation

Please, visit the website.

Demos

Code examples can be found in the docs or in the examples folder in this repository.

• Try the kitchen sink.

Installation

Ready to use files are available in the dist folder. You only need to copy/paste them. On the other hand, if you want to compile your own CSS/JS files with Gulp (the streaming build system) please install npm and gulp.

• npm install to install all modules
• gulp build to compile and minimify all sources

Compatibility

For more information, please see the compatibility section.

• Android 4.1+
• iOS 7+
• IE10+ (IE9 is partially supported)
• Chrome 30+
• Firefox 10+
• Opera 12+

Why use Phonon

Scalability

Javascript: Phonon modules are independent each other. It is fine to use only one Phonon feature or component, but you will fall in love with all the features. :)

Library Agnostic

Use your favorite design pattern (MVW, MVVM, MVC, ...) or a module loader with Phonon! For example, Phonon plays well with RiotJS, AngularJS and RequireJS.

• Live example with RiotJS
• Live example with AngularJS
• Live example with RequireJS

Internationalization

A Phonon app is almost perfect, but an internationalized Phonon application, it's even better! The i18n module permits to manage your language files and to bind the correct language values inside your HTML templates with attributes. Learn more

Light-weight framework

The Phonon framework is very light (phonon-core.js is only 23 kB!).

100% modular

Do you love RequireJS? We do. Using a modular script loader like RequireJS will improve the speed and quality of your code. Each Phonon component is compatible with asynchronous module definition (AMD).