SlideShare une entreprise Scribd logo
1  sur  15
Comprendre AngularJS
en 10 minutes
Le web : afficher des pages
Navigateur Serveur
HTTP (url)
HTML + CSS + JS
HTTP (url)
HTML + CSS + JS
De la page à l'application web
Navigateur Serveur
HTTP (url)
HTML + CSS + JS
Sessions
Mailing
Persistence
Web services
Navigation
Templating
Vues
etc
HTTP (url)
HTML + CSS + JS
Les applications web
Navigateur Serveur
HTTP (url)
HTML + CSS + JS
Sessions
Mailing
Persistence
Web services
etc
HTTP (url)
HTML + CSS + JS
Navigation
Templating
Vues
Les frameworks Javascript MVC
EmberJS
AngularJS
- Developpé par Google
- Maximiser la testabilité, la maintenance, la
réutilisabilité
Comprendre AngularJS
seulement 5 notions
routeur
controleur
service
filtre
directive
Démarrer un projet AngularJS
index.html
<html ng-app="myApp">
(...)
<script src="(...)/angular.js"></script>
</html>
Démarrer un projet AngularJS
index.html
<html ng-app="myApp">
(...)
<script src="(...)/angular.js"/>
<script src="(...)/app.js"/>
<script src="(...)/controllers.js">
<script src="(...)/services.js">
<script src="(...)/filters.js">
<script src="(...)/directives.js">
</html>
Comprendre AngularJS
le routeur
Comprendre AngularJS
le contrôleur
Comprendre AngularJS
le service
Comprendre AngularJS
le filtre
Comprendre AngularJS
la directive
Les avantages / inconvénients
+ intuitif
+ très facile de démarrer
+ très facile à tester
+ favorise la réutilisation des composants
+ très large communauté
- Pas le plus performant
- Ecrire des directives peut être difficile

Contenu connexe

Tendances

Introduction à AngularJS
Introduction à AngularJSIntroduction à AngularJS
Introduction à AngularJS
Abdoulaye Dieng
 

Tendances (20)

Angular JS - Paterne Gaye-Guingnido
Angular JS - Paterne Gaye-Guingnido Angular JS - Paterne Gaye-Guingnido
Angular JS - Paterne Gaye-Guingnido
 
Hello AngularJS - Back to the future
Hello AngularJS - Back to the futureHello AngularJS - Back to the future
Hello AngularJS - Back to the future
 
Introduction à Angularjs
Introduction à AngularjsIntroduction à Angularjs
Introduction à Angularjs
 
Intro à angular
Intro à angularIntro à angular
Intro à angular
 
AngularJS et autres techno frontend
AngularJS et autres techno frontendAngularJS et autres techno frontend
AngularJS et autres techno frontend
 
Introduction à AngularJS
Introduction à AngularJSIntroduction à AngularJS
Introduction à AngularJS
 
Apéro techno node.js + AngularJS @Omnilog 2014
Apéro techno node.js + AngularJS @Omnilog 2014Apéro techno node.js + AngularJS @Omnilog 2014
Apéro techno node.js + AngularJS @Omnilog 2014
 
Symfony with angular.pptx
Symfony with angular.pptxSymfony with angular.pptx
Symfony with angular.pptx
 
Angular 2
Angular 2Angular 2
Angular 2
 
Introduction à Angular
Introduction à AngularIntroduction à Angular
Introduction à Angular
 
Présentation Angular 2
Présentation Angular 2 Présentation Angular 2
Présentation Angular 2
 
Google : Prise en charge de l'Ajax et de l'Angular JS
Google : Prise en charge de l'Ajax et de l'Angular JSGoogle : Prise en charge de l'Ajax et de l'Angular JS
Google : Prise en charge de l'Ajax et de l'Angular JS
 
SPA avec Angular et SignalR (FR)
SPA avec Angular et SignalR (FR)SPA avec Angular et SignalR (FR)
SPA avec Angular et SignalR (FR)
 
Angular Framework présentation PPT LIGHT
Angular Framework présentation PPT LIGHTAngular Framework présentation PPT LIGHT
Angular Framework présentation PPT LIGHT
 
Introduction à Angular
Introduction à AngularIntroduction à Angular
Introduction à Angular
 
Introduction à Angular 2
Introduction à Angular 2Introduction à Angular 2
Introduction à Angular 2
 
Geek Time Mai 2017 : Vue.js
Geek Time Mai 2017 : Vue.jsGeek Time Mai 2017 : Vue.js
Geek Time Mai 2017 : Vue.js
 
Introduction à Angular 2
Introduction à Angular 2Introduction à Angular 2
Introduction à Angular 2
 
Support cours angular
Support cours angularSupport cours angular
Support cours angular
 
Angular Material Design
Angular Material DesignAngular Material Design
Angular Material Design
 

En vedette

Les 5 risques les plus critiques des applications Web selon l'OWASP
Les 5 risques les plus critiques des applications Web selon l'OWASPLes 5 risques les plus critiques des applications Web selon l'OWASP
Les 5 risques les plus critiques des applications Web selon l'OWASP
yaboukir
 
Plan de reprise d’activité
Plan de reprise d’activitéPlan de reprise d’activité
Plan de reprise d’activité
Exam PM
 
Presentation des failles_de_securite
Presentation des failles_de_securitePresentation des failles_de_securite
Presentation des failles_de_securite
Borni Dhifi
 

En vedette (20)

Prismic
PrismicPrismic
Prismic
 
Introduction à Angular JS
Introduction à Angular JSIntroduction à Angular JS
Introduction à Angular JS
 
Résumé javascript
Résumé javascriptRésumé javascript
Résumé javascript
 
Apache Open SSL
Apache Open SSLApache Open SSL
Apache Open SSL
 
ASFWS 2011 : Les exigences PCI-DSS en terme de développement logiciel
ASFWS 2011 : Les exigences PCI-DSS en terme de développement logicielASFWS 2011 : Les exigences PCI-DSS en terme de développement logiciel
ASFWS 2011 : Les exigences PCI-DSS en terme de développement logiciel
 
Sécurité des applications Web
Sécurité des applications WebSécurité des applications Web
Sécurité des applications Web
 
Les 10 principales menaces de sécurité des bases de données
Les 10 principales menaces de sécurité des bases de donnéesLes 10 principales menaces de sécurité des bases de données
Les 10 principales menaces de sécurité des bases de données
 
Les 5 risques les plus critiques des applications Web selon l'OWASP
Les 5 risques les plus critiques des applications Web selon l'OWASPLes 5 risques les plus critiques des applications Web selon l'OWASP
Les 5 risques les plus critiques des applications Web selon l'OWASP
 
Plan de reprise d’activité
Plan de reprise d’activitéPlan de reprise d’activité
Plan de reprise d’activité
 
Notions de base de JavaScript
Notions de base de JavaScriptNotions de base de JavaScript
Notions de base de JavaScript
 
Formation JavaScript full-stack (JS, jQuery, Node.js...)
Formation JavaScript full-stack (JS, jQuery, Node.js...)Formation JavaScript full-stack (JS, jQuery, Node.js...)
Formation JavaScript full-stack (JS, jQuery, Node.js...)
 
ASFWS 2012 - Les utilités d’un pare-feu applicatif Web (WAF) par Jonathan Marcil
ASFWS 2012 - Les utilités d’un pare-feu applicatif Web (WAF) par Jonathan MarcilASFWS 2012 - Les utilités d’un pare-feu applicatif Web (WAF) par Jonathan Marcil
ASFWS 2012 - Les utilités d’un pare-feu applicatif Web (WAF) par Jonathan Marcil
 
Les principales failles de sécurité des applications Web actuelles
Les principales failles de sécurité des applications Web actuellesLes principales failles de sécurité des applications Web actuelles
Les principales failles de sécurité des applications Web actuelles
 
Cours JavaScript
Cours JavaScriptCours JavaScript
Cours JavaScript
 
PRA et PCA : plans de reprise et de continuité d'activité
 PRA et PCA : plans de reprise et de continuité d'activité PRA et PCA : plans de reprise et de continuité d'activité
PRA et PCA : plans de reprise et de continuité d'activité
 
Presentation des failles_de_securite
Presentation des failles_de_securitePresentation des failles_de_securite
Presentation des failles_de_securite
 
Proyecto NORMALIZACION 5IM2
Proyecto NORMALIZACION 5IM2Proyecto NORMALIZACION 5IM2
Proyecto NORMALIZACION 5IM2
 
Bd europe
Bd europeBd europe
Bd europe
 
Services TI gérés
Services TI gérésServices TI gérés
Services TI gérés
 
Cambios en la accion docente
Cambios en la accion docenteCambios en la accion docente
Cambios en la accion docente
 

Similaire à comprendre angularJS en 10 minutes

SEO & Javascript en 2021 : Challenger les acquis - Alexandre Pinat - SEO CAMP...
SEO & Javascript en 2021 : Challenger les acquis - Alexandre Pinat - SEO CAMP...SEO & Javascript en 2021 : Challenger les acquis - Alexandre Pinat - SEO CAMP...
SEO & Javascript en 2021 : Challenger les acquis - Alexandre Pinat - SEO CAMP...
SEO CAMP
 
Dw006 formation-dreamweaver-cc-les-bases-et-perfectionnement
Dw006 formation-dreamweaver-cc-les-bases-et-perfectionnementDw006 formation-dreamweaver-cc-les-bases-et-perfectionnement
Dw006 formation-dreamweaver-cc-les-bases-et-perfectionnement
CERTyou Formation
 
Nouveautés html5 et css3 dans internet explorer 10
Nouveautés html5 et css3 dans internet explorer 10Nouveautés html5 et css3 dans internet explorer 10
Nouveautés html5 et css3 dans internet explorer 10
davrous
 
M10264 formation-developper-des-applications-web-avec-microsoft-visual-studio...
M10264 formation-developper-des-applications-web-avec-microsoft-visual-studio...M10264 formation-developper-des-applications-web-avec-microsoft-visual-studio...
M10264 formation-developper-des-applications-web-avec-microsoft-visual-studio...
CERTyou Formation
 
M20486 formation-developper-des-applications-web-asp-net-mvc-4
M20486 formation-developper-des-applications-web-asp-net-mvc-4M20486 formation-developper-des-applications-web-asp-net-mvc-4
M20486 formation-developper-des-applications-web-asp-net-mvc-4
CERTyou Formation
 
M20480 formation-programmer-en-html5-avec-javascript-et-css3
M20480 formation-programmer-en-html5-avec-javascript-et-css3M20480 formation-programmer-en-html5-avec-javascript-et-css3
M20480 formation-programmer-en-html5-avec-javascript-et-css3
CERTyou Formation
 

Similaire à comprendre angularJS en 10 minutes (20)

SEO & Javascript en 2021 : Challenger les acquis - Alexandre Pinat - SEO CAMP...
SEO & Javascript en 2021 : Challenger les acquis - Alexandre Pinat - SEO CAMP...SEO & Javascript en 2021 : Challenger les acquis - Alexandre Pinat - SEO CAMP...
SEO & Javascript en 2021 : Challenger les acquis - Alexandre Pinat - SEO CAMP...
 
Une visite guidée d’Internet Explorer 9 et HTML5 pour les développeurs Web
Une visite guidée d’Internet Explorer 9 et HTML5 pour les développeurs WebUne visite guidée d’Internet Explorer 9 et HTML5 pour les développeurs Web
Une visite guidée d’Internet Explorer 9 et HTML5 pour les développeurs Web
 
L'histoire d'html5 pour les développeurs windows phone 8
L'histoire d'html5 pour les développeurs windows phone 8L'histoire d'html5 pour les développeurs windows phone 8
L'histoire d'html5 pour les développeurs windows phone 8
 
Dw006 formation-dreamweaver-cc-les-bases-et-perfectionnement
Dw006 formation-dreamweaver-cc-les-bases-et-perfectionnementDw006 formation-dreamweaver-cc-les-bases-et-perfectionnement
Dw006 formation-dreamweaver-cc-les-bases-et-perfectionnement
 
[TechDays 2012] : Quoi de neuf dans ASP.NET 4.5
[TechDays 2012] : Quoi de neuf dans ASP.NET 4.5[TechDays 2012] : Quoi de neuf dans ASP.NET 4.5
[TechDays 2012] : Quoi de neuf dans ASP.NET 4.5
 
Quoi de neuf dans ASP.NET 4.5
Quoi de neuf dans ASP.NET 4.5Quoi de neuf dans ASP.NET 4.5
Quoi de neuf dans ASP.NET 4.5
 
Nouveautés html5 et css3 dans internet explorer 10
Nouveautés html5 et css3 dans internet explorer 10Nouveautés html5 et css3 dans internet explorer 10
Nouveautés html5 et css3 dans internet explorer 10
 
ENIB 2013-2014 - CAI Web #1: Côté navigateur 3/3
ENIB 2013-2014 - CAI Web #1: Côté navigateur 3/3 ENIB 2013-2014 - CAI Web #1: Côté navigateur 3/3
ENIB 2013-2014 - CAI Web #1: Côté navigateur 3/3
 
Frameworks JavaScript en environnement MS
Frameworks JavaScript en environnement MSFrameworks JavaScript en environnement MS
Frameworks JavaScript en environnement MS
 
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et JavascriptCodedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
 
Le SEO JavaScript démystifié
Le SEO JavaScript démystifiéLe SEO JavaScript démystifié
Le SEO JavaScript démystifié
 
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)
 
M10264 formation-developper-des-applications-web-avec-microsoft-visual-studio...
M10264 formation-developper-des-applications-web-avec-microsoft-visual-studio...M10264 formation-developper-des-applications-web-avec-microsoft-visual-studio...
M10264 formation-developper-des-applications-web-avec-microsoft-visual-studio...
 
Angular développer des applications .pdf
Angular développer des applications .pdfAngular développer des applications .pdf
Angular développer des applications .pdf
 
Prezentare ASP.Net.pptx
Prezentare ASP.Net.pptxPrezentare ASP.Net.pptx
Prezentare ASP.Net.pptx
 
ngParis - Rendu cote serveur
ngParis - Rendu cote serveurngParis - Rendu cote serveur
ngParis - Rendu cote serveur
 
M20486 formation-developper-des-applications-web-asp-net-mvc-4
M20486 formation-developper-des-applications-web-asp-net-mvc-4M20486 formation-developper-des-applications-web-asp-net-mvc-4
M20486 formation-developper-des-applications-web-asp-net-mvc-4
 
M20480 formation-programmer-en-html5-avec-javascript-et-css3
M20480 formation-programmer-en-html5-avec-javascript-et-css3M20480 formation-programmer-en-html5-avec-javascript-et-css3
M20480 formation-programmer-en-html5-avec-javascript-et-css3
 
Symposium n°7 : Plateforme Meteor
Symposium n°7 : Plateforme MeteorSymposium n°7 : Plateforme Meteor
Symposium n°7 : Plateforme Meteor
 
Proposition site Algo
Proposition site AlgoProposition site Algo
Proposition site Algo
 

comprendre angularJS en 10 minutes