@baiolo

Meet

...And stay alive !

Meet… And stay alive !

Why:●Used as mobile app engine.●Used as web app engine.●...We saw it on the run, now we

take time to see the basics.

Meet… And stay alive !PAY ATTENTION!

We are going to see the basics, NOT the best

practices !

Meet… And stay alive !

What:One acronym, SPA, aka

Single Page Application

A single-page application (SPA) is a web application or web site that fits on a single web page with the goal of providing a more fluid user experience akin to a desktop application. In a SPA, either all necessary code – HTML, JavaScript, and CSS – is retrieved with a single page load,[1] or the appropriate resources are dynamically loaded and added to the page as necessary, usually in response to user actions. The page does not reload at any point in the process, nor does control transfer to another page, although modern web technologies… bla bla bla… (Wikipedia)

Meet… And stay alive !

Main pattern: MVC

Meet… And stay alive !

Packages:●Routing●Templating●Two-Way data binding

new!

Meet… And stay alive !

Two-Way data binding:Automatic updates between model and views...with the controller in the middle :)

Meet… And stay alive !Old skool New kid(s) on

the block !

Meet… And stay alive !

Some alternatives:● Knockout● Ember● JsViews● Can.js● Ractive

Meet… And stay alive !A more in deepth view of the components... or ancestors:

● Underscore● Backbone● jQuery● AMD● Promises● Handlebars

Meet… And stay alive !OK… That’s cool, Hands on code !

Code taken from:https://github.com/curran/screencasts/tree/gh-pages/

introToAngular

Meet… And stay alive !Take 1 - Old Skoooooooooool !

Meet… And stay alive !Take 2 - jQuery era...

Meet… And stay alive !Take 3 - Welcome Angular !

Meet… And stay alive !Ok, one step further...Global controller

Meet… And stay alive !Introducing modules !

Meet… And stay alive !Introducing lists...

Meet… And stay alive !OMG Forms !

Meet… And stay alive !Give me it ! (remotely)

Meet… And stay alive !Images (the AngularJS way)

Meet… And stay alive !Ok, let’s take the time machine...

Meet… And stay alive !We saw the basics, there are tons of other things out there, where should we look ?

It may sound strange, but official documentation is the starting point !

Meet… And stay alive !API Reference too...

Meet… And stay alive !And the last two spots for a right AngularJS knowledge:

For the coding style & best parctices

For test unit & quality stuff

Meet… And stay alive !