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