● Markers on a DOM element (attribute, element name, comment or CSS class);● "... a way to teach HTML new tricks."● Anything (within your app) ; ● A function that's attached to a DOM element:
○ a whole execution environment; ○ a micro-application;
<!-- Built in directive →<div ng-repeat="item in items"></div>
<!-- Custom directive →<my-directive></my-directive>
<!-- OR --><div my-directive></div>
$ ionic serve
Running dev server: http://localhost:8100Running live reload server: http://localhost:35729Watching : [ 'www/**/*', '!www/lib/**/*' ]Ionic server commands, enter: restart or r to restart the client app from the root goto or g and a url to have the app navigate to the given url consolelogs or c to enable/disable console log output serverlogs or s to enable/disable server log output quit or q to shutdown the server and exit
$ gem install rb-fsevent$ sass --watch scss/app.scss:css/app.css
// Customize Ionic variables pre-import$stable: #e8f8f8;
@import “www/lib/ionic/scss/ionic”;
// Add custom styles.highlighted { color: #ffff00; }
scss/ionic.app.scss
/* Empty. Add your own CSS if you like */.new-block { color: #f0f0f0;}
// New block styles.parse { font-weight: bold; }
www/css/style.css
● www.movel.co● @stauffermatt - Intro to Ionic● Ionic Framework● AngularJS● Gulp● Grunt● Bower● NodeJS