Difference between revisions of "Angular"

From air
Jump to navigation Jump to search
Line 70: Line 70:
   
 
==From scratch==
 
==From scratch==
  +
Suivre [[Angular/TodoList|Mini-tutoriel TODOLIST]]
<pre>
 
mkdir todolist
 
cd todolist
 
bower install angularjs-boilerplate
 
 
cat << EOF > index.html
 
<!doctype html>
 
<html lang="en" ng-app>
 
<head>
 
<meta charset="utf-8">
 
<title>My HTML File</title>
 
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
 
<link rel="stylesheet" href="css/app.css">
 
<script src="bower_components/angular/angular.js"></script>
 
</head>
 
<body>
 
 
<p>Nothing here {{'yet' + '!'}}</p>
 
 
</body>
 
</html>
 
EOF
 
</pre>
 
 
 
 
<pre>
 
mkdir css
 
mkdir img
 
mkdir js
 
mkdir partials
 
cd js
 
touch app.js controllers.js filters.js directives.js services.js
 
</pre>
 

Revision as of 12:55, 12 November 2015

https://angularjs.org/

Framework javascript

  • Architecture proche de MVVM, mais dite MVW

Une application par page (Single Page Application), Angular permet de définir

  • des modules
  • des services/factory
  • des controleurs
  • des directives
  • des vues, filtres, expressions, bindings
  • des routages

Extensible via des modules tiers

Transparents

Transparents du Cours (Alexandre Demeure)

Tutoriel (Officiel)

https://docs.angularjs.org/tutorial

git clone --depth=14 https://github.com/angular/angular-phonecat.git
cd angular-phonecat
node --version
npm install
bower install
npm start

Browse http://localhost:8000/app/index.html

npm run protractor

Step 0

git checkout -f step-0
npm install
bower install
npm start

Browse http://localhost:8000/app/index.html

Step 1

git checkout -f step-1
npm install
bower install
npm start

Browse http://localhost:8000/app/index.html

TODO Tutoriel

http://todomvc.com/examples/angularjs/#/

Démarrage avec AngularJS Boilerplate

A partir de AngularJS Boilerplate

git clone https://github.com/jbutko/AngularJS-Boilerplate.git
npm install
gulp build
gulp server
gulp server-build

From scratch

Suivre Mini-tutoriel TODOLIST