mokinam / phonon-framework

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

Phonon

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!

Table of contents

• Quick start
• Documentation
• Demos
• Compatibility
• Why use Phonon

Quick start

Several quick start options are available:

• Download the latest release and use dist files.
• Clone the repo: git clone https://github.com/quark-dev/Phonon-Framework.git. Do not forget to run npm install.
• Install with npm: npm install phonon.
• Install with Bower: bower install phonon.
• Use CDNJS.

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.

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, RequireJS and VueJS.

• Code example with RiotJS
• Code example with AngularJS
• Code example with RequireJS
• Code example with VueJS

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!).