Skip to content

Fries helps you prototype Android apps using HTML, CSS, and JavaScript.

License

Notifications You must be signed in to change notification settings

Frankistan/fries

 
 

Repository files navigation

Fries v2.0.0

Fries is an awesome mobile UI framework for Android apps using just HTML, CSS, and Javascript and is inspired by Ratchet.

What's new in v2.0.0

This version (v2.0.0) includes the following:

  • Toast notifications
  • Dialogs
  • Checkboxes
  • Radio buttons
  • On/off toggle switches
  • Theming using SASS
  • Visual aesthetic improvements
  • Task automation using Grunt
  • and a whole lot of bug fixes and a few breaking changes

Wait, why v2.0.0?

I know that I was supposed to release v1.0.1 but I realized that it doesn't follow the widely known Semantic Versioning so I decided to release this version as v2.0.0 instead and from now on will follow the SemVer.

Getting Started

  • Download Fries or clone the repository git clone git@github.com:jaunesarmiento/fries.git.
  • Head on over to the documentation to learn more about Fries' components and how to build your first prototype.
  • Check out the examples to learn how to piece together each component.

Using Bower

I'm glad to announce that Fries is also now available as a Bower package. To install Fries using Bower, just run:

$ bower install fries

Running the examples

To run the examples you need to have Grunt installed. To install Grunt open up your shell and do:

$ npm install -g grunt

Then cd to Fries' root directory and install all dependencies by running:

$ npm install

After installing the dependencies, fire up a web server by running:

$ grunt server

Then you can open your browser and go to localhost:8000/examples to view the examples.

Or if you have Python installed on your system. Just run the following inside Fries' root directory:

$ python -m SimpleHTTPServer

Then go to localhost:8000/examples.

Note: You also might want to resize your browser's screen resolutiion and emulate touch events for a better experience. To do these:

  1. Open Chrome Developer Tools.
  2. Go to settings by clicking the little gear icon at the bottom right of the window.
  3. Go to Overrides tab.
  4. Check the "Device metrics" and enter your desired screen resolution. 380x640 works like a charm.
  5. Then check "Emulate touch events" and that's it.

Contributing to Fries

If you plan to contributing to Fries. Kindly read the contributing guide first before doing anything.

Special Thanks

I'd like to thank Dave Gamache, Connor Sears, and Jacob Thornton for a wonderful job on Ratchet. The conversion of the official Android icons was done in IcoMoon. Also, thanks to @aymanfarhat, @jadjoubran, and @Wolfr who kept the issue discussion flowing.

License

Fries is licensed under the MIT License. Copyright © Jaune Sarmiento (http://jaunesarmiento.me) 2013.

Attribution

Official Android Icons

Portions of this page are modifications based on work created and shared by the Android Open Source Project and used according to terms described in the Creative Commons 2.5 Attribution License.

Android Action Bar Icon Pack

By Tobias Bieniek also under Creative Commons 2.5 License

About

Fries helps you prototype Android apps using HTML, CSS, and JavaScript.

Resources

License

Stars

Watchers

Forks

Packages

No packages published