Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/MaksimAbramchuk/ionic-gulp-es6-starter-kit
:video_game: Simple boilerplate for building Ionic apps with help of Gulp and ES6
https://github.com/MaksimAbramchuk/ionic-gulp-es6-starter-kit
Last synced: 3 months ago
JSON representation
:video_game: Simple boilerplate for building Ionic apps with help of Gulp and ES6
- Host: GitHub
- URL: https://github.com/MaksimAbramchuk/ionic-gulp-es6-starter-kit
- Owner: MaksimAbramchuk
- License: mit
- Created: 2015-10-17T11:28:58.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-05-05T12:24:16.000Z (almost 8 years ago)
- Last Synced: 2024-04-12T15:06:28.440Z (10 months ago)
- Language: JavaScript
- Homepage:
- Size: 3.5 MB
- Stars: 75
- Watchers: 2
- Forks: 28
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
- awesome-projects-boilerplates - Angular Gulp Ionic Boilerplate
README
#Ionic Gulp boilerplate
Ionic application boilerplate for Gulp and ES6![Ionic and Angular](http://moduscreate.com/wp-content/uploads/2014/01/ionic-angular-opti.png)
##Features
* ES6 instead of ES5
* SCSS instead of CSS
* Automatic compilation
* Livereload
* Development build with source maps
* Automatic bower components injection
* Automatic scripts and stylesheets injection##Usage
##Installation process
For the first you need to install Node packages by running:
```sh
npm install
```after that install bower components by running
```sh
bower install
```Both `bower` and `npm` must be installed globally at your local machine.
You are ready to start the server.
###Running the App during Development
This command automatically compiles ES6 to ES5, scss, injects bower components, generates source maps, starts livereload server and opens your app in the browser.```sh
gulp serve
```
###Mobile app
When your app is interesting enough to be tested on mobile device, create a build.Don't forget to compile from sources:
```sh
gulp
```And then we can create the build for iOS:
```sh
ionic build ios
```and even test it, if you use OS X:
```sh
ionic emulate ios
```More info about builds, including Android, can be found in Ionic tutorial.
One more interesting feature Ionic has: Ionic View. It's amazing thing and I recommend you to try it - pretty simple to use and saves tones of time for debug and testing on real devices. To start, just run:```sh
ionic upload
```##Directory layout
### Source
```sh
angular-gulp-ionic-boilerplate
└── src
├── app # application folder
│ ├── components # components folder
│ ├── locations # locations folder
│ ├── index.config.js # config file
│ ├── index.module.js # main angular module
│ ├── index.route.js # ui router config
│ ├── index.run.js # file with run loop
│ └── index.scss # main scss file
└── assets # assets folder
├── images # images folder
├── favicon.ico # favicon
└── index.html # main page which will be rendered to a client
```##Build pack
![Ionic](http://dndigital.net/wp-content/uploads/2015/03/ionic-logo-blog-767x355.png)
![Angular](https://upload.wikimedia.org/wikipedia/commons/thumb/c/ca/AngularJS_logo.svg/695px-AngularJS_logo.svg.png)
![Gulp](https://avatars0.githubusercontent.com/u/6200624?v=3&s=400)
![Babel](https://avatars0.githubusercontent.com/u/9637642?v=3&s=400)
![SCSS](http://sass-lang.com/assets/img/logos/logo-b6e1ef6e.svg)