Technologies Web, Conception et développement Web

Transcription

Technologies Web, Conception et développement Web
Le Web, incontournable dans le monde professionnel, donne accès à l'information, mais
également à une multitude d'applications d'entreprise ou de services grand public. Les filières
Orsys vous apporteront toutes les connaissances nécessaires pour concevoir des sites Web
performants et conviviaux, en mettant l'accent aussi bien sur la conduite de projets Web, le
design que sur les technologies les plus récentes comme le HTML5, CSS3 et de nombreux
Frameworks de développement côté client et côté serveur.
Cycles certifiants
Cycle certifiant Concepteur de sites Web
(réf. KCS)
Cycle certifiant Développeur Web côté client
.... p.4
.... p.6
(réf. KWC)
Cycle certifiant Développeur d'applications Front-End
(réf. KDF) New
.... p.8
Etat de l'art
Les technologies du Web, synthèse
Conception d'architecture Web
(réf. IRT) Best
(réf. ACS)
.... p.10
.... p.12
JavaScript au cœur des architectures Web, état de l’art
XML & JSON, synthèse
(réf. XML) Best
(réf. JET)
.... p.14
.... p.15
Web 2.0 et réseaux sociaux en entreprise, synthèse
(réf. WRS)
.... p.17
Développement Web : les fondamentaux
Réaliser un site Web, pour non-informaticiens
Développer un site Web, synthèse pratique
HTML, initiation pratique
(réf. TML)
(réf. DSW) Best
.... p.18
.... p.20
.... p.22
CSS, donner du style à vos pages Web
Dreamweaver CS6, prise en main
(réf. NIW) Best
(réf. CSS)
(réf. EAM)
.... p.24
.... p.26
Dreamweaver CS6, développer un site Web
.... p.28
(réf. HTX)
Programmation en HTML5 avec JavaScript et CSS3 (70-480)
(réf. JSC) New
.... p.30
HTML5, CSS3, orienter votre conception vers des sites Web modernes et dynamiques
.... p.32
Edge Animate, créer des animations interactives pour le Web
(réf. EDG)
Google Web Designer, créer des contenus riches pour le Web
Technologies XML, conception, mise en œuvre
Développer avec XSL-T et XSL-FO
(réf. LSX)
XML, modéliser vos documents et données
Développer des applications Web 2.0
JavaScript, HTML dynamique
(réf. CAX)
JavaScript, perfectionnement
Ajax, programmation côté client
.... p.36
.... p.38
.... p.44
.... p.46
(réf. HML)
(réf. JPG)
(réf. GOD)
.... p.42
Ecmascript 6, mettre en oeuvre le nouveau JavaScript
HTML5, maîtriser les API JavaScript
.... p.34
.... p.40
(réf. XAW)
(réf. DHL) Best
(réf. PXM) Best
(réf. HCS) Best
(réf. SPT)
.... p.48
.... p.50
.... p.51
(réf. PAJ)
.... p.53
Frameworks Web : AngularJS, JQuery, Sencha, Bootstrap…
ORSYS, La Grande Arche, Paroi Nord, 92044 Paris La Défense cedex. Tél : +33 (0)1 49 07 73 73. Fax : +33(0)1 49 07 73 78
page 1
Développer des applications Web Full JavaScript
(réf. FUJ) Best
.... p.55
Industrialisation Front-End, maîtriser vos pratiques de développement
AngularJS 2, maîtriser le Framework Front-End de Google
AngularJS, maîtriser le Framework JavaScript de Google
AngularJS, développement avancé
(réf. GUL)
(réf. JVS) Best
(réf. AGU) New
.... p.57
.... p.59
.... p.61
(réf. FAN) Best
.... p.63
jQuery, développer des applications Web interactives
Node.js, programmation JavaScript côté serveur
(réf. ERY) Best
(réf. NJS)
.... p.64
.... p.66
Sencha Ext-JS 6, développer des applications multiplateformes en JavaScript
BootStrap, développer des pages Web Responsive
(réf. BOO)
.... p.68
.... p.70
Sass, Compass et Less, simplifier la création et la maintenance de vos CSS
ReactJS, maîtriser le Framework JavaScript de Facebook
(réf. NCH)
(réf. TJS)
BackBone.js, maîtriser le Framework de développement Web
(réf. SSC)
.... p.72
.... p.74
.... p.76
(réf. BAB)
Conduite de projets, Webmaster, référencement
Réussir votre projet Web
(réf. COW)
.... p.78
Webmaster, le métier, les techniques
(réf. WEM)
Optimiser le référencement de votre site Web
Google Adwords, optimiser vos campagnes
.... p.80
(réf. OPS)
(réf. GAW)
.... p.81
.... p.83
Google Analytics, analyser les statistiques de vos sites
(réf. LYT)
.... p.84
Design Web
Design d'un site Web, comment faire un site attractif et efficace
(réf. ITF)
.... p.85
Créer un site Web, de la maquette Photoshop à l'intégration HTML/CSS
Responsive Web Design, créer des interfaces Web adaptables
Concevoir des maquettes d'interface graphique
Utilisabilité des applications, certification
(réf. AXU) New
(réf. PHO) Best
(réf. RPO) Best
.... p.87
.... p.89
.... p.91
.... p.93
(réf. UTL)
Réaliser vos newsletters en HTML/CSS et gérer les envois
Photoshop CC/CS6, prise en main
(réf. TOX)
.... p.94
(réf. CSN)
.... p.95
Conception et développement Web pour mobiles et tablettes
Ergonomie des IHM mobiles pour tablettes et Smartphones
Créer des applications multiplateformes pour mobiles
(réf. MOB) Best
Cordova, développer des applications mobiles multiplateformes
Concevoir des applications mobiles performantes
(réf. AMB)
.... p.97
(réf. EGO)
.... p.98
(réf. OVA)
.... p.100
.... p.102
Ionic, développer des applications mobiles hybrides multiplateformes
PhoneGap, développer des applications mobiles multiplateformes
(réf. IOC) New
(réf. PHG)
JQuery Mobile Framework, développer des applications pour mobiles
.... p.106
(réf. UER)
Sencha Touch 2, développer des applications mobiles multiplateformes
.... p.104
.... p.108
(réf. SEU)
.... p.110
Autres langages et outils
Flex et ActionScript 3.0, programmation d'interfaces Web
Django, développement Web avec Python
Webdev, développement Web
(réf. WEB)
(réf. DJA)
(réf. FLX)
.... p.112
.... p.114
.... p.116
page 2
RUBY On Rails 4, développement Web
(réf. RUR)
.... p.118
Développement Web : Java/.NET/PHP
Java EE 7, conception et développement d'applications Web
(réf. APJ) Best
Java, développement de Servlets et JSP pour JEE 6
(réf. APP)
.... p.122
Framework JSF 2, développer des applications Web
(réf. JSF)
.... p.124
Struts 2, développer des applications Web MVC
Développer une application Web 2.0/GWT
(réf. SRB)
(réf. GWT)
.... p.126
.... p.128
Mixer JSF, Ajax et Dojo pour développer des applications Web
ASP.NET MVC 6, développement d'applications Web
(réf. AST) Best
ASP.NET niveau 2, développement Web
(réf. NEA)
(réf. SLV)
(réf. JAD)
(réf. MVE) New
Silverlight 5, mise en œuvre
.... p.120
.... p.130
.... p.132
.... p.134
.... p.136
.... p.138
PHP 7 et 5, développer un site Web dynamique
(réf. ASA) Best
(réf. PHH) Best
.... p.139
.... p.141
PHP, technique avancée de développement pour le Web
(réf. PYM) Best
Zend Framework 2 et 3, maîtrise du développement Web
(réf. FAR)
.... p.143
.... p.145
Microsoft : préparation aux certifications
Programmation en C# (70-483)
(réf. NEC) New
.... p.147
Développement d'applications Web ASP.NET MVC (70-486)
(réf. AWA) New
.... p.149
Les fondamentaux du développement d'applications Windows Store en utilisant C# (70-484)
APW) New .... p.151
Développement d'applications avancées Windows Store en utilisant C# (70-485)
p.153
(réf.
(réf. AAV) New
....
Les fondamentaux du développement d'applications Windows Store en utilisant HTML5 et JavaScript
(70-481) (réf. AWH) New .... p.155
Développement d'applications avancées Windows Store en utilisant HTML5 et JavaScript (70-482)
AAW) New .... p.157
page 3
(réf.
Stage pratique de 9 jour(s)
Réf : KCS
Participants
Développeurs de sites Web,
Web designer, chef de
projet, Webmaster souhaitant
concevoir des sites Web de
type Intranet/Internet et les
promouvoir.
Pré-requis
La connaissance des bases
du Web.
Prix 2017 : 3680€ HT
Dates des sessions
Cycle certifiant Concepteur de sites Web
certificat professionnel FFP
> Technologies Web > Conception et développement Web
Ce cycle vous apprendra à concevoir des sites attractifs et efficaces répondant à la stratégie de votre
entreprise. Très concret, il vous présentera tout d'abord l'ensemble des technologies nécessaires à la
réalisation d'un site : les langages HTML, CSS et JavaScript, les techniques d'animation et l'interrogation des
bases de données. Vous verrez ensuite comment prendre en compte le design, l'ergonomie, l'accessibilité,
la gestion du contenu, l'organisation, ainsi que les techniques pour améliorer le référencement et assurer la
promotion de votre site.
OBJECTIFS PEDAGOGIQUES
Concevoir un site attractif et efficace répondant à la stratégie de son entreprise
Construire des pages Web interactives et accessibles en HTML et CSS
Interfacer le langage JavaScript avec les éléments graphiques des pages Web
Accéder aux données d'une base relationnelle
Optimiser le référencement et promouvoir son site Web
Paris
12 déc. 2016, 21 fév. 2017
18 avr. 2017, 13 juin 2017
18 juil. 2017
Composition du
cycle
1) Introduction aux technologies et serveurs
Web
2) La création de pages Web
3) La mise en œuvre de sites dynamiques
4) Le positionnement du site Web
5) Le design et l'accessibilité de son site
6) Le suivi de projet Web
7) Le référencement et la promotion du site
- Développer un site Web,
synthèse pratique
Méthodes pédagogiques
Réf : DSW, Durée : 4 j
Les stages de ce cycle peuvent être suivis dans un ordre indifférent.
- Design d'un site Web,
comment faire un site
attractif et efficace
1) Introduction aux technologies et serveurs Web
Réf : ITF, Durée : 2 j
- Optimiser le
référencement de votre site
Web
Réf : OPS, Durée : 2 j
- La gestion du nom de domaine. Le choix de l'hébergeur.
- Les serveurs Web (Apache, IIS).
- Les protocoles TCP/IP, HTTP, FTP. Les URL. Les services réseaux complémentaires (DNS, DHCP, ...).
- L'administration et la sécurisation du serveur web. Les certificats, le firewall, le proxy.
- Certification Concepteur
de sites Web
2) La création de pages Web
Réf : KCX, Durée : 1 j
- Présentation des langages HTML et XHMTL.
- Structure, liens hypertextes, images, cadres, feuilles de style, formats vectoriels, tableaux, calques...
- Les formulaires. Contraintes et avantages. Structure, champs de saisie, boutons, cases à cocher, listes...
- Norme d'accessibilité. Impact sur le développement.
- Les composants Flash, Java, ActiveX, plug-ins.
- La conception graphique et multimédia.
- Le développement d'animations avec Flash.
- Les ressources graphiques GIF, JPEG, PNG, Shockwave.
- Le langage JavaScript et DHTML : syntaxe du langage. Contrôles de saisie d'un formulaire. Gestion des
cookies.
- DOM et Ajax.
- Présentation ECMAScript et d'ActionScript.
- Technologies Web 2.0 : présentation des blogs et wikis, des Rich Internet Applications, d'AIR, de SilverLight
et de GWT.
- Dreamweaver CS6,
développer un site Web
Réf : HTX, Durée : 4 j
- JavaScript, HTML
dynamique
Réf : DHL, Durée : 4 j
- Ajax, programmation côté
client
Réf : PAJ, Durée : 3 j
- Certification Développeur
Web côté client
Réf : KEX, Durée : 1 j
- HTML5, CSS3, orienter
votre conception vers des
sites Web modernes et
dynamiques
Réf : HCS, Durée : 2 j
Travaux pratiques
Réalisation de pages complexes HTML avec Dreamweaver. Création de feuilles de style. Conception d'un
modèle de page HTML avec Fireworks, composant Flash. Utilisation du JavaScript pour ajouter des effets
DHTML et des contrôles sur formulaire, gestion d'événements en JavaScript.
- JavaScript,
perfectionnement
3) La mise en œuvre de sites dynamiques
Réf : JPG, Durée : 4 j
- Mode de fonctionnement, sécurité. Variables serveur.
- Les serveurs Web du marché.
- Les langages serveur et leurs plateformes de développement : ASP, ASPX, JSP, PHP.
- Appel de services Web. Accès aux bases de données.
- AngularJS, maîtriser le
Framework JavaScript de
Google
Réf : FAN, Durée : 3 j
- Responsive Web Design,
créer des interfaces Web
adaptables
Travaux pratiques
Réalisation d'un formulaire avec envoi des données vers le serveur. Développer des pages dynamiques,
interrogation d'une base de données, de services Web.
Réf : RPO, Durée : 2 j
4) Le positionnement du site Web
- Industrialisation FrontEnd, maîtriser vos pratiques
de développement
- Intranet, Internet, Extranet. Stratégie de l'entreprise et conception du site. Techniques SWOT.
- Quel design en fonction des terminaux mobiles ?
page 4
Réf : JVS, Durée : 3 j
- Optimiser ses chances d'atteindre sa cible.
d'applications Front-End
5) Le design et l'accessibilité de son site
Réf : KYF, Durée : 1 j
Dates d'examen
21 novembre 16
13 mars 17
09 juin 17
06 octobre 17
15 décembre 17
- Comportement des utilisateurs Internet, Intranet. Définition de l'usability.
- Erreurs traditionnelles des sites.
- Techniques de conception et de tests.
- Les standards et contraintes des terminaux Web.
- Techniques éditoriales pour le Web.
- Comment créer une navigation fluide.
- Accessibilité : point sur la législation en France et en Europe. Référentiels d'accessibilité : W3C, WCAG...
- L'impact d'une charte d'accessibilité sur le développement HTML et CSS.
- L'ADAE et l'accessibilité.
- La conception et la gestion de contenu. Méthodologie de création de rubriques.
- Organisation du contenu, publication. Outils de gestion de contenu. Contenu multisource.
- Stratégie, comment décliner sa marque ? Comment lier le design Web à la stratégie ?
- Comment valoriser une marque à partir du design ?
- Brief créatif, stratégie créative.
- Concept board. Charte graphique.
Travaux pratiques
Tester l'accessibilité d'un site. Création d'une page valide et accessible. Correction des erreurs
d'accessibilité. Définir une charte graphique et utiliser un outil de maquettage fonctionnel.
6) Le suivi de projet Web
- Audit juridique du site : les risques.
- Pilotage de projets. Maquettage, développement, déploiement, campagne de lancement. Organisation
humaine du projet.
7) Le référencement et la promotion du site
- Quel type de moteur de recherche utiliser ?
- Comprendre les techniques de recherche.
- L'audit de référencement : mesurer son positionnement sur Internet.
- Audit par mots-clés, par rapport aux concurrents. Outils d'audit. Audit de Page Rank, popularité.
- Analyse et plan d'action.
- Les techniques de référencement : référencement par indexation, par positionnement. Définition d'un bon
référencement.
- Les SEO : Search Engine Optimizer.
- Les outils de référencement automatique.
- Stratégie Pull ou Push. Paiement au clic. Liens sponsorisés. Liens contextuels.
- Achat de mots-clés : comment les choisir ? Interface de pilotage de Google AdWords.
- L'optimisation du site web.
- Test des mots-clés. Optimisation technique : url, alt...
- Impact des technologies riches sur le référencement.
- Promouvoir son site. Mise en place d'une campagne de publicité Web. Outils d'analyse de logs.
- Techniques d'animation. NetLinking, jeux-concours... Affiliation, fidélisation, sponsoring, relations presse.
Travaux pratiques
Référencement sur de multiples moteurs, annuaires, zones dédiées. Mise en œuvre d'un audit de site Web,
d'outils de référencement et des différentes techniques. Mise en place d'une campagne de référencement.
Les éléments clés.
page 5
Stage pratique de 12
jour(s)
Réf : KWC
Participants
Concepteurs et informaticiens
désireux de maîtriser les
techniques permettant de
développer des sites Web
interactifs en HTML, XHTML,
CSS, JavaScript, et Ajax.
Pré-requis
Informaticiens connaissant les
principes de l'Internet et ayant
des bases en développement.
La pratique d'un langage de
programmation sera un plus.
Prix 2017 : 4790€ HT
Dates des sessions
Paris
15 nov. 2016, 14 mar. 2017
27 juin 2017
Composition du
cycle
synthèse pratique
- Optimiser le
Web
de sites Web
- Dreamweaver CS6,
- JavaScript, HTML
dynamique
client
Web côté client
dynamiques
- JavaScript,
perfectionnement
Google
adaptables
Cycle certifiant Développeur Web côté client
certificat professionnel FFP
Ce cycle très complet vous apprendra à créer des sites Web interactifs, en mettant en œuvre HTML, XHTML,
CSS, JavaScript et Ajax. Vous verrez les fonctionnalités proposées par l'atelier Dreamweaver CS6 pour créer
vos pages ainsi que le langage JavaScript pour augmenter l'interactivité de vos sites Web.
Prendre en main un environnement de développement Web
Construire des pages Web interactives et accessibles en HTML
Mettre en forme graphiquement des pages Web au moyen des feuilles de style CSS
Interfacer le langage JavaScript avec les éléments graphiques des pages Web
Mettre en œuvre de requêtes asynchrones et multithreads en Ajax
1) Les technologies du Web
2) La création de pages et de sites Web
3) Le HTML dynamique et le JavaScript
4) La programmation Ajax
5) Les frameworks Ajax
Le socle des apprentissages en conception de pages Web est fondamental pour l'acquisition des
connaissances du cycle. Le stage correspondant, réf HTX, doit être le premier stage du cycle, suivi des
stages DHL, puis PAJ, dans cet ordre.
- Le fonctionnement du Web. Postes clients et serveurs.
- Les protocoles Internet : HTTP, FTP, NNTP, SMTP, POP3.
- Les sites Web : Intranet, Internet, Extranet, B2B, B2C.
- Plateforme d'hébergement, navigateurs et langages.
2) La création de pages et de sites Web
- Présentation et prise en main du studio Dreamweaver.
- Création d'un site Web : choix techniques, compatibilité.
- Description des langages HTML et XHTML.
- Publication du site et maintenance du code.
- Création d'un modèle de page.
- Les feuilles de style CSS. Création de formulaires. Eléments. Méthodes GET/POST.
- Construction de la charte graphique. Règles d'utilisabilité.
- Accessibilité : la priorité 2 du WAC/W3C.
- Intégration d'animations graphiques, de composants graphiques. Les plug-ins. L'inspecteur de tags.
- Le rôle du JavaScript. Création dynamique de code JavaScript.
- L'accès aux bases de données. Paramétrage d'une connexion ODBC. Consultation d'une base de données
avec Dreamweaver.
- Génération de tableaux dynamiques. Utilisation des tables pour des formulaires.
- L'authentification utilisateur. Gestion des formulaires de login. Contrôle conditionnel d'accès aux pages.
Travaux pratiques
Création d'un espace de projet de site Web. Développement de pages XHTML, de CSS, de tableaux.
Création de formulaire. Test de compatibilité XHTML et d'accessibilité. Reproduire une charte graphique
fournie. Intégration de composants multimédias. Connexion à une base de données.
3) Le HTML dynamique et le JavaScript
- Les types de navigateurs et la portabilité.
- Les langages de scripts. Impact de JavaScript sur l'accessibilité. Importance de XHTML sur l'utilisation de
JavaScript.
- Méthode de développement JavaScript en équipe.
- Positionnement et illustration des technologies DHTML.
- Langage JavaScript : concepts de la programmation Objet. Syntaxe : types, variables, tableaux, itérations,
fonctions...
- Accès aux ressources du navigateur : plug-ins...
- Manipulation de contenu de formulaires. Fonctions de validation. Evénements liés aux éléments de
formulaire.
- L'interaction avec les feuilles de style en cascade. CSS multiples, héritages multiples, règles de priorité.
- Les blocs de texte, les calques et les couleurs.
- Accès et modification des styles.
- Outils pour manipuler les feuilles de style.
page 6
de développement
Dates d'examen
12 décembre 16
10 février 17
05 mai 17
08 septembre 17
01 décembre 17
- La structure XML. Les moyens de validation XML : DTD et XSD. Les parseurs XML et le DOM. Manipulation
du DOM.
- Les événements et données. Comment programmer des écouteurs d'événements ?
- Les traitements événementiels JavaScript.
- Les redirections http. Gestion des cookies.
Travaux pratiques
Mise en œuvre des différentes fonctionnalités JavaScript. Conception de fonctions personnalisées contrôlant
les activités de l'utilisateur. Manipulation de feuilles de style via JavaScript. Manipulation du DOM. Gestion
d'événements sur les éléments du formulaire.
4) La programmation Ajax
- Présentation d'Asynchronous JavaScript And XML. Objectifs. Principes de fonctionnement.
- Force du mix technologique Ajax/REST/Web 2.0.
- Présentation Ajax (GMail, GMaps, Google Suggest...).
- JavaScript Object Notation (JSON). Avantages et inconvénients. Objets, Arrays, syntaxe et parseur JSON.
- Les traitements XML en JavaScript. Présentation XSLT et du langage XPath. Le format RSS.
- La classe XMLHttpRequest. Créer un objet XMLHttpRequest.
- Dialoguer en mode synchrone/asynchrone avec le serveur.
- Les patterns Ajax.
- Ajax et HTML 5. Nouveaux événements.
- Sécuriser des échanges Ajax (cryptage, sessions...).
Travaux pratiques
Création d'une structure XML bien formée et validée. Mise en œuvre. Traitement XSLT. Utilisation de
flux RSS. Création d'un formulaire de login. Remplissage dynamique d'un menu déroulant. Traitement de
données RSS à partir de flux Ajax. Création en JavaScript d'une application de cartographie.
5) Les frameworks Ajax
- Pourquoi utiliser les frameworks.
- Les frameworks JavaScript.
- Présentation et mise en oeuvre du framework jQuery.
- Les API Google : Google Search et Google Maps.
page 7
Stage pratique de 15
jour(s)
Réf : KDF
Participants
Développeurs et Chefs de
projet Web.
Pré-requis
Connaître les principes
de l'Internet et des bases
en développement. La
pratique d'un langage de
programmation sera un plus.
Prix 2017 : 6410€ HT
Dates des sessions
Paris
1 déc. 2016, 12 jan. 2017
9 fév. 2017, 2 mar. 2017
6 avr. 2017, 2 mai 2017
1 juin 2017, 6 juil. 2017
31 aoû. 2017
Composition du
cycle
synthèse pratique
Cycle certifiant Développeur d'applications Front-End
New
Responsable de l'ergonomie visuelle et de l'ergonomie fonctionnelle d'un site Web, le développeur
d'applications Front-End doit posséder à la fois des compétences en Web Design et en développement.
Ce cycle vous apportera toutes les compétences en HTML 5, CSS 3 et JavaScript nécessaires au
développement de sites responsives. Vous gagnerez en efficacité lors de vos développements par la mise en
œuvre d'AngularJS, la référence des infrastructures JavaScript côté client. Vous découvrirez également les
outils qui vous permettront d'industrialiser vos développements.
Concevoir et développer des applications Web modernes et dynamiques en HTML 5 et CSS 3
Rendre Responsive Design les pages Web d'un site
Interfacer le langage JavaScript avec les éléments des pages Web
Gérer des échanges asynchrones Ajax
Développer des applications Web performantes avec AngularJS
Optimiser les temps de développement par la maîtrise des utilitaires modernes
2) Les balises HTML 5
3) Les sélecteurs CSS 3
4) Les aspects avancés du langage JavaScript
5) Le Framework AngularJS
6) Le Responsive Web Design
7) Industrialisation du Front-End
Le socle des apprentissages en conception de pages Web est fondamental pour l'acquisition des
connaissances de ce cycle. Le stage correspondant, réf HCS, doit être le premier stage du cycle, suivi du
stage DHL. Les cours RPO, FAN et JVS peuvent-être ensuite suivis dans un ordre quelconque.
- Optimiser le
Web
de sites Web
- Dreamweaver CS6,
- JavaScript, HTML
dynamique
client
Web côté client
dynamiques
- La structure composite d'un document HTML : images, CSS, JavaScript...
- Le modèle de document (DOM).
- Le protocole HTTP.
- Interaction client/serveur HTTP.
- Interprétation du HTML par le navigateur.
2) Les balises HTML 5
- Les éléments traditionnels structurant un document HTML (doctype, html, head, body, meta).
- Les éléments structurants HTML 5 (nav, section, article, aside, header, footer).
- Les catégories de contenus (Metadata content, Flow content, Sectioning content...).
- Les nouvelles balises : <mark>, <meter>, <time>, <figure>...
- Les microformats. Présentation et avantages sur le référencement.
- Les nouveaux champs de formulaires : range, autofocus, placeholder...
- Gestion vidéo et audio avec les nouvelles balises <audio> et <video>.
- Les images SVG pour le dessin vectoriel.
- Les canevas pour le dessin "bitmap".
Travaux pratiques
Mise en place et validation de la structure d'un document HTML 5. Création de templates HTML 5.
Réalisation d'un lecteur multimédia.
- Rappel sur la syntaxe : les sélecteurs, les règles.
- Sélecteurs de répétition, de cible, d'enfant unique et de frère antérieur.
- Media Queries pour le chargement conditionnel des CSS selon la résolution ou l'orientation du terminal.
- Les couleurs. Les modèles hsl et hsla. La propriété opacity.
- La mise en forme du texte. Gestion des débordements. Gestion des enchaînements.
- Les modes multicolonnes avec column-count, column-width...
- La mise en forme des boîtes. Les ombres. Les coins arrondis.
- La mise en forme des fonds. Les gradients de fond. Les fonds ajustés aux conteneurs.
- Les transformations : translations, rotations, homothéties.
- Les animations : les animations, les transitions.
adaptables
Travaux pratiques
Application de couleurs. Mise en forme de textes. Appliquer des ombres et des arrondis. Animations et effets
de transition.
- JavaScript,
perfectionnement
Google
page 8
de développement
Dates d'examen
03 mars 17
19 mai 17
29 septembre 17
10 novembre 17
4) Les aspects avancés du langage JavaScript
- Les nouveautés principales d'ES6/2015
- Les superset JavaScript : TypeScript, Babel, Traceur.
- Fonctionnement et intégration du Framework jQuery.
- jQuery pour des échanges Ajax et la gestion des formulaires.
- JavaScript et la Programmation Orientée Objet.
- Méthodes. Héritage. Portée des données privées et publiques. Mapping et sérialisation.
- Structure et syntaxe d'une expression régulière.
- Maîtrise de l'environnement de débogage.
- Solution de stockage embarquée de données : SQLite, LocalStorage, Cookies.
- Appréhender la notion de JavaScript côté serveur avec Node.js
- Programmation JavaScript sous HTML5.
Travaux pratiques
Créer un Plug-in jQuery. Mise en pratique de la POO. Optimisation des performances avec les
ChromeDevtools. Appel de services Web. Utiliser une base embarquée. Manipulation des API JavaScript
HTML5.
5) Le Framework AngularJS
- Fonctionnalités et principes généraux.
- Directives AngularsJS, compilateur HTML.
- Expressions. Data-Binding bidirectionnel. Filtres.
- Création et utilisation des contrôleurs. Gestion du contexte, la variable $scope.
- Propagation des événements. API. Dirty Checking.
- Principe de l'injection de dépendance.
- Notion de module. Configuration.
- Définition des routes : Routing. API ($routeProvider). Le "deep linking".
- Fonctionnalité de données, Echange Serveur.
- Utilitaires de test : Jasmine. Angular-scenario. Test : contrôleurs, services... Utilisation avec Karma.
Travaux pratiques
Préparation d'une maquette HTML pour développer avec AngularJS. Modularisation de l'application. Création
d'une "Single Page Application".
6) Le Responsive Web Design
- Types de terminaux (mobile, tablette...) et leur résolution. Périphériques, OS, navigateurs.
- Démarche de conception : concept de Marcotte, Mobile First.
- Adaptation des CSS aux caractéristiques du terminal. Les MediaQueries.
- Principe de grille flexible, fluide. Points de rupture. Principe des box, layout avec CSS3.
- Contenu Responsive : rupture texte, multicolonnes. Césure et découpe.
- Les Frameworks et librairies Responsives (BootStrap, Less...).
Travaux pratiques
Construction de CSS selon les modes portrait/paysage, résolution du terminal. Construire une ergonomie
basée sur une grille flexible.
7) Industrialisation du Front-End
- Composants d'une application Web, le "SuperSet JavaScript".
- Choisir l'environnement de développement (SublimeText, Eclipse, Cloud 9...).
- "Versionner" avec GIT. Organiser les branches de développement.
- Node.js comme utilitaire de développement. Le Node Package Manager et Bower.
- Automatisation des tâches avec GRUNT.
- Intégration des tests automatisés. Utilitaires de test : Jasmine, Mocha...
- Créer un template de projet. Quels utilitaires : Yeoman, Lineman ?
Travaux pratiques
Personnaliser l'IDE SublimeText. Mise en place d'un processus de développement en branches. Créer
un module pour configurer les dépendances du projet. Tests unitaires avec Jasmine. Automatisation avec
Karma.
page 9
Séminaire de 3 jour(s)
Réf : IRT
Participants
Chefs de projets, décideurs
informatiques, développeurs,
responsables informatiques,
Webmasters.
Pré-requis
Aucune connaissance
particulière.
Prix 2017 : 2680€ HT
Dates des sessions
Les technologies du Web, synthèse
Best
Ce séminaire de synthèse vous permettra de faire un point complet sur les technologies du Web. Il vous
présentera d'une manière simple et concrète les infrastructures et les techniques sous-jacentes, les
standards et les outils disponibles pour développer des applications efficaces et sécurisées. Il vous montrera
l'impact de l'introduction des nouvelles technologies telles que la mobilité ou le commerce électronique sur
les applications et plus généralement sur les comportements et la société.
Comprendre les concepts des technologies du Web
Connaître les infrastructures et les services de base d'internet
Découvrir les nouvelles technologies côté client et côté serveur
Connaître les nouvelles architectures et leur sécurité
Paris
4 oct. 2016, 6 déc. 2016
4 avr. 2017, 27 juin 2017
Bruxelles
21 nov. 2016, 19 juin 2017
Geneve
1) Le système d'information
2) Fonctionnement d'une infrastructure Internet
3) Les services de base
4) La sécurité
5) Technologies côté client
21 nov. 2016, 19 juin 2017
Luxembourg
6) Technologies côté serveur
7) Les serveurs Web et les serveurs
d'applications
8) Les architectures distribuées et les Web
Services
9) Mobilité
10) Comprendre le Digital
21 nov. 2016, 19 juin 2017
1) Le système d'information
- Rôle des applications intranet, Internet, Extranet dans le SI.
- Nouvelle infrastructure. Evolution vers les architectures n-tiers.
- Evolution vers le Cloud Computing.
2) Fonctionnement d'une infrastructure Internet
- Architecture. Protocoles IP, IPv6, GeoIP. Adressage, ports applicatifs, DNS, routage. Qualité de service
MPLS.
- Impact du réseau sur les performances web.
- Topologie du réseau : fournisseurs d'accès. Opérateurs. Evolution vers les hauts débits : fibre optique
FTTH.
3) Les services de base
- Messagerie : MIME. Les protocoles (POP3, IMAP4, SMTP). Le spam. Clients et serveurs de messagerie.
- Annuaires : concept. Gestion des utilisateurs, Whois, X.500. Protocole LDAP. LDIF. OpenLDAP, Domino.
Critères de choix.
- Moteurs de recherche : indexation, référencement, analyse du trafic, liens sponsorisés (Criteo, Adwords).
- Outils collaboratifs : quels outils pour quels besoins ? Portail, blog, wiki, bureautique en ligne...
- Réseaux sociaux d'entreprise, les espaces collaboratifs, les CMS (SharePoint, Joomla, Drupal...).
- Multimédia sur IP : image, son, vidéo à la demande, streaming. Diffusion multicast. IPTV. Protocole SIP,
VoIP, H323.
- Le commerce électronique : principe. Les plateformes (Prestashop...). Le e-paiement.
4) La sécurité
- Les types d'attaques sur TCP/IP.
- Services de sécurité : confidentialité, authentification, intégrité, refus de service, non-répudiation.
- Authentification : oAuth, Active Card, Secure ID, biométrie... SSO, authentification Kerberos...
- Sécurité d'accès : le firewall, le proxy. Architecture, la DMZ. Le filtrage de paquets, les routeurs filtrants,
ACL.
- Réseau privé virtuel : VPN. Fonctionnement IPSEC, les protocoles sécurisés L2F, PPTP. Tunnel de
sécurité, SSH.
- Cryptographie : législation. Clé publique (PKI/EGC), certificat, signature électronique, SSL. Le tiers de
confiance.
- Obligations légales : CNIL, normes ISO 2700x.
5) Technologies côté client
- Les navigateurs, leurs impacts. Les plug-ins. Les URI, le protocole HTTP.
- Les langages HTML5, CSS3 et JavaScript. Les apports d'EcmaScript 6.
- Les API JavaScript HTML 5 (gestion de la persistance, accès aux ressources des terminaux...).
- Les frameworks JavaScript (AngularJS, jQuery...).
- Les spécificités des terminaux mobiles et des tablettes : taille écran, capacité mémoire, OS...
page 10
- Impact des terminaux mobiles, tablettes, ordinateurs sur les interfaces web : le Responsive et le Material
Design.
- Les technologies d'industrialisation du Front End (Grunt, Bower, Yeoman, Jasmine...).
- Le langage XML, les XML Schema. Les parseurs.
- Les interfaces graphiques XML : SVG, XAML. Définition des interfaces Android via XML.
- Les interfaces riches et leur ergonomie : Java FX8, QT, Flash.
- Les traitements XSLT. La publication avec XSL-FO. Les services Web.
6) Technologies côté serveur
- Les architectures n-tiers. Les approches orientées composants.
- L'architecture Java EE (JSF, JPA, EJB, JAX-RS...). Le framework Spring.
- Le framework .NET et les frameworks associés (NHibernate...).
- PHP, Zend Framework 2, Symfony 2.
- Genèse du JavaScript côté serveur et de Node.js. Le moteur Google V8.
- L'accès aux données.
7) Les serveurs Web et les serveurs d'applications
- Les serveurs : bases de données, applications, Web. Leur positionnement par rapport à Internet.
- La répartition de charge et la haute disponibilité, NginX. L'approche cluster.
- Les serveurs Web (Apache, IIS...). Serveurs JavaScript NodeJS. Hébergeurs.
- Les serveurs d'applications. Service de présentation, d'objets distribués, d'administration...
- L'offre commerciale : IBM WebSphere, Oracle Application Server...
- L'offre Open Source : Tomcat, JBoss WildFly, GlassFish...
8) Les architectures distribuées et les Web Services
- Les standards (SOAP, WSDL, UDDI, BPML, BPEL), mise en œuvre.
- Les services Web SOAP et REST. La connexion des Web Services aux applications existantes.
- Les architectures SOA. Spécificités. Panorama des autres technologies.
- Les plateformes de Cloud Computing : IAAS, PASS, SAAS (Amazon Web Services, Azure...).
- Le Big Data et le NoSQL (Hadoop, Cloudera, MongoDB, Cassandra).
- La virtualisation des ressources.
9) Mobilité
- Les PAN et les normes WI-FI, Wimax, Bluetooth. Réseaux LAN, Wireless Wan, boucle radio.
- Technologies en environnement cellulaire : réseaux haut débit. 3G, 4G. La VoIP sur LTE (VoLTE).
- Réseaux haut débit. Réseaux privés sans fil. IP en environnement mobile. Terminaux nomades. La sécurité.
- Les objets connectés. Les réseaux bas débit de l'iot : SigFox, LoRa...
10) Comprendre le Digital
- Différence entre Numérique et Digital.
- e-Réputation et publication web.
- Enjeux des données privées, règlementation européenne.
- Impact du time to market sur les risques pour l'entreprise.
page 11
Cours de synthèse de 3
jour(s)
Réf : ACS
Participants
Chefs de projets,
décideurs informatiques,
développeurs et responsables
informatiques.
Pré-requis
Connaissances de base en
architecture applicative.
Prix 2017 : 2240€ HT
Dates des sessions
Paris
28 nov. 2016, 28 mar. 2017
6 juin 2017
Conception d'architecture Web
technologies, usages et impacts sur le SI
Ce séminaire aborde l'état de l'art des technologies web et de leurs implications sur les SI d'entreprise. Il
apporte une synthèse complète, structurée et didactique des connaissances aujourd'hui indispensables
en matière de conception d'architecture Web. Il analyse ses domaines d'application, évalue l'offre du
marché, examine les démarches pratiques de mise en œuvre, en insistant sur les impacts technologiques,
organisationnels et méthodologiques.
Comprendre les impacts des technologies web sur les SI d'entreprise
Comprendre la rôle des différents technologies au sein d'une architecture web
Découvrir les différents usages et services accessibles via le web
Découvrir les démarches pratiques de mise en œuvre des technologies web
1) L'architecture des applications Web, état de
l'art
2) Applications et composants côté client
3) Rôle d'XML dans l'architecture applicative
4) Développement des composants applicatifs
5) Espace de publication
6) Espace de collaboration
7) Applications métiers
8) Impacts sur la sécurité du SI
9) Impacts sur la gestion des données de
l'entreprise
10) Conception et démarche de mise en œuvre
1) L'architecture des applications Web, état de l'art
- Comprendre l'évolution et les enjeux des SI.
- Les architectures Intra-Inter-Extra Net.
- Le marché des clients. Les serveurs et la virtualisation.
- Le client léger à tout prix ? La mobilité a un prix mais répond à de nouveaux besoins.
- Applications et composants côté client.
- Hébergement interne, mutualisé, solutions Cloud hybride, privé. Impact applicatif.
2) Applications et composants côté client
- L'ergonomie des applications : responsive, material, impact MVC.
- Le JavaScript. Les composants Java, JavaFX, Flex, SVG et Canvas.
- Quel avenir pour les plugins et les web composants ?
- Quelles limites pour le déploiement multi canaux ?
- HTML5 : opportunités pour les applications métier avec ses API et CSS3.
- Les formats Widgets, Gadgets, MicroFormats.
- La mode Ajax et les frameworks de développement (AngularJs, jQuery, GWT...).
- Quelle frontière entre les composants Desktop (RDA) et Internet (RIA) ?
3) Rôle d'XML dans l'architecture applicative
- Présentation d'XML. Les moteurs de transformation XSLT et les parseurs XML.
- Les services Web, leur connexion avec les applications existantes.
- Les protocoles XML (SOAP, WSDL). Le protocole REST. Le format JSON
- Impact XML sur les applications Web. Adoption de XML comme référentiel de métadonnées (DSML, XMI...).
4) Développement des composants applicatifs
- Les scripts PHP, JSP, ASPX, JavaScript. Les approches orientées composant (EJB d'Oracle,
Microsoft .Net).
- Les "Web services", standards (REST, SOAP, WSDL...), développements (Microsoft .NET, Oracle...).
- L'offre de serveurs d'applications : WebSphere, Microsoft serveur, Oracle Application Server 10g, JBoss
Wildfly, Tomcat.
- L'architecture .NET. Mode de fonctionnement et implémentation (Framework, ASP .NET, Common
Language Runtime...).
- La plate-forme Java EE. Le concept d'indépendance des plates-formes matérielles d'exécution.
- Les frameworks Java en vogue (Spring, Hibernate, JSF). Les Design Patterns.
5) Espace de publication
- Le Web, support de publication-diffusion. Les services : publication de documents et de données.
- La recherche de documents.
- Les technologies des moteurs : indexation "full-text", statistique, sémantique, linguistique.
- Panorama des offres : Lucene, Verity, Convera...
- La gestion de contenu (CMS). La prise en charge du cycle de vie et de validation du document.
- Gestion de métadonnées XML, des habilitations, des workflows de validation, de la présentation...
- Offres de CMS (Drupal, Alfresco, Joomla, Spip...).
page 12
- Importance des versions d'outils bureautiques orientées XML (OpenOffice/OpenDocument).
6) Espace de collaboration
- Les protocoles SMTP, POP3, IMPA4. Le protocole MIME. Les annuaires et le protocole LDAP.
- L'ouverture des messageries vers le Net. L'avènement de la messagerie instantanée (Google, Microsoft,
Facebook, Skype).
- Perspective en matière de gestion d'agenda partagé. Utilisation des messageries SMS et du Push Mail.
- Les forums et les groupes de travail. Quels domaines applicatifs pour le travail collaboratif ? Blog et Wiki.
- Le workflow via le Net. Circulation de formulaires, suivi de processus et coordination de tâches.
7) Applications métiers
- Le portail d'intégration. Syndication des sources de contenus et de services.
- Les portails : point d'accès unique, personnalisation des services en fonction de l'utilisateur.
- Les offres éditeurs : LifeRay, IBM... L'open source : Drupal, SPIP...
- L'engouement pour la SOA et l'offre du marché. Tibco, Microsoft, Oracle, IBM...
- Les enjeux véritables du concept de SOA.
- Relation Client, Business Intelligence et DataWeb.
8) Impacts sur la sécurité du SI
- La sécurité : avant tout une approche globale. Les nouveaux risques. Les moyens disponibles.
- Le rôle de la sécurité dans la distribution des composants.
- Mise en place d'une PKI et de certificats dans l'architecture Intranet.
- Protocoles SSL, HTTPS, oAuth et les solutions SSO.
- MDM, gestion du parc et de la sécurité en environnement BYOD, multi canaux.
- Les solutions pour les applications de e-commerce.
9) Impacts sur la gestion des données de l'entreprise
- Intégration des données de l'entreprise.
- SGBD du marché : Oracle, SQL Server, MySQL, PostgreSQL.
- Interfaçage avec le Web. Evolution. Les bases de données dans les clouds .
- Big Data : impact sur les architectures temps réel (lambda), comment gérer de grosses volumétrie.
- Renforcement du Business Intelligence au cœur de l'architecture.
- Exemple de l'architecture et fonctionnement Hadoop (requêteur, Data Mining, ...).
10) Conception et démarche de mise en œuvre
- La charte graphique et l'utilisabilité, obtenir un label AccessiWeb.
- La charte d'ergonomie : rôle, contenu technique...
- Impact des technologies web : tests, conduite de projet, réalisation d'un cahier des charges fonctionnel et
ergonomique.
- Rôle de la maquette, comment la réaliser. Le POC : quelles techniques de maquettage ?
- Les principes d'interaction à respecter, par quoi commencer, quelles sont les compétences à avoir ?
- Méthodologie du projet Web. Quelle méthodologie ?
- L'inventaire des sources documentaires, applicatives, décisionnelles. Conserver une cohérence globale de
l'information.
- Quels nouveaux services proposer ? Déterminer les processus de validation et de sécurisation. Etablir le
plan du site.
- Quel recours à l'externalisation ? Quels apports ? Quelle réalité pour le "bureau virtuel" ?
page 13
jour(s)
Réf : JET
JavaScript au cœur des architectures Web, état de l’art
Participants
Ce séminaire vous présentera l'importance du JavaScript dans les architectures orientées web et mobiles.
Vous découvrirez différents frameworks de conception et solutions d'industrialisation du Front. Il vous aidera
également à mieux comprendre l'impact du JavaScript sur l'organisation et la productivité des équipes.
Développeurs, chefs de
projets et architectes.
Pré-requis
Aucune connaissance
particulière.
Prix 2017 : 920€ HT
Dates des sessions
Paris
9 déc. 2016, 10 mar. 2017
23 juin 2017
Découvrir les solutions d'industrialisation du Front-End
Découvrir les principaux Framework JavaScript et leurs impacts sur la conception d'applications Web
Comprendre l'impact du JavaScript sur l'organisation et la productivité des équipes Web
Maîtriser les architectures Web applicatives.
1) Evolution du JavaScript / Les outils du FrontEnd
2) Frameworks JavaScript, API HTML 5 /
JavaScript au service du Responsive
3) Traitements multithread / Protocoles de
communication
4) Mode déconnecté / Sécurité
1) Evolution du JavaScript / Les outils du Front-End
- Les langages Ecmascript. Programmation et concepts Objet.
- Evolution vers ECMAScript 6 : constructeurs, polymorphisme, fonctions, array, déclaration et portée de
variables.
- CoffeeScript et la programmation Objet renforcée, TypeScript, MetaScript.
- Présentation de Grunt et des traitements pour minifier CSS, JavaScript.
- Gestion des packages avec Bower. NPM et l'environnement collaboratif de composants.
- Synchronisation navigateur/développements (Browsersync...).
- Environnement de test avec NodeJS. Les outils de débogage et de profiling.
- Présentation de Chrome devtools (profiling mémoire, remote debug...).
2) Frameworks JavaScript, API HTML 5 / JavaScript au service du Responsive
- Frameworks de composants graphiques et technique (jQuery, prototype...).
- Frameworks MVC clients Backbone, AngularJs, EmberJS.
- Frameworks mobile (jQuery Mobile, Sencha...).
- Framework NodeJS (du JavaScript côté serveur).
- API HTML 5 : graphisme et accès aux ressources des terminaux (gyroscope, rotation, caméra...).
- Importance de JavaScript dans le Responsive. Gestion des images retina.
- Contrôle des ressources disponibles et chargement dynamique. Impact du Responsive sur la performance,
solutions.
- Quel rôle attribuer au JavaScript et au design (HTML CSS) ? Répartition des rôles.
3) Traitements multithread / Protocoles de communication
- Les Webworkers, impact sur l'organisation logiciel et la construction de Framework.
- Programmation asynchrone, solutions, organisation.
- Ajax 2, opportunité sur les échanges Client/Serveur.
- Echange multi frame (PostMessage).
- Websocket et opportunités (push...).
- SOAP : point sur les appels client.
- Solutions collaboratives et protocoles OT: sharejs, togetherjs...
4) Mode déconnecté / Sécurité
- Mise en place d'une solution embarquée.
- Gestion des chargements du cache (manifest et ses API).
- Stockage de données : LocalStorage, SessionStorage, EmbededDB...
- Sécurisation des codes JavaScript.
- Protection XSS, CRSF.
- Encodage et pratique de modification du DOM.
- Stockage de données.
page 14
jour(s)
Réf : XML
Participants
Architectes des systèmes
d'information, responsables
de projets, analystes et
développeurs désirant
comprendre XML et JSON,
de manière à les mettre en
œuvre dans des architectures
Web.
Pré-requis
architectures applicatives et
développement logiciel, en
particulier dans le domaine du
Web.
Prix 2017 : 1730€ HT
Dates des sessions
Paris
8 déc. 2016, 30 mar. 2017
8 juin 2017
XML & JSON, synthèse
Best
Standards incontournables dans les échanges de données textuelles sur le Web, XML et JSON ont pris
une place majeure dans les applications Web, les systèmes d'information, l'intégration de données et
d'applications. De son côté XML, à la base de nombreux autres langages, s'est entouré d'une multitude
d'outils pour la définition et la manipulation de données. JSON quant à lui, propose un format de données
plus simple et s'intègre plus facilement avec les langages de programmation. Ce séminaire vous propose une
vision exhaustive des usages de XML et de JSON au sein des systèmes d'information.
Lire et comprendre des documents XML et JSON
Modéliser et définir des données en XML et JSON
Choisir les outils adaptés aux besoins de votre application.
Comprendre la place de XML et de JSON dans les architectures Web
1) Concepts de base
2) Introduction à XML et JSON
3) Définition de données XML avec DTD et
XMLschema
4) Définition de données JSON
5) Navigation dans les arbres XML avec Xpath
6) Le langage de styles XSL
7) Traitement de XML avec SAX et DOM
8) Bases de données XML et JSON
9) Architecture SOA et Web Services
1) Concepts de base
- Gestion de documents : structure, contenu et présentation.
- Langages à balises : SGML, HTML et CSS. Comparaison avec les langages WYSIWYG.
- Le Web 2.0, XML et JSON. Communication navigateur-serveur asynchrone avec AJAX.
- Le client riche avec les technologies HTML5, CSS3 et JavaScript. Place de XHTML 2.0 ?
2) Introduction à XML et JSON
- Le modèle de données XML : éléments et attributs, document bien formé et valide.
- Représentation sérialisée ou arborescente, le modèle logique XML Infoset, le parsing de XML
- La galaxie XML : standards techniques et standards métiers.
- XML et bureautique : les standards Open Document d'Open Office et OpenXML de Microsoft. EXI : l'XML
compressé.
- Le modèle de données JSON : objet, tableau et valeurs littérales.
- Intégration avec les langages de programmation (JavaScript, PHP...). Les frameworks utilisant JSON
(jQuery, Angular...).
- Le parsing de JSON. Différences avec XML.
- Les outils de développement XML et JSON.
3) Définition de données XML avec DTD et XMLschema
- Document Type Definition (DTD) et typage des documents.
- Définition d'éléments, d'attributs, d'entités ; éléments simples et composés, entités paramètres.
- XMLschema : type simples et types complexes, déclaration des éléments et des attributs.
- XMLschema : Les constructeurs de collections, héritage de types, réutilisation de définitions.
- Les espaces de noms xmlns : intérêt pour l'intégration de données XML.
- Les bonnes pratiques : règles d'écriture DTD ou schémas XML, la gestion de versions.
- Les principaux outils de développement de DTD et schémas XML.
4) Définition de données JSON
- Schéma JSON : concepts de base, mots-clés de validation, mots-clés hyper-médias.
- Les méta-schémas pour définir les schémas JSON et les formats Hyper-Schema.
- Les schémas standards : ex. coordonnées géographiques, card, calendrier, adresse...
- Bibliothèques de validation de schémas JSON.
5) Navigation dans les arbres XML avec Xpath
- L'adressage des nœuds dans un arbre XML : navigation et expressions de chemin.
- Terminologie Xpath : nœuds, syntaxe des expressions, axes de navigation.
- Expressions de chemin Xpath : parcours des nœuds, expressions régulières, prédicats de sélection,
fonctions.
6) Le langage de styles XSL
page 15
- Transformation de données avec XSLT: les règles de production, sélection des nœuds avec XPath,
production des résultats.
- Exemples de transformation XML-XML, XML-HTML.
- Les processeurs XSLT. Intégration dans l'architecture n-tiers.
- Formatage des documents avec XSL/FO : objets, masques, mises en page.
- Les processeurs XSL/FO. Intégration avec les processeurs XSLT.
7) Traitement de XML avec SAX et DOM
- Traitement événementiel avec l'API SAX, exemple d'utilisation avec des objets Java, les parseurs SAX.
- Traitement par programme via l'API DOM, utilisation du parseur SAX pour la traduction de XML en objet, les
parseurs DOM.
- Les outils de développement d'application XML. Conversion XML/JSON.
8) Bases de données XML et JSON
- Bases de données orientées-document : XML ou JSON comme modèle de données.
- Stockage et indexation des documents, stockage relationnel.
- Langages de requêtes pour XML : SQL/XML, XQuery, XUpdate.
- Langages de requêtes pour JSON : JSONiq, JsonPath, Json Query, Jaql.
- SGBD orienté-document (XML, NoSQL) versus SGBD relationnel avec support XML/JSON.
- Intégration de données : vues intégrées de données hétérogènes en XML, intégration de schémas,
traitement de requêtes.
- Les principaux outils d'intégration de données XML : EII (Enterprise Information Integrators).
9) Architecture SOA et Web Services
- Web Services : client, fournisseur, annuaire de services et intégration d'applications.
- Description des services avec WSDL. Référencement dans l'annuaire UDDI.
- Protocoles de communication XML : XML RPC et SOAP.
- Architectures légères avec ReST.
- Choisir la bonne architecture Web Services : ReST/JSON versus XML/SOAP.
- Qualité de services : WS-Transaction, WS-Coordination, WS-Security.
- Intégration dans les serveurs d'applications .NET et JEE.
- Relations entre SOA et Web Services.
- La composition de services : modélisation de processus métiers et workflows.
- XML et WSDL au coeur du BPM. Le standard BPEL.
- Evolutions des solutions EAI vers les ESB, XML au coeur du SOA ?
page 16
Séminaire de 2 jour(s)
Réf : WRS
Participants
Responsable de projets Web /
intranet, responsable RH,
responsable communication,
manager.
Pré-requis
Connaissances de base
sur l'usage des outils
collaboratifs (messagerie,
GED, intranet...).
Web 2.0 et réseaux sociaux en entreprise, synthèse
OBJECTIFS
Ce séminaire vous apportera les connaissances nécessaires à la compréhension du Web 2.0. Il détaille
les pratiques collaboratives véhiculées par ce concept afin d'en identifier le potentiel pour l'entreprise et
analysera les outils associés Wiki, RSS... avec un focus particulier sur les réseaux sociaux d'entreprise.
1) Définition du Web 2.0
2) Socle applicatif du Web 2.0
3) Applications Web 2.0, leur apport
Prix 2017 : 1950€ HT
1) Définition du Web 2.0
Dates des sessions
- Concepts novateurs par rapport au Web 1.0.
- Doit-on réellement parler de rupture technologique ?
Paris
15 déc. 2016, 6 avr. 2017
8 juin 2017
4) Impacts sur les projets Web
5) Réseaux sociaux en entreprise
2) Socle applicatif du Web 2.0
- Nouvelles interfaces utilisateur.
- Principaux apports : intégration d'applications sur le poste client.
- Alternatives : XHTML/Ajax, Flex, Silverlight, Widgets...
- Modèle d'architecture promu par le Web 2.0. Approche REST/SOA.
- Mise à disposition de services via les Open API (photos, géolocalisation...).
- Formats d'échanges : RSS, Atom, JSON...
- Modèle de sécurité. Services transversaux. Authentification unique : OpenID, Facebook Connect...
- Autres services : Open Social, Open Stack... Les micro-formats.
3) Applications Web 2.0, leur apport
- Environnement de productivité personnelle : utilisation des flux RSS.
- Outils de gestion des préférences. Blogs. Gestion de réputation numérique.
- Réseaux d'intérêt : le Bookmarking social.
- Mécanismes de tagage. Moteurs de recommandations. Le " Crowdsourcing ". Les Wiki.
- Disponibilité de plateformes applicatives.
- Solutions de collaboration Web. Mashups : l'alternative aux portails d'intégration.
4) Impacts sur les projets Web
- Contraintes d'accessibilité.
- Référencement.
- Choix technologiques.
- Risques liés au développement à base d'Ajax.
- Nouveautés en gestion de projet : SCRUM, planification poker...
5) Réseaux sociaux en entreprise
- Principe. Etat des lieux : utilisation par pays, par CSP, par fournisseurs.
- Se connecter à un réseau social. Principales plateformes. Positionnement des réseaux sociaux publics et
cibles.
- Succession des générations dans les entreprises : les baby-boomers, les générations X et Y.
- Motivations. Besoin d'innovation. Freins du management traditionnel. Modèles d'adaptabilité selon G.
Hamel.
- Typologie des réseaux sociaux : quatre types de réseaux sociaux reprenant les principes d'adaptabilité.
- Cas d'utilisation. Principales fonctionnalités d'un réseau social : fonctions membres, liens et groupes.
- Modèles de mise en oeuvre. Offres produits groupware : Microsoft, IBM, Google... Offres #" Pure Player "#.
- Offres plateforme d'intégration d'applications sociales. Etat de l'art des solutions disponibles : hébergées,
SaaS, etc.
page 17
Réf : NIW
Participants
Toute personne désirant
réaliser un site Web avec
les technologies actuelles
ou souhaitant disposer d'une
culture Web concrète.
Pré-requis
Avoir une bonne
connaissance de l'utilisation
de son ordinateur. Savoir
naviguer sur Internet et traiter
des e-mails.
Prix 2017 : 1510€ HT
Dates des sessions
Paris
14 nov. 2016, 30 jan. 2017
27 mar. 2017, 22 mai 2017
10 juil. 2017
Aix
5 déc. 2016, 20 fév. 2017
24 avr. 2017, 26 juin 2017
Bordeaux
12 déc. 2016, 20 fév. 2017
4 avr. 2017, 19 juin 2017
Bruxelles
12 déc. 2016, 13 fév. 2017
19 juin 2017
Geneve
12 déc. 2016, 13 fév. 2017
19 juin 2017
Grenoble
5 déc. 2016, 20 fév. 2017
4 avr. 2017, 19 juin 2017
Lille
Réaliser un site Web, pour non-informaticiens
Best
Les sites Web sont omniprésents, voire incontournables, dans le paysage informatique professionnel
et associatif. Ce stage vous montrera comment créer un site Web avec un outillage adapté à des noninformaticiens, l'installer et le mettre en ligne.
Comprendre les fondamentaux du Web
Maîtriser l'environnement technique d'un site web
Réaliser un site web ergonomique à l'aide d'un éditeur de code HTML
Manipuler les outils d'exploitation, de référencement et d'analyse d'un site web
1) Le panorama d'un site Web
2) Le dialogue entre le client et le serveur
3) L'hébergement et le nom de domaine
4) Le référencement naturel
5) Exploitation et statistiques
Travaux pratiques
Les exercices sont basés sur la construction d'un mini site Web. Les participants apprendront à concevoir,
réaliser et installer leur site sur un serveur réel.
1) Le panorama d'un site Web
- Qu'est-ce qu'un site Web ?
- Les différents types de site (forum, blog, achats en ligne, espace collaboratif).
- Le contenu d'un site Web (textes, formulaires, tableaux, menus, liens hypertextes...).
- Les contenus multimédias : images, vidéo, audio, animations Flash.
- Exemples de pages HTML basiques et de navigation.
- Les pages HTML statiques et les pages dynamiques.
- Le rôle du navigateur (Internet Explorer, Firefox).
- Quel est le rôle du serveur Web ?
Travaux pratiques
Repérer les différents navigateurs sur son PC, rechercher des adresses IP ou des noms de domaines.
5 déc. 2016, 20 fév. 2017
24 avr. 2017, 26 juin 2017
2) Le dialogue entre le client et le serveur
Luxembourg
- La notion de protocole.
- Déposer des fichiers sur un serveur distant avec FTP.
- Mettre à jour un fichier avec FTP.
12 déc. 2016, 13 fév. 2017
19 juin 2017
Lyon
6) La création du site
7) Les éditeurs de texte
8) Ecrire sa première page Web en HTML
9) Simplifier la création de site avec Blue Griffon
10) Intégrer des scripts JavaScript
5 déc. 2016, 20 fév. 2017
4 avr. 2017, 19 juin 2017
3) L'hébergement et le nom de domaine
Montpellier
- Hébergement mutualisé vs dédié.
- Choisir le nom de domaine.
- Comment louer le nom de domaine.
- L'hébergement DNS vs la redirection pour le nom de domaine.
- Développer chez soi, mettre en place chez les autres.
- Les différentes offres des hébergeurs (1and1, HostPapa, WebHostingPad, OVH...).
- La qualité de service proposée. Parallèle entre le prix de l'hébergement et les fonctionnalités proposées.
- La responsabilité du contenu diffusé. Le respect de la charte (nétiquette).
12 déc. 2016, 20 fév. 2017
24 avr. 2017, 26 juin 2017
Nantes
12 déc. 2016, 20 fév. 2017
24 avr. 2017, 26 juin 2017
Rennes
12 déc. 2016, 20 fév. 2017
24 avr. 2017, 26 juin 2017
Sophia-antipolis
5 déc. 2016, 20 fév. 2017
24 avr. 2017, 26 juin 2017
Strasbourg
5 déc. 2016, 20 fév. 2017
24 avr. 2017, 26 juin 2017
Toulouse
12 déc. 2016, 20 fév. 2017
4 avr. 2017, 19 juin 2017
Echanges
S'assurer de la bonne compréhension de l'installation technique d'un site Web. Les éléments clés à prendre
en compte lors du choix d'un hébergeur (tarifs, offres, fonctionnalités).
4) Le référencement naturel
- Qu'est-ce que le référencement et le positionnement ?
- L'utilisation des mots-clés.
- Les moteurs de recherche et les annuaires.
- Bien déclarer son site Web sur les moteurs.
Travaux pratiques
Rechercher des mots-clés pertinents. Utilisation de Google Keyword Tool (AddWords). Vérifier le bon
référencement de son site avec l'outil Google Webmaster ou un outil équivalent.
page 18
5) Exploitation et statistiques
- Outils de statistiques, services offerts par son hébergeur, autres solutions (Google Analytics, Alexa,
WebRankInfo...).
- Connaître le trafic, les visiteurs, les navigateurs utilisés...
- Identifier les contenus pertinents.
- Outils d'administration de l'hébergement : CPanel ou autres outils propriétaires (OVH...).
- Créer une sauvegarde de son site Web.
- Comment effectuer la restauration.
- La mise à jour d'un site (FileZilla, Net2Ftp ...).
Travaux pratiques
Mettre en place des outils d'analyse. Découverte de l'outil CPanel. Créer une archive d'un site, supprimer
puis restaurer ce site sur le serveur FTP.
6) La création du site
- La conception et l'ergonomie.
- Notions d'ergonomie. Rédiger pour le Web. Notion d'accessibilité.
- Exemples de sites mal conçus.
- Concevoir l'arborescence du site.
- Création de la maquette, de la charte graphique et des images du site. Optimisation.
- Les standards en vigueur (W3C).
- Les vidéos (récupération, coupe, ajout de son).
Travaux pratiques
Concevoir l'organisation d'un site Web.
7) Les éditeurs de texte
- Qu'est-ce qu'un éditeur de texte ?
- Les applications qui éditent directement en langage HTML/XHTML.
- Les compétences requises pour les utiliser.
- Les plus connus (Notepad++, UltraEdit, etc.).
- Les éditeurs Wysiwyg.
- Editer une page Web telle qu'elle apparaît dans les navigateurs courants.
- Les plus utilisés (Adobe Dreamweaver, Blue Griffon...).
- Présentation de Blue Griffon.
8) Ecrire sa première page Web en HTML
- Présentation de l'HTML.
- Le principe des balises et attributs HTML.
- Mise en forme du texte et des paragraphes.
- Les feuilles de style CSS. Trouver des éléments CSS sur Internet.
- CSS3 / HTML5.
Travaux pratiques
Se familiariser avec le HTML. Ecrire une page avec insertion d'images.
9) Simplifier la création de site avec Blue Griffon
- Installation et configuration de Blue Griffon.
- Présentation de l'interface graphique de Blue Griffon.
- Création et édition d'une page.
- Manipuler du texte, des listes, des images, des tableaux, des liens hypertextes.
- Mettre en place des formulaires.
- Les feuilles de style.
- Les modèles de pages Web.
- La gestion de plusieurs sites.
Travaux pratiques
Création d'un formulaire à l'aide de Blue Griffon.
10) Intégrer des scripts JavaScript
- Qu'est-ce que le Javascript ?
- Etendre les possibilités du HTML grâce à Javascript.
- Comment intégrer du Javascript dans une page Web ?
- La gestion des événements et le DOM.
- Le déclenchement automatique des événements.
- Comment trouver les scripts qui conviennent ?
Travaux pratiques
Intégration de scripts dans une page.
page 19
Réf : DSW
Participants
Développeurs et chefs de
projets Web.
Pré-requis
architectures techniques.
Prix 2017 : 2440€ HT
Dates des sessions
Paris
15 nov. 2016, 12 déc. 2016
10 jan. 2017, 21 fév. 2017
14 mar. 2017, 18 avr. 2017
16 mai 2017, 13 juin 2017
18 juil. 2017, 29 aoû. 2017
Aix
13 déc. 2016, 14 fév. 2017
16 mai 2017
Best
Ce cours, très pratique, vous présentera l'ensemble des technologies Internet. Il vous expliquera le
fonctionnement des services Web et des différents langages associés (HTML, CSS, JavaScript...) ainsi
que les techniques graphiques, l'interrogation des bases de données et l'administration. Les exercices vous
permettront d'appréhender d'une manière très concrète toutes les phases de la réalisation d'un site Web.
Réaliser un site web ergonomique, accessible et bien référencé
Administrer un site Web
1) Les technologies du site Web
2) Administration d'un site Web
3) Création de pages Web : HTML, XML, XHTML
4) Les formulaires
5) Conception graphique et multimédia
6) Ergonomie et accessibilité d'une application
Web
7) Pages dynamiques
8) Les technologies côté client
9) Initiation au langage JavaScript et au DHTML
Bordeaux
13 déc. 2016, 28 fév. 2017
6 juin 2017
Bruxelles
Geneve
- Les serveurs Web (Apache, IIS). Wampserver.
- Comprendre le fonctionnement de base des protocoles TCP/IP, HTTP, FTP. Les URL. Les services réseaux
complémentaires (DNS, DHCP, ...).
- Achat et gestion du nom de domaine. Choisir un hébergeur. Architecture technique. Organisation.
15 nov. 2016, 21 mar. 2017
27 juin 2017
15 nov. 2016, 21 mar. 2017
27 juin 2017
Grenoble
13 déc. 2016, 28 fév. 2017
6 juin 2017
Lille
13 déc. 2016, 14 fév. 2017
16 mai 2017
Luxembourg
15 nov. 2016, 21 mar. 2017
27 juin 2017
Lyon
13 déc. 2016, 28 fév. 2017
6 juin 2017
Montpellier
13 déc. 2016, 14 fév. 2017
16 mai 2017
Nantes
13 déc. 2016, 14 fév. 2017
16 mai 2017
Rennes
13 déc. 2016, 14 fév. 2017
16 mai 2017
Sophia-antipolis
13 déc. 2016, 14 fév. 2017
16 mai 2017
Strasbourg
13 déc. 2016, 14 fév. 2017
16 mai 2017
Toulouse
13 déc. 2016, 28 fév. 2017
6 juin 2017
- Mise en oeuvre de l'ensemble des opérations d'administration effectuées par le webmaster.
- Gestion des noms de domaine, transfert ftp.
- Création de messages d'erreur personnalisés, gestion des fichiers journaux.
- Suivi et analyse des statistiques.
- Présentation des langages HTML, XHTML, HTML5. Différences entre les navigateurs.
- Structure, liens, hypertexte.
- Les images, les cadres. Les formats vectoriels.
- La mise en page. Les feuilles de styles. Le langage CSS.
- Tableaux et calques.
- Techniques pour réussir son référencement sur les moteurs de recherche. Les méta-tags.
- Définition et intégration de composants Plug-ins. Flash, Silverlight, Java, ActiveX.
Travaux pratiques
Réalisation de pages complexes HTML avec Dreamweaver. Création de feuilles de style, préparation de la
page au référencement.
4) Les formulaires
- Contraintes et avantages. Syntaxe, structure, champs de saisie, boutons, cases à cocher, listes, zones de
texte, sélections de fichier.
Travaux pratiques
Réalisation d'un formulaire avec envoi des données vers la messagerie et une base de données.
- Créer une charte graphique. Intégrer une charte graphique.
- Mise en oeuvre d'outils graphiques pour concevoir une interface évoluée.
- Développement d'animations avec Flash.
- Les ressources graphiques GIF, JPEG, PNG. Utiliser Photoshop ou Gimp.
Travaux pratiques
Conception d'un modèle de page HTML avec Fireworks, composant Flash. Intégration de plug-ins
multimédias pour visualiser des composants Flash, Shockwave.
6) Ergonomie et accessibilité d'une application Web
- Charte graphique. Règles d'usability. Ecueils graphiques à éviter pour faire un site efficace (navigation, mise
en page, contraintes techniques). Modèles de pages.
page 20
- Accessibilité. Norme. Impact sur le développement. Mettre en conformité un site Web. Outils de test et de
validation en ligne.
Travaux pratiques
Définir le cahier des charges de la charte graphique. Mise en oeuvre d'outils de test et audit pour
l'accessibilité.
7) Pages dynamiques
- Différence entre serveur web et serveur d'application.
- Mode de fonctionnement, sécurité. Les méthodes GET et POST. Les variables serveur.
- Les serveurs web du marché.
- Les langages de scripts serveur et leurs plateformes de développement : ASP, ASPX, JSP, PHP.
- Appel de services Web.
- Intégration de requêtes SQL dans la page pour insérer, supprimer, modifier des données de la base.
Travaux pratiques
Développer des pages dynamiques, interrogation d'une base de données, de services web.
- Les technologies d'interfaces graphiques : HTML5, XAML, Flex.
- Présentation et mise en oeuvre de solutions Rich internet Application (RIA) et Rich Desktop Application
(RDA).
- Présentation des solutions Adobe AIR, Microsoft SilverLight, Framework Google.
Travaux pratiques
Démonstration et mise en oeuvre de ces multiples technologies.
- Syntaxe du langage. Contrôles de saisie d'un formulaire.
- DOM et Ajax.
- Présentation Ecmascript et émergence du langage Actionscript.
- Présentation des offres du marché à base de Javascript (Google API, Widgets...).
- Récupérer, savoir débuguer vos programmes.
Travaux pratiques
Utilisation du JavaScript pour ajouter des effets DHTML et des contrôles sur formulaire, gestion
d'événements en JavaScript Intégration de scripts existants.
page 21
Réf : TML
Participants
Toutes les personnes désirant
s'initier aux fondamentaux de
la création de pages Web.
Pré-requis
Pratique courante d'Internet.
Prix 2017 : 880€ HT
Ce cours fait l'objet d'un
accompagnement vidéo
HTML, initiation pratique
acquérir les bases de la création d'une page Web
Ce stage vous permettra d'acquérir les notions essentielles du langage HTML et de ses différentes versions :
HTML, XHTML, HTML5. Vous apprendrez à structurer des documents au moyen des principales balises, à
les valider et à les rendre accessibles.
Construire une structure de document HTML accessible et valide
Maîtriser les balises sémantiques
Créer un tableau
Créer la structure d'un formulaire simple
Comprendre l'importance de l'accessibilité au travers des référentiels AccessiWeb et WCAG
Dates des sessions
Paris
25 nov. 2016, 24 mar. 2017
23 juin 2017
1) Présentation du langage HTML
2) La structure d'un document HTML
3) Le <head>, l'en-tête d'un document HTML
4) Le <body>, le corps d'un document HTML
5) L'affichage de données tabulaires
6) Les principales balises de formulaires
7) L'accessibilité numérique
Pratique du langage HTML dans un éditeur en mode texte (notepad++), audit de codes en ligne et
découverte d'outils et de référentiels.
Exercice
Mise en oeuvre du langage HTML.
1) Présentation du langage HTML
- Histoire de l'HTML.
- Le XHTML et le HTML5.
- Les trois types de balises : balises block, inline et métadonnées.
- Le Doctype. Le mode quirks. La DTD.
Démonstration
Affichage du code source de pages HTML, XHTML, HTML5. Présentation du validateur WC3.
2) La structure d'un document HTML
- Le <head>. Le <body>.
- Les balises sémantiques et génériques.
- Les attributs.
Exercice
Découverte de la structure type d'un document HTML et des balises qui le constituent. Construction de la
structure de base d'un document.
3) Le <head>, l'en-tête d'un document HTML
- La balise <title>.
- Les <meta> " description " et " http-equiv ".
- Les balises <link>, <script> et <style>.
- L'encodage. Le type mime.
Exercice
Construction du <head> du document. Aperçu du <title> et du <méta> ", description d'une page HTML dans
une page de résultat d'un moteur de recherche (Google).
4) Le <body>, le corps d'un document HTML
- Les balises block : <h>, <p>, <ul>, <li>, <div>, ...
- Les balises inline : <a>, <img>, <span>, ...
- Le lien, l'attribut " alt ".
- Autres balises sémantiques : <blockquote>, <cite>, ...
- Le commentaire HTML.
Exercice
Construction du corps du document avec plusieurs paragraphes, images, titres et une liste. Visualisation
d'une page Web dans le cache d'un moteur de recherche (Google).
5) L'affichage de données tabulaires
page 22
- La balise <table>.
- Les attributs " height ", " width " et " border ".
- Les balises <tr>, <td>, <th>, <tbody>, <thead>, <tfoot>.
- Les attributs " colspan " et " rowspan ".
- Les attributs " scope " et " summary ".
Exercice
Réalisation d'une page avec un tableau simple à partir du modèle de page déjà constitué.
6) Les principales balises de formulaires
- La balise <form>.
- Les attributs " method " et " action ".
- Les balises <label> et <input>.
- Les attributs " name " et " id ".
- Les attributs " accesskey " et " tabindex ".
Exercice
Réalisation d'un formulaire simple à partir du modèle de page déjà constitué.
7) L'accessibilité numérique
- Définition de l'accessibilité.
- Le cadre légal. Le référentiel AccessiWeb.
- Les WCAG. Les outils d'audit.
Exercice
Audit d'une page Web à l'aide du service en ligne Wave et de l'extension Opquast.
page 23
Réf : CSS
Participants
Ce stage s'adresse à tous les
concepteurs de sites Web,
webmasters et graphistes
désirant acquérir de bonnes
connaissances en mise en
forme Web.
Pré-requis
HTML.
Prix 2017 : 1440€ HT
CSS, donner du style à vos pages Web
OBJECTIFS
Le langage CSS est devenu le langage de référence pour la mise en page des sites Web. Durant ce
cours, vous apprendrez à élaborer des feuilles de style permettant de gérer l'apparence et la disposition
des éléments de vos pages web. Vous découvrirez également comment utiliser CSS conjointement avec
Javascript.
1) Rappels
2) La base des CSS
3) Les boîtes et blocs
4) Les styles textuels
5) Les images
6) Les formulaires
7) Modifications des CSS en JavaScript
1) Rappels
Dates des sessions
Paris
- L'architecture client/serveur. Les navigateurs.
- Les langages côté client XML, (X)HTML, CSS, JavaScript.
- Le web sémantique. L'accessibilité. L'encoding.
17 nov. 2016, 16 fév. 2017
23 mai 2017
2) La base des CSS
Aix
- Les avantages des feuilles de style.
- Les différentes versions de CSS (CSS1, CSS2, CSS3).
- La cascade CSS. Le stockage des feuilles CSS.
- Le support par les navigateurs.
- Les types de sélecteurs (id, class et balises).
- L'ordre de priorité. Les propriétés.
- Les unités de mesure (em, px, pt...).
- Les couleurs (RVB vs de base).
7 nov. 2016
Bordeaux
15 déc. 2016
Grenoble
7 nov. 2016
Lille
7 nov. 2016
Lyon
7 nov. 2016
Montpellier
15 déc. 2016
Nantes
15 déc. 2016
Rennes
15 déc. 2016
Sophia-antipolis
7 nov. 2016
Strasbourg
7 nov. 2016
Toulouse
15 déc. 2016
Travaux pratiques
Création et gestion de styles. Gestion des unités relatives. Adaptation aux types de médias.
3) Les boîtes et blocs
- Les balises de bloc vs en ligne.
- Le flux CSS. Les marges (margin, padding).
- Positionnement dans le flux (relatif, flottant), positionnement hors flux (absolu, fixe).
- Le z-index (altitude). La propriété box-sizing. Les contextes de formatage.
- Fonds et bordures (couleurs, transparence, coins arrondis, ombres portées).
- Le contenu (déroulement/scrolling).
- Cas particulier des tableaux.
Travaux pratiques
Création d'un squelette de page (positionnement par div).
4) Les styles textuels
- Modification des fontes (tailles, polices, couleurs...).
- Alignement du texte.
- Les pseudo-classes.
- Les effets visuels (clignotement...).
- Listes et menus horizontaux et verticaux.
Travaux pratiques
Formatage des menus horizontaux/verticaux. Effets visuels : transparence, ombres portées...
5) Les images
- De contenu (img) vs d'apparence (background).
- Redimensionnement. Rollover.
- Liens et images.
Travaux pratiques
Intégration d'images.
6) Les formulaires
- Design de champs de saisie, liste de sélection, zone de texte, case à cocher...
- Mise en forme des étiquettes (labels), des légendes, groupes de champs (fieldset)...
Travaux pratiques
Réalisation de formulaires.
page 24
7) Modifications des CSS en JavaScript
- Modification des styles en JavaScript (les interfaces style et className).
- Effets : apparition, cliqué-glissé, menu déroulant...
Travaux pratiques
Utilisation conjointe de CSS et de JavaScript (menu glissant, effets dans le formulaire...).
page 25
Réf : EAM
Participants
Ce stage s'adresse à tous les
internautes et Webmasters
désirant acquérir de bonnes
pratiques de création de site.
Pré-requis
Aucune connaissance
particulière.
Dreamweaver CS6, prise en main
OBJECTIFS
Vous apprendrez à utiliser l’atelier Dreamweaver CC, notamment pour préparer des pages HTML, XHTML
et HTML5 simples, et améliorer leur aspect graphique avec des feuilles de style CSS. A l’issue de ce cours,
vous serez en mesure de créer, maintenir et promouvoir des sites Web de qualité.
1) Rappels du Web
2) Dreamweaver
3) Création de pages simples
4) Accessibilité et Web usability
5) Mise en forme avancée avec CSS
6) Introduction au DHTML
Prix 2017 : 1440€ HT
Dates des sessions
Paris
17 nov. 2016, 9 fév. 2017
23 mai 2017, 27 juil. 2017
31 aoû. 2017
1) Rappels du Web
- Principaux protocoles d'un site Web (HTTP, FTP, SMTP, POP3, IMAP). Principes : client-serveur et site
Web.
- Navigateurs Web (IE, Firefox, Chrome).
- Principaux serveurs HTTP (Apache, IIS).
- Les URL (structure, méthode GET, accès localhost).
- Le langage HTML.
Travaux pratiques
Exploration de sites à partir de deux navigateurs. Démonstration de WAMP. Paramétrage d'un site local.
Modification manuelle des paramètres d'une URL en GET.
2) Dreamweaver
- Présentation de la gamme Adobe.
- Prise en main de Dreamweaver CC (démarrage, espace de travail, paramétrage...).
Travaux pratiques
Préparation de l'environnement de travail (espace, dossiers). Création d'une première page. Publication
distante en FTP.
3) Création de pages simples
- Les textes (principales balises, strong, em...). Les images (GIF, JPG, PNG...).
- Les hyperliens (URL, cibles, ancres...).
- Propriétés de la page (fonds, fonts, liens...).
- Mise en forme à l'aide de tableaux.
Travaux pratiques
Création d'une page comportant des textes, liens et images.
4) Accessibilité et Web usability
- Qu'est-ce que l'accessibilité (technique et handicap, lois, initiatives publiques, privées...) ?
- Importance du (X)HTML. Séparation sémantique (contenu, forme, interactivité).
- Qu'est-ce que la web usability (ergonomie globale) ?
- Importance de l'apparence (charte, best practices...).
- Importance du contenu et référencement (métatags).
- Les outils d'évaluation de l'ergonomie.
Travaux pratiques
Tests et rapports d'accessibilité avec Dreamweaver. Définition d'une charte graphique. Visite de quelques
sites de référencement.
5) Mise en forme avancée avec CSS
- Qu'est-ce qu'un CSS (définition, fichier...) ?
- Création, utilisation, liaison, import.
- Mise en page à l'aide de divisions logiques (positionnement dans le flux, la propriété float).
- Découverte de propriétés CSS3 (transition).
- Maintenance et nettoyage du code.
Travaux pratiques
Création de trois pages liées entre elles par une page sommaire, avec barre de navigation...
6) Introduction au DHTML
- Qu'est-ce que JavaScript ?
- Syntaxe JavaScript.
- Evénements et création dynamique de code.
- Introduction à Spry.
page 26
Travaux pratiques
Test simple de déclenchement JavaScript. Mise en œuvre d'effets Spry sur les pages créées.
page 27
Réf : HTX
Participants
Ce stage pratique s'adresse
à tous les informaticiens
développer un site Web et de
construire une interface Web
interactive et dynamique.
Pré-requis
des composants d'une
architecture Web.
OBJECTIFS
Dreamweaver est l'atelier de conception de pages Web le plus répandu sur le marché. En découvrant ses
fonctionnalités, vous apprendrez à maîtriser l'éditeur de pages XHTML/HTML, la mise en forme graphique au
moyen des feuilles de style CSS, tout en prenant en compte l'accessibilité des sites Web.
1) Rappels Web
2) L'interface Dreamweaver
3) Composition de pages complexes
4) Design et accessibilité
5) Intégration de composants multimédias
6) JavaScript
7) Accès aux bases de données
Prix 2017 : 2440€ HT
1) Rappels Web
- Les protocoles d'un site web : HTTP, FTP, SMTP, POP3.
- Fonctionnement d'un site Web. HTML, URL.
Dates des sessions
Travaux pratiques
Paramétrage du navigateur, du serveur Web, création d'un environnement de développement.
Paris
15 nov. 2016, 14 mar. 2017
27 juin 2017
- Présentation de la suite Adobe CS6.
- Prise en main de Dreamweaver. L'interface.
- Les différents types d'affichage.
- Conception graphique HTML.
- Interface de gestion de projets (PhoneGap, jQuery Mobile, transfert FTP).
Travaux pratiques
Découverte de l'éditeur, construction de pages. Développement de pages XHTML.
- Les feuilles de style CSS. L'assistant de codage CSS.
- Création de formulaires. Contrôles de saisie.
- Définition de zones de contenus à l'aide des boîtes.
- Découverte des templates mobiles, Grid System.
- Découverte du Responsive Web Design avec l'assistant Dreamweaver CS6 (mise en forme de grilles
fluides) .
Exercice
Création de CSS, de tableaux. Import de pages. Création d'un formulaire et appel de serveur.
- Construction de la charte graphique.
- Création d'un modèle de page avec Fireworks ou Photoshop.
- Accessibilité, la priorité 2 du WAC/W3C.
Exercice
Test de compatibilité XHTML et d'accessibilité. Mettre en oeuvre une charte graphique.
- Intégration de composants graphiques. Le Rollover.
- Utilisation de l'inspecteur de tags.
- Les propriétés CSS3 et l'assistance Dreamweaver CS6.
Exercice
Création de contrôles en JavaScript, intégration de multiples composants multimédias.
6) JavaScript
- Syntaxe JavaScript. Les objets Script.
- Création dynamique de code JavaScript et association aux événements. Débogage de code.
Travaux pratiques
Contrôles sur les formulaires, ouverture de pop-up, traitement sur les div.
- Paramétrage de la connexion ODBC.
- Gestion dynamique des bases de données.
- Interrogation SQL sur une table.
page 28
- Génération des tableaux dynamiques de résultats. Utilisation des tables pour générer des formulaires.
- Définir un site administré par CMS dans Dreamweaver.
- Création graphique d'un appel Ajax avec SPRY Dataset.
- Gestion des formulaires de login.
Travaux pratiques
Connexion à une base. Création d'une table d'utilisateurs, génération de pages de login.
page 29
Réf : JSC
Participants
Développeurs Web.
Pré-requis
Connaissances de base de
JavaScript, HTML et CSS.
Prix 2017 : 2770€ HT
Dates des sessions
Paris
19 déc. 2016, 20 fév. 2017
24 avr. 2017, 19 juin 2017
Programmation en HTML5 avec JavaScript et CSS3
(70-480)
préparation à l'examen
New
Ce cours vous apprendra à développer des applications Web via la programmation JavaScript, le HTML5
et le CSS3. Vous verrez comment rendre vos sites plus dynamiques et les enrichirez à l'aide de contenus
multimédias grâce à l'HTML5. Ce stage couvre tous les sujets nécessaires pour préparer l'examen Microsoft
70-480.
Apprendre à développer des sites et des applications Web avec HTML5 et CSS3
Rendre les sites Web plus dynamiques et plus interactifs
Savoir insérer du contenu multimédia grâce à l'HTML5
1) La structure du langage
2) Les formulaires avec le HTML5
3) Le style HTML5 avec CSS3
4) Le langage JavaScript
5) Les API HTML5
6) Interface utilisateur adaptative
7) Transmission de données et communication
en temps réel
Certification
Cette formation comprend le voucher nécessaire à l'inscription et au passage de l'examen auprès du
partenaire de Microsoft, Pearson Vue. Un quiz avec des questions proches de celles de l'examen sera
réalisé.
1) La structure du langage
- Le langage HTML et le CSS.
- Le langage JavaScript.
- Le concept des balises.
- Les objets d'un document.
- Les titres et les paragraphes de texte.
- La taille, la couleur et la police.
- Introduction à JavaScript.
- Insérer un script dans un document HTML/XHTML.
Travaux pratiques
Créer des pages en HTML5.
2) Les formulaires avec le HTML5
- La déclaration de formulaire.
- Zone de texte à une et à plusieurs lignes.
- Le menu déroulant. Les différents boutons.
- Organiser les éléments d'un formulaire.
- Les formulaires à l'environnement mobile (téléphone, tablette).
- La validation avec JavaScript.
Travaux pratiques
Créer un formulaire avec la validation des entrées d'utilisateur avec HTML5.
3) Le style HTML5 avec CSS3
- Comment utiliser le CSS3.
- La mise en page et le positionnement.
- Le niveau de présentation.
- Le positionnement par grille.
Travaux pratiques
Appliquer des styles avec CSS3.
- Les éléments de base (syntaxe, variables...).
- Les fonctions. Les objets personnalisés.
- Les objets globaux (Array, Date...).
- Les tableaux.
Travaux pratiques
Exemple d'utilisation du JavaScript.
page 30
5) Les API HTML5
- Utiliser les API pour avoir des fonctions interactives.
- Le Drag et Drop. Le multimédia.
- Le mode hors connexion pour une application Web.
Travaux pratiques
Insérer de la vidéo.
6) Interface utilisateur adaptative
- Créer des pages auto-adaptables aux périphériques.
- Dessiner en HTML. Le SVG.
- Les graphiques interactifs à l'aide de graphiques vectoriels évolutifs.
- Ajouter des animations. Les transitions CSS.
Travaux pratiques
Comment utiliser le SVG dans une page ? Utiliser les transitions CSS.
7) Transmission de données et communication en temps réel
- Communiquer avec une source de données distante.
- Transmission des données.
- Sérialisation. XMLHTTPRequest.
- WebSocket. Echanges entre client et serveur.
- L'API Socket Web et JavaScript.
Travaux pratiques
Exemple de transmission de données.
page 31
Réf : HCS
Participants
projets Web.
Pré-requis
HTML et CSS.
HTML5, CSS3, orienter votre conception vers des sites
Web modernes et dynamiques
Best
Cette formation vous apprendra à créer des pages et des applications Web en utilisant HTML5 et CSS3.
Vous découvrirez les avancées proposées par le HTML5 notamment en termes d'interfaces Web riches/RIA,
de multimédia et de moyens de communication permettant la mise en œuvre d'applications client/serveur
attractives.
Prix 2017 : 1440€ HT
Dates des sessions
Concevoir et développer des applications Web en HTML 5 et CSS 3
Mettre en place et valider la structure HTML 5 des pages Web
Habiller des pages Web en CSS 3 afin de les rendre plus attractives
Rendre responsive design les pages Web d'un site
Intégrer des animations et du contenu multimédia
Paris
6 oct. 2016, 3 nov. 2016
1 déc. 2016, 12 jan. 2017
9 fév. 2017, 2 mar. 2017
6 avr. 2017, 2 mai 2017
1 juin 2017, 6 juil. 2017
31 aoû. 2017
Aix
8 déc. 2016, 23 fév. 2017
23 mai 2017
1) Rappels
2) Introduction au HTML 5
3) Nouvelle structuration
4) Les nouvelles balises HTML
6) Les couleurs et la mise en forme du texte
7) La mise en forme des boîtes et des fonds
8) Les transformations
Bordeaux
15 déc. 2016, 2 fév. 2017
4 mai 2017
1) Rappels
Bruxelles
- Rappels sur les versions HTML (HTML 4, XHTML 1.x, XHTML 2).
- Les DTD : strict, transitional, frameset.
- Les différents composants d'un document HTML : titres, paragraphes, liens, tableaux, formulaires...
- Les commentaires.
- La structure composite d'un document HTML : images, feuilles de style CSS, JavaScript, Flash...
- Position des navigateurs face aux technologies HTML.
15 déc. 2016, 16 fév. 2017
23 mai 2017
Geneve
15 déc. 2016, 16 fév. 2017
23 mai 2017
Grenoble
8 déc. 2016, 2 fév. 2017
4 mai 2017
Lille
8 déc. 2016, 23 fév. 2017
23 mai 2017
Luxembourg
- Les objectifs de HTML 5.
- Le WhatWG versus W3C.
- Les principaux concepts et apports.
- Les différents composants : balises, formulaires, audio, vidéo, API, etc.
- Outils de développement HTML 5.
- Test de compatibilité, méthode de détection HTML 5.
13 oct. 2016, 15 déc. 2016
16 fév. 2017, 23 mai 2017
Lyon
6 oct. 2016, 8 déc. 2016
2 fév. 2017, 4 mai 2017
Montpellier
15 déc. 2016, 23 fév. 2017
23 mai 2017
Nantes
15 déc. 2016, 23 fév. 2017
23 mai 2017
Rennes
15 déc. 2016, 23 fév. 2017
23 mai 2017
Sophia-antipolis
8 déc. 2016, 23 fév. 2017
23 mai 2017
Strasbourg
8 déc. 2016, 23 fév. 2017
23 mai 2017
Toulouse
15 déc. 2016, 2 fév. 2017
4 mai 2017
Travaux pratiques
Démonstrations. Découvertes des possibilités et du champ d'action.
- Les éléments traditionnels structurant un document HTML 5 (doctype, html, head, body, meta ...).
- L'élément <nav> et la mise en place d'informations de navigation internes au site.
- L'élément <section> et la mise en place de blocs de contenus.
- L'élément <article> et la mise en place de contenus indépendants du document.
- L'élément <aside> et la mise en place de blocs d'informations complétant un contenu principal.
- Les éléments <header> et <footer> et la mise en place de sections d'introduction et de conclusion d'un bloc.
- Les autres balises de structure.
- Les nouvelles catégories de contenus : Metadata content, Flow content, Sectioning content, Heading
content.
- Les nouvelles catégories de contenus : Phrasing content, Embedded content, Interactive content.
- La validation des pages avec le valideur officiel du W3C.
- Intérêt de ses nouvelles balises de structure.
- Imbrication et type de contenu.
Travaux pratiques
Mise en place et validation de la structure d'un document HTML 5.
- Les balises et attributs obsolètes.
page 32
- Différence Canvas vs SVG.
- Les nouvelles balises : <mark>, <meter>, <time>, <figure>, <picture>...
- Les extensions de balises HTML existantes.
- Les nouveaux attributs : a, fieldset, iframe, area, button...
- Les microformats. Présentation et avantages sur le référencement. Attributs itemprop='nationality'...
- Les formulaires. Les nouveaux types de la balise <input> (email, date, week...).
- Les nouveaux champs de formulaires : range, autofocus, placeholder, menu...
- Le contrôle et la validation de formulaires.
- Les formats multimédias. Codecs et API Multimédia.
- Gestion vidéo et audio avec les nouvelles balises <audio> et <video> HTML 5.
Travaux pratiques
Création de templates HTML 5. Positionnement d'éléments en absolu. Nombreux TP sur la mise en œuvre
des balises HTML 5 (formulaires, conception...). Réalisation d'un lecteur multimédia.
- Sélecteurs de répétition nth-child(even).
- Sélecteurs de cible target.
- Sélecteurs frère antérieur ~.
- Sélecteurs d'enfant unique only-child.
- Création de layout avec flexbox (organisation des éléments en fonction d'une grille).
Travaux pratiques
Intégration de CSS 3 aux applications Web. Sélection d'éléments d'une page HTML 5.
- Rappel sur les déclarations rgb et rgba.
- Les modèles hsl et hsla.
- La propriété opacity.
- Support des polices distantes @font-face.
- Mise en forme du texte.
- Gestion des débordements par text-overflow.
- Gestion des enchaînements par wrap-option, white-space-treatment...
- Effets de couleur et d'ombre sur texte text-fill-color, text-shadow...
Travaux pratiques
Application de couleurs. Mise en forme de textes. Gestion multicolonne.
- Les ombres avec box-shadow.
- Les coins arrondis avec border-radius...
- Les fonds multiples.
- Les gradients de fond (-webkit-gradient).
- Les fonds ajustés aux conteneurs.
Travaux pratiques
Appliquer des ombres et des arrondis.
- Les transformations : translations, rotations, homothéties (-webkit-transform).
- Les animations : les animations, les transitions (#webkit-transition).
Travaux pratiques
Animations et effets de transition.
page 33
Réf : EDG
Participants
Edge Animate, créer des animations interactives pour le
Web
Webmasters, graphistes,
maquettistes ou toute
personne en charge de la
communication de sites
Internet.
Ce cours vous permettra de concevoir des contenus interactifs pour tous types de terminaux mobiles
compatibles avec les systèmes iOS et Android, ainsi que pour tous navigateurs d'ordinateurs modernes.
Vous mettrez en œuvre des fonctionnalités HTML5, JavaScript et CSS3 sans avoir à manipuler de code.
Pré-requis
Une pratique courante d'un
logiciel de dessin vectoriel ou
bitmap (InDesign, Photoshop,
Illustrator) est un plus pour
suivre cette formation.
Personnaliser et enregistrer son espace de travail
Ajouter des animations à une page HTML existante
Créer une mise en page adaptative
Utiliser la timeline pour créer des animations
Gérer la typographie au sein des animations
Prix 2017 : 1960€ HT
Dates des sessions
Paris
1) Présentation de l'interface
2) Créer et sauvegarder un document Edge
3) Modifier, enrichir et réutiliser
4) Typographie et mise en page proportionnelle
5) Animer
6) Interactivité
7) Exporter / diffuser
5 déc. 2016, 6 fév. 2017
10 avr. 2017, 12 juin 2017
1) Présentation de l'interface
- Installation et démarrage du logiciel.
- Créer un espace de travail.
- La barre d'outils, le panneau Éléments et la scène.
- Le panneau Propriétés. Les panneaux Bibliothèque, Actifs, Symboles et Polices.
- Les panneaux Scénario et Code. La timeline : aperçu général.
Etude de cas
Personnaliser et enregistrer son espace de travail.
2) Créer et sauvegarder un document Edge
- Les outils Rectangle, Rectangle Arrondi et Ellipse.
- L'outil Texte. Placer une image.
- Créer du contenu pour Edge Animate avec Photoshop, Illustrator et FW.
- Formats et poids d'image pour Internet. Prévisualiser un document.
Travaux pratiques
Créer trois versions de sites, petit, moyen et grand.
3) Modifier, enrichir et réutiliser
- Manipuler des objets sur la scène. Réorganisation, alignement et distribution.
- Fonction de hiérarchisation, de groupes d'objets et de débordement.
- Modifier l'opacité et les couleurs d'un objet.
- Exporter/Importer des symboles .ansym.
Travaux pratiques
Ajouter une animation à un HTML existant.
4) Typographie et mise en page proportionnelle
- Ajouter des Webfonts à une composition animée.
- Polices en ligne libres d'accès. Polices téléchargeables, locales et CSS. Polices par abonnement.
- Options de redimensionnement.
- Guides en pourcentages et en pixels.
- Mise à l'échelle des symboles.
Travaux pratiques
Créer une mise en page adaptative.
5) Animer
- Utiliser la timeline (règles de base, player).
- Créer une animation (déplacement, apparence, rythme, accélération).
- Transitions et clés d'animation. Copier/coller des transitions.
- Marque de verrouillage et pop.
- Utiliser la fonction de rotation ou d'inclinaison d'un objet.
- Affichage de symboles, d'étiquettes, et insertion du texte en mouvement.
Travaux pratiques
Réaliser une animation.
page 34
6) Interactivité
- Ajouter de l'interactivité.
- Code sur la timeline.
- Actions sur les objets.
- Propriété Curseur.
Exercice
Exercice sur l'interactivité.
7) Exporter / diffuser
- Présentation de l'anatomie d'un projet Edge Animate. Exporter une animation.
- Scène de niveau inférieur (IE 6, 7 et 8). PreLoader, Affiche.
- Publier sur le web.
- Publier vers InDesign et Digital Publishing Suite ou iBooks Author.
Travaux pratiques
Exporter son projet.
page 35
Réf : GOD
Participants
Webmasters, graphistes ou
toute personne en charge de
la communication publicitaire
de sites Internet.
Pré-requis
HTML et CSS
Google Web Designer, créer des contenus riches pour le
Web
Vous découvrirez dans cette formation les fonctions de création graphique de l'application Google Web
Designer. Vous apprendrez à créer des contenus Web adaptés à vos écrans et à les animer. Vous concevrez
des annonces pour différents réseaux publicitaires et apprendrez à retoucher le code autogénéré de vos
contenus.
Créer des contenus animés pour vos pages Web
Créer des annonces pour des réseaux publicitaires
Retoucher le code HMTL/CSS de vos contenus
1) Les spécificités du Web de demain
2) L'interface de Google Web Designer
3) Utilisation des outils d'animation
4) Les outils 3D
5) Création d'annonces
6) Prévisualisation et publication
7) Création d'un document HTML
Travaux pratiques
Réflexions collectives, exercices de réalisation de supports publicitaires numériques.
1) Les spécificités du Web de demain
- Tour d'horizon du Web : les spécificités du média Web, le Responsive Design.
- Le référencement, HTML5/CSS3 vs Flash.
- Google Web Designer et Google AdWords.
- Google Web Designer vs Adobe Edge Animate.
Réflexion collective
Partages d'expériences.
2) L'interface de Google Web Designer
- Créer des animations en mode rapide ou avancé.
- L'espace de travail. Le mode conception, le mode éditeur de code.
- La barre Vue.
- Les outils de création de textes et d'éléments.
- Les outils de sélection de couleurs et des outils 3D.
- La timeline.
- Les panneaux (couleur, propriétés, événements et CSS).
- Le centre d'aide.
Travaux pratiques
Installation de Google Web Designer. Ouvrir son premier document.
3) Utilisation des outils d'animation
- Dessiner des formes géométriques avec l'outil Forme.
- Dessiner des lignes droites, des courbes et des lignes fermées avec l'outil Stylo.
- Ajouter du texte. Ajouter de la couleur à un objet.
- Bien utiliser la timeline, modifier l'accélération et la décélération d'une transition avec les lissages.
- Modifier les styles CSS d'un objet.
Travaux pratiques
Création de contenus animés.
4) Les outils 3D
- Modifier la vue 3D.
- La rotation des objets en 3D.
- Modifier la position d'un objet.
Travaux pratiques
Manipuler des objets en 3D.
5) Création d'annonces
- Les solutions publicitaires : les plateformes DoubleClick Studio et AdMob.
- Les bannières.
- Les annonces extensibles et interstitielles.
- Les composants pré-enregistrés (galerie à 360°, carrousel, vidéo, Youtube...).
page 36
- Ajouter des événements.
- Créer des annonces Generic (Ad Exchange).
Travaux pratiques
Réalisation de bannières publicitaires pour DoubleClick Studio ou AdMob.
6) Prévisualisation et publication
- Prévisualiser une annonce dans un navigateur.
- Processus de publication d'une annonce pour DoubleClick Studio.
- Processus de publication d'une annonce pour AdMob.
Travaux pratiques
Prévisualisation en local.
7) Création d'un document HTML
- Le HTML5 et le CSS3 avec GWD.
- Publier, intégrer vos éléments dans un projet global.
Travaux pratiques
Réalisation d'un header animé.
page 37
Réf : PXM
Participants
Concepteurs et développeurs
d'applications, architectes
logiciels, chefs de projets.
Pré-requis
en développement, bases
de données, architectures
Internet/Web.
Prix 2017 : 2440€ HT
Dates des sessions
Paris
15 nov. 2016, 6 déc. 2016
21 fév. 2017, 18 avr. 2017
6 juin 2017, 29 aoû. 2017
Aix
13 déc. 2016
Bordeaux
20 déc. 2016
Bruxelles
Technologies XML, conception, mise en œuvre
Best
XML est devenu incontournable tant sur le poste utilisateur que sur les serveurs de l'entreprise. Le besoin
de partage et d'échange d'informations entre utilisateurs et entre applications a accéléré l'usage des
technologies XML. Ce stage vous montrera comment tirer profit de ces technologies et des normes
associées. Au moyen de travaux pratiques, vous apprendrez à concevoir et à gérer vos données XML, à les
diffuser et à les publier, à les exploiter via vos applications, vos services Web et vos bases de données, sans
négliger les aspects liés à la sécurité.
Créer des documents XML valides et bien formés
Parser des documents XML
Générer des documents multi formats via des transformations XSL-T et XSL-FO
Découvrir les technologies XML à la base des échanges de données
Comprendre le positionnement du XML par rapport aux bases de données
Découvrir les différents protocoles de sécurisation XML
Découvrir les technologies XML permettant de concevoir des interfaces graphiques
1) Industrie XML
2) Les parseurs XML
3) Validation de documents
4) Transformation XSL-T
5) Publication de documents
6) Message et échanges XML
7) XML et les bases de données
8) Sécurité des échanges XML
9) Technologies graphiques XML
6 déc. 2016, 21 mar. 2017
13 juin 2017
Geneve
6 déc. 2016, 21 mar. 2017
13 juin 2017
Grenoble
13 déc. 2016
Lille
13 déc. 2016
Luxembourg
6 déc. 2016, 21 mar. 2017
13 juin 2017
Lyon
13 déc. 2016
Montpellier
1) Industrie XML
- Rappel sur les langages structurés : SGML, HTML, XML et XHTML.
- Le contexte actuel. Pourquoi XML est incontournable ?
- XML et le schéma directeur du S.I. La structure XML.
- Avantages et inconvénients de XML.
- Comparaison entre les différents formats : XML, JSON, CSV.
- Rôle prédominant des offres bureautiques.
- Les langages XML techniques (WML, SVG, XAML, VoiceXml) et les langages XML métier (FixML, CML...).
- Panorama des éditeurs XML.
Travaux pratiques
Création de documents de différents formats : XML, CSV et JSON.
2) Les parseurs XML
20 déc. 2016
Nantes
20 déc. 2016
Rennes
20 déc. 2016
Sophia-antipolis
13 déc. 2016
Strasbourg
13 déc. 2016
Toulouse
20 déc. 2016
- Offre du marché. Rôle des parseurs : performances, avantages et inconvénients.
- Les types de parseurs : push (SAX), pull (XMLPull ou StAX).
- Les représentations arborescentes (DOM, JDOM...), "Data Binding" (Castor ou JAXB).
- Les Data Island et l'intégration dans les pages Web.
- Les accélérateurs XAN (XML Aware Network).
- Les parseurs Java (JAXP), .NET, Flash (XML Parser).
- Ajax et la lecture de données dans les pages HTML.
Travaux pratiques
Mise en œuvre de différents parseurs.
3) Validation de documents
- Structure et composants d'un document XML : éléments, attributs, entités...
- Les métadonnées (XMP, ITCP, EXIF).
- Document bien formé et document valide.
- Les modèles de validation. DTD, XML-schema (XSD), Relax-NG, Schematron. Syntaxe et mise en œuvre.
- Schémas XSD : structure, syntaxe, typage des données, outils de composition. Modélisation.
- Les Namespaces. Rôle, intégration, partage, création.
- Exemple d'appel à partir d'une page XHTML.
Travaux pratiques
Edition de documents XML, validation de documents. Création de documents DTD et XSD. Association de
Namespaces aux DTD et XSD.
4) Transformation XSL-T
- Enjeux du langage XSL-T.
- Intégration dans le système d'information.
- Les processeurs XSL-T.
page 38
- Le langage de transformation XSL-T 1.0, 2.0 et 3.0 : construction d'arbres, restructuration.
- Génération multiformat : XHTML, SVG, PDF.
Travaux pratiques
Génération d'un document via une transformation XSL-T.
5) Publication de documents
- Visualisation brute d'un document sur les navigateurs.
- Mise en forme avec les feuilles de style CSS.
- Rôle du XHTML sur l'accessibilité. Conseils techniques. Outils de validation du W3C.
- XPATH 1.0, 2.0 et 3.x : naviguer dans les données XML.
- Les feuilles de style XSL-T : templates, structures. Mode de programmation déclaratif, impératif, hybride.
- Le langage XSL-FO pour le formatage d'objets.
- Conversion en format papier PDF, RTF... Avantages et usage des outils de génération de XLS (Stylevision).
Travaux pratiques
Création de feuille de style en XSL-T et XSL-FO.
6) Message et échanges XML
- Le DOM du W3C et l'interface de programmation normalisée : Data Island, Ajax, JavaScript.
- Les serveurs d'applications : .NET et Java EE.
- Portail d'entreprise.
- Transfert et sérialisation de messages : Rest, XML-RPC, SOAP, WSDL, UDDI. Définition des Services
Web.
- XML et la bureautique. Les formats d'échange de documents. RDF.
- Dynamisation XSL de documents bureautiques : Microsoft Office (Open XML), Open Office (Open
Document).
Travaux pratiques
Création d'un document Microsoft Office Open XML. Interrogation d'un Service Web.
7) XML et les bases de données
- Positionnement du XML par rapport aux bases de données. Stockage de documents XML. Bases semistructurées. Data Island.
- SGBDR aux bases natives XML Xindice, Tamino.
- Outils de Mapping pour la production de codes C#, Java, XSL dédiés aux conversions de types (SOAP /
SGBD / XML / XSD).
- Langages d'interrogation XML : XPath, XQuery, extensions du SQL.
- XML et les bases de données (Oracle, SQL Server, MySQL).
8) Sécurité des échanges XML
- Principe du chiffrement, signature électronique, certificat numérique (X509...).
- Les différents protocoles de sécurisation XML : HTTPS, XML Signature (Xml Dsig), XML encryption, XML
access control...
- La sécurisation des services Web : WS-security (SOAP).
Travaux pratiques
Exemples des différentes technologies présentées.
9) Technologies graphiques XML
- Présentation de langage d'interfaces (XAML...).
- SVG : standard vectoriel, dynamisation XSL, animations web SMIL.
- InfoPath : la technologie de formulaires électroniques.
- Blogs et RSS (Really Simple Syndication), ATOM un format de syndication de contenu Web.
Travaux pratiques
Dynamisation d'un graphique avec SVG et XSL.
page 39
Réf : LSX
Participants
Concepteurs et développeurs
d'applications, architectes
logiciels, chefs de projets.
Pré-requis
XML et de la syntaxe HTML.
Développer avec XSL-T et XSL-FO
générer des documents XML, HTML, graphiques et pdf
Cette formation vous permettra de maîtriser les langages XSL-T et XPath et de réaliser des feuilles de
style en utilisant des techniques avancées. Elle vous montrera comment utiliser le langage XSL-FO pour
la génération de documents PDF ainsi que le langage SVG pour la génération d'images et d'interfaces
sophistiquées. Les participants mettront en place un environnement complet de production automatisée de
documents contenant à la fois textes et images.
Prix 2017 : 2440€ HT
Dates des sessions
Paris
15 nov. 2016, 14 fév. 2017
9 mai 2017
Réaliser des feuilles de style à l'aide des langages XSL-T et XPath
Manipuler des données et naviguer au sein de documents XML
Générer des documents PDF à l'aide du langage XSL-FO
Générer des images et des interfaces graphiques à l'aide du format SVG
1) Introduction au contexte de XSL et XPath
2) Le langage d'interrogation : XPath
3) Le langage de transformation : XSL-T
4) XSL-T, fonctionnalités avancées
5) La boîte à outils du développeur
6) XSL-T 2.0 et 3.0, X-PATH 2.0 et 3.0
7) SVG pour les interfaces graphiques et la
création d'images
8) XSL-FO pour la génération de documents
papier
1) Introduction au contexte de XSL et XPath
- Besoins par rapport à l'utilisation de la technologie XML.
- Technologie CSS pour la présentation, limites de CSS.
- Introduction à XSL, XSL-T, XSL-FO et SVG.
- Introduction à Xpath. Principes et mécanismes de base.
- Parseur XML et processeur XSL. Support par les navigateurs Web.
- Mise en œuvre des technologies XSL.
2) Le langage d'interrogation : XPath
- Expressions XPath. Interrogation d'un document XML.
- Axes et vecteurs de recherche.
- Revue de quelques expressions simples.
- Sélection d'éléments/nœuds, de jeux de nœuds et d'attributs dans un arbre XML.
- Opérateur de localisation.
- Equation d'égalité et de relation, opérateurs booléens. Opérations numériques.
- Fonctions standard et extensions des processeurs.
Travaux pratiques
Ecriture et tests d'expressions XPath.
3) Le langage de transformation : XSL-T
- Structure d'une feuille de style XSL-T, traitement du processeur XSL-T.
- Namespaces et éléments XSL racine.
- Formats de sortie : vocabulaires XML, HTML, X-HTML ou texte.
- Utilisation d'expressions XPath.
- Nœuds et jeux de nœuds.
- Modèle de traitement : les templates.
- La syntaxe du langage XSL-T, les types de données, les structures de contrôle, etc.
- Notions de variables et de paramètres.
- Génération d'éléments et d'attributs.
- Invocation déclarative ou impérative des traitements.
- Récupération d'éléments et de contenu.
- Analyse du comportement d'un processeur XSL-T.
- Optimisation des recherches de nœuds.
- Traitement des erreurs.
Travaux pratiques
Composition de différents types de feuilles de style XSL-T.
4) XSL-T, fonctionnalités avancées
- Ecriture de fonctions : appels simples et récursifs.
- Structure modulaire des feuilles de style.
- Les design patterns : Fill-in-the-blank, Navigational, Rule-based, Computational.
- Import et inclusion de feuilles de style avec passage d'arguments.
- Création de librairies réutilisables.
page 40
- Modularité et héritage.
- Transformations basées sur des sources multiples.
- Générations de groupes de documents.
- Spécificités de certains processeurs.
- Travail sur des espaces de noms hétérogènes.
- Dynamisation XSL de documents bureautiques : Microsoft Office (Open XML), Open Office (Open
Document).
Travaux pratiques
Création de feuilles de style modulaires et imbriquées, avec de multiples structures en entrée et génération
de plusieurs documents en sortie. Création de documents MS Office par XSL.
5) La boîte à outils du développeur
- Lancement de transformations en ligne de commande.
- Utilisation de divers processeurs (XT, Saxon, Xerces, MSXml...).
- Ecriture de script de transformation avec Ant.
- Gestion de site Web.
Travaux pratiques
Mise en place d'un environnement de gestion de site Web basé sur XML.
6) XSL-T 2.0 et 3.0, X-PATH 2.0 et 3.0
- Nouveautés : fonctions, expressions, opérations, tris, fallbacks et traitements des erreurs, etc.
- Nouveaux types de données supportés.
- Différences de traitement.
- Création d'arbre résultat, d'une séquence de nœuds ou de valeurs.
- Requêtes XPath avec expressions régulières.
- Les fonctions et opérateurs sur les numériques.
- Les fonctions sur les chaînes de caractères.
- Les fonctions et les opérations sur les dates.
Travaux pratiques
Manipulation et navigation d'arbres XML.
7) SVG pour les interfaces graphiques et la création d'images
- SVG, Scalable Vector Graphics. Les enjeux des langages vectoriels. Avantages de SVG sur Flash.
- Utilisation côté serveur et côté client.
- Environnements d'édition et d'utilisation : navigateurs...
- Structure de document.
- Les systèmes de coordonnées et le dimensionnement. Transformation du système de coordonnées.
- Les formes de base. Les styles. Les courbes et les chemins. Motifs et dégradés. Texte et
internationalisation.
- Masquage et découpe.
- Filtrage.
- Animation, interaction et scripts.
Travaux pratiques
Création de feuilles de style permettant de générer des documents SVG. Génération de pages HTML
contenant des graphes.
8) XSL-FO pour la génération de documents papier
- XSL-FO, Formatting Objects.
- Besoins et objectifs de XSL-FO. Introduction au langage.
- Solutions et implémentations disponibles.
- Exemple à partir du projet FOP de Apache.org.
- Initialisation, définition de modèles de pages.
- La zone de contenu, dimensions des régions, séquences des pages.
- Inclusion de graphiques au format SVG.
- Génération du résultat.
Travaux pratiques
Création de feuilles de style combinant XSL-T et XSL-FO pour générer des sorties en PDF. Génération d'un
rapport contenant des images au format SVG.
page 41
Réf : CAX
Participants
Architectes, concepteurs,
développeurs, chefs de
projets et maîtres d'ouvrage
informatique devant concevoir
des modèles XML pour les
données et les documents de
leurs systèmes d'information.
Pré-requis
Connaissances de base des
technologies XML et de la
modélisation de données.
XML, modéliser vos documents et données
OBJECTIFS
Ces dernières années ont vu une forte progression de la popularité de XML, le standard du W3C pour
l'écriture de documents structurés. A l'issue de cette formation, le participant aura une maîtrise complète de
la syntaxe du langage XML Schema et des règles de modélisation permises par ce langage.
1) Rappels sur XML et les technologies
associées
2) XML et la composition de documents
3) Les espaces de noms
4) Le langage XML Schema
5) Techniques de modélisation XML
6) XML et la conception objet
7) Les meilleures pratiques de modélisation
Prix 2017 : 1960€ HT
1) Rappels sur XML et les technologies associées
Dates des sessions
- Structure et composants d'un document XML.
- Document bien formé et document valide.
- Les données structurées et semi-structurées.
- Les différents types de parseurs XML et leur rôle.
- La galaxie des technologies XML.
Paris
24 oct. 2016, 5 déc. 2016
27 mar. 2017, 6 juin 2017
Travaux pratiques
Créer et valider un document XML.
2) XML et la composition de documents
- Objectifs des langages de structuration : DTD, XML Schema, Schematron et Relax NG.
- Les principales parties d'un schéma.
- Syntaxe EBNF pour DTD (Data Type Definition).
- Validation des documents. DTD à racines multiples.
Travaux pratiques
Ecriture d'une DTD et de documents conformes à celle-ci. Restructuration modulaire de la DTD.
3) Les espaces de noms
- Description et utilisation des espaces de noms.
- Combinaison de vocabulaires multiples.
- Combinaison de langages : XHTML, Xforms et SVG.
- Etude de la portée d'un espace de nom.
Travaux pratiques
Ecriture d'un document utilisant plusieurs espaces de noms.
4) Le langage XML Schema
- La syntaxe du langage.
- Définition d'un vocabulaire et d'une grammaire.
- Tester les valeurs des éléments et des attributs.
- Organisation des éléments : séquence, choix, tas.
- Utilisation des clés et des règles d'unicité.
Travaux pratiques
Redéfinition d'une DTD avec la syntaxe XML-Schema. Amélioration du code.
5) Techniques de modélisation XML
- Les modèles de conception.
- Schémas uniques applicables à différents types de documents.
- Modèles génériques réutilisables (liste, grille, etc.).
- Documents utilisant de multiples schémas.
Travaux pratiques
Application des modèles étudiés.
6) XML et la conception objet
- Rappels sur les concepts de l'orienté objet.
- Concepts objets du langage XML Schema.
- Types, classe, dérivation, polymorphisme.
- Représentation UML/XML. Inclusion de schémas.
Travaux pratiques
Composition de schémas modulaires et réutilisables.
page 42
7) Les meilleures pratiques de modélisation
- Composition et héritage.
- Types de constructions : "Poupées russes", "Tranches de salami" et "Stores vénitiens".
- Catalogues de modèles de conception.
- Des modèles de contenu extensible.
Travaux pratiques
Evaluation des méthodes de composition et utilisation des différents langages.
page 43
Réf : XAW
Participants
Webmasters, développeurs
Web et informaticiens.
Pré-requis
Bonnes connaissances du
Web, d'HTML et de CSS.
Connaissances de base du
JavaScript et du XML.
Prix 2017 : 2440€ HT
Dates des sessions
Paris
15 nov. 2016, 21 mar. 2017
16 mai 2017, 10 juil. 2017
Développer des applications Web 2.0
solutions et mise en œuvre
Le Web 2.0 est une évolution majeure d'Internet qui permet la conception d'applications et de services Web
innovants. Vous apprendrez dans ce cours à maîtriser les règles de conception de ces applications et mettrez
en œuvre les technologies nécessaires pour les développer.
Maîtriser les concepts et les technologies Web 2.0
Développer des interfaces graphiques Responsive Design
Créer des formulaires dynamiques
Découvrir les principales librairies JavaScript permettant de dynamiser un site Web
1) Rappels JSON, XML
2) Web 2.0
3) Feuilles de style
4) Interfaces graphiques
5) Interaction et formulaires
6) JavaScript
7) Les Frameworks
8) Les solutions Web 2.0
1) Rappels JSON, XML
- Structure XML, JSON et documents valides.
- Savoir lire, générer des fichiers XML, JSON.
- XML et référencement (SEO, SiteMap).
Travaux pratiques
Création de documents XML, JSON, lecture de documents XSD.
2) Web 2.0
- Les concepts et les technologies Web 2.0.
- Règles de conception.
- Navigateurs et terminaux du marché, impact sur la portabilité.
- Importance de la sémantique sur le référencement.
Travaux pratiques
Analyse d'ergonomie Web 2.0. Interrogation de Services Web à partir du Web.
3) Feuilles de style
- Les feuilles de style CSS, CSS-3 : couplage avec XML.
- Le développement d'interfaces riches et animées.
Travaux pratiques
Paramétrage automatique de blocs, calques, menus, zones de formulaires à partir de CSS.
4) Interfaces graphiques
- Interfaces Responsive Design, HTML 5.
- Migration des modules Flash vers les interfaces nouvelles.
- Présentation des technologies RIA et RDA.
Travaux pratiques
Développement d'une application de base Responsive, création de widgets.
5) Interaction et formulaires
- Formulaires dynamiques dans les interfaces Web 2.0.
- Les solutions de contrôle de saisie (autosuggest...).
- Raccordement aux bases de données.
Travaux pratiques
Démonstration et création de formulaires.
6) JavaScript
- Variable, fonctions. Manipulation d'objet.
- Manipulation du DOM pour gérer l'interactivité.
- Portabilité, industrialisation des programmes.
- Environnements de développement et de test.
- Ajax. Principe. Codage.
- Performance.
Travaux pratiques
page 44
Mise en œuvre d'un environnement de test et de débogage, création de mécanismes Ajax. Problématique de
performance.
7) Les Frameworks
- Les frameworks de services en lignes (Google Maps...).
- Les frameworks techniques jQuery, Angular et leur intégration.
- Les frameworks graphiques (GWT, jQueryUI...).
- Les clouds et leurs API ouvertes.
Travaux pratiques
Mise en place d'un service de géolocalisation et de cartographie avec Google Maps. Mise en œuvre d'un
développement jQuery ou Angular.
8) Les solutions Web 2.0
- WordPress pour la création et gestion de ses blogs.
- Les Wikis.
- Les solutions de commerce 2.0 (Prestashop, Magento...).
Travaux pratiques
Création d'un blog, d'une boutique en ligne.
page 45
Réf : DHL
Participants
projets Web.
Best
HTML. Connaissances de
base en programmation.
Le langage JavaScript est devenu incontournable dans le développement de sites Web, tant pour sa
relation forte à l'interface graphique que pour le traitement client/serveur. Ce stage vous apportera toute
la connaissance pour interfacer le langage avec les éléments graphiques des pages Web et ainsi pouvoir
réaliser des menus déroulants, des animations, modifier dynamiquement les styles de présentation ou encore
réagir aux actions de l'utilisateur... Il vous apprendra également à lancer des requêtes au serveur (Ajax) et à
manipuler des données XML.
Prix 2017 : 2440€ HT
Pré-requis
Dates des sessions
Paris
11 oct. 2016, 15 nov. 2016
20 déc. 2016, 17 jan. 2017
14 fév. 2017, 14 mar. 2017
11 avr. 2017, 9 mai 2017
13 juin 2017, 18 juil. 2017
22 aoû. 2017
Aix
6 déc. 2016, 21 fév. 2017
30 mai 2017
Maîtriser la syntaxe du langage JavaScript
Manipuler la structure DOM d'une page HTML
Gérer la programmation événementielle
Interagir avec les feuilles de style CSS
Gérer des échanges asynchrones AJAX
3) Evénements et données
4) Gestion de formulaires HTML
5) Interaction avec les feuilles de style en
cascade
6) Manipulation du DOM XML
7) Ajax
Bordeaux
Travaux pratiques
20 déc. 2016, 28 fév. 2017
16 mai 2017
Programmation JavaScript, manipulation du DOM, gestion de l'interactivité.
Bruxelles
22 nov. 2016, 7 mar. 2017
6 juin 2017
Lille
- Présentation des types de navigateurs. Impact sur la portabilité des programmes JavaScript. Versions de
JavaScript.
- Les composants Web : HTML, XHTML, CSS, JavaScript, Flash, Java... Les protocoles HTTP, HTTPS.
- Impact de JavaScript sur l'accessibilité et le référencement.
- Importance de JavaScript sur les sites Web 2.0. Impact de la conformité XHTML sur l'utilisation dynamique
de JavaScript.
- Les outils de développement (éditeur, débogueur...).
6 déc. 2016, 21 fév. 2017
30 mai 2017
Geneve
22 nov. 2016, 7 mar. 2017
6 juin 2017
Grenoble
8 déc. 2016, 28 fév. 2017
16 mai 2017
Luxembourg
22 nov. 2016, 7 mar. 2017
6 juin 2017
Lyon
6 déc. 2016, 28 fév. 2017
16 mai 2017
Montpellier
11 oct. 2016, 20 déc. 2016
21 fév. 2017, 30 mai 2017
Nantes
11 oct. 2016, 20 déc. 2016
21 fév. 2017, 30 mai 2017
Rennes
20 déc. 2016, 21 fév. 2017
30 mai 2017
Sophia-antipolis
- Déclaration et portée des variables.
- Types de données (Number, Boolean, Date, Math, String, Array). Conversion de type. Détection de type
avec typeof.
- Gestion des tableaux. Opérateurs logiques et arithmétiques. Boucles (for, while...).
- Création de fonctions et paramétrage variable.
- Faire un codage sécurisé avec la gestion d'erreur et les exceptions.
- Rappels sur les concepts objets. Développement Objet en JavaScript : création de classes (méthodes,
propriétés).
- Constructeur. Surcharge. Mots réservés prototype, this. Création d'instance. Usage d'Object sur les classes
dynamiques.
- Utilisation du format JSON pour la création de classes.
- Les objets prédéfinis du langage (Array, Date, String, Regexp...) et leur utilisation. Extension des objets
prédéfinis.
Exercice
Mise en oeuvre des différentes fonctionnalités JavaScript à travers de multiples travaux pratiques.
6 déc. 2016, 21 fév. 2017
30 mai 2017
Strasbourg
- Organisation des événements. Impact des événements sur les types de navigateurs et versions de DOM.
- Positionner des écouteurs sur des événements par programme et paramétrage de balises HTML.
- Règles pour faire un codage multinavigateur.
- Créer, détruire des écouteurs.
- Les traitements événementiels JavaScript : gestionnaire clavier, souris, formulaires, rollover, menus
dynamiques.
- L'objet Event et son utilisation.
- Les objets du DOM (window, document...) et leur manipulation.
- Manipulation des URL (redirections http ...).
- Gestion des cookies (lecture et écriture).
8 déc. 2016, 21 fév. 2017
30 mai 2017
Toulouse
11 oct. 2016, 20 déc. 2016
28 fév. 2017, 16 mai 2017
Exercice
Programmation d'événements multiples sur les éléments formulaire, souris, clavier...
page 46
- Manipulation de contenu de formulaires.
- Accès et modification dynamique des composants du formulaire : zone de saisie, cases à cocher, cases
d'options...
- Fonctions de validation de formulaire.
- Evénements liés aux éléments de formulaire : changement, initialisation, clic...
Exercice
Conception de fonctions personnalisées contrôlant les activités de l'utilisateur.
5) Interaction avec les feuilles de style en cascade
- Rappel sur les feuilles de style en cascade (CSS-1, CSS-2). Les outils pour les manipuler.
- Implémentation des CSS en tant que propriétés des objets du DOM.
- Modification directe des propriétés CSS des objets du DOM.
- Modification de l'objet CSS stylesheets.
- Rendre la page dynamique via le changement des propriétés de style.
Exercice
Réalisation de pages simples afin de se familiariser à l'utilisation de feuilles de style et à leur manipulation à
travers JavaScript.
- Présentation du langage XML (éléments attributs).
- Implémentation des parseurs XML chez Microsoft IE et les autres : variantes entre les navigateurs,
maintenance...
- Manipulation des objets du DOM (lecture, ajout, suppression, modification de noeuds).
Exercice
Familiarisation à la construction d'un chemin d'accès à un élément du DOM.
7) Ajax
- Présentation de Asynchronous JavaScript And Xml.
- Enjeux, solutions et alternatives.
- Les bibliothèques du marché.
- HTTP et Ajax : échanges HTTP et l'objet XMLHttpRequest.
Exercice
Récupération de données XML et affichage des données. Interrogation d'une base de données. Création d'un
formulaire de connexion.
page 47
Réf : SPT
Participants
Développeurs JavaScript
confirmés, architectes et chefs
de projets.
Pré-requis
Bonne connaissance de
JavasScript (ES5) est requise.
Connaissance de base des
composants du web.
Prix 2017 : 1960€ HT
Dates des sessions
Paris
14 nov. 2016, 6 fév. 2017
3 avr. 2017, 19 juin 2017
Ecmascript 6, mettre en oeuvre le nouveau JavaScript
anticiper la migration des applications
Le langage JavaScript est devenu un langage incontournable dans les développements web et mobiles tant
côté client que côté serveur avec notamment Node.js. Cette formation vous permettra d'utiliser en production
dès aujourd'hui les nouvelles fonctionnalités de la dernière version EcmaScript 2015.
Découvrir les nouveautés syntaxiques du JavaScript
Maîtriser les nouvelles API
Utiliser ES6/ES2015 en production
Anticiper l'évolution des Frameworks du Front-End
Se préparer aux nouvelles méthodes de développement JavaScript
1) De JavaScript ES5 à ES2015
2) Evolutions syntaxiques fondamentales
3) POO, nouveautés pour la conception objet
4) Nouvelles API JavaScript avec ES6
5) Modules JavaScript
6) Mise en production
Développement. Migration d'applications existantes. 50% de théorie illustrée par 50% de pratique.
Travaux pratiques
Réalisation d'une application et portage en modules ES6.
1) De JavaScript ES5 à ES2015
- ES5, JS.next, ES6 / ES2015 évolution et "roadmap".
- ES5, rappel des bonnes pratiques. Etablir les règles de programmation.
- ES5 ''use strict" et méthodes moins connues.
- API issues de la communauté JavaScript.
- Support courant pour ES6 : compilateurs, polifylls, navigateurs serveurs.
- Environnement et outils pour le développeur.
Travaux pratiques
Vous programmerez, à partir d'exemples fournis, un micro framework applicatif JavaScript.
2) Evolutions syntaxiques fondamentales
- Constantes et variables de bloc. Assignation destructurée.
- Chaînes de caractères : multiligne, template, formatage.
- Fonction, paramètres par défaut, opérateurs "rest / spread".
- "Arrow Function" : portée lexicale. Usages.
- Fonction génératrice : "yeld" et "generator object".
- Fonction itératrice : "iterator".
- Objet littéral : évolution.
Travaux pratiques
Migration du code vers ES2015.
3) POO, nouveautés pour la conception objet
- Modèles de classe et héritage. Méthodes statiques.
- Création de "proxy". Design pattern.
- Nouveaux types : Set, Weakset, Map, Weakmap.
- Objets natifs héritables.
Travaux pratiques
Organisation et structuration du code pour une approche Objet par classe. Révision des "Design Pattern".
4) Nouvelles API JavaScript avec ES6
- Promise : gestion des traitements asynchrones.
- Object.API : revisiter les méthodes.
Travaux pratiques
Développement d'un service de données Ajax utilisant l'API des Promise.
5) Modules JavaScript
- Asynchronous Module Definition ou CommonJS.
- Système natif de gestion des modules.
- Gestion et résolution des dépendances.
page 48
- Chargement dynamique.
Travaux pratiques
Structurer son développement par modules.
6) Mise en production
- Stratégie : "transpileur", "package manager" et système de module.
- Choix du "transpiler" : présentation des solutions.
- Mise en œuvre de TypeScript, Traceur, Babel.
- Pourquoi "packager" son code ? Avantages et solutions.
- Création de package avec npm, bower et jspm.
- Choisir entre RequireJS, Browserify, WebPack et SystemJS.
- Interactions avec les autres outils (linting, test...).
Travaux pratiques
Création et intégration de package dans le développement.
page 49
Réf : HML
Participants
Développeurs Web. Chefs de
projet Web.
Pré-requis
Bonnes connaissances
du langage HTML et de
JavaScript.
Prix 2017 : 1440€ HT
Dates des sessions
Paris
7 nov. 2016, 9 mar. 2017
1 juin 2017
HTML5, maîtriser les API JavaScript
OBJECTIFS
Vous apprendrez dans cette formation à mettre en œuvre les différentes API JavaScript proposées par
les nouvelles spécifications HTML5. Vous manipulerez ainsi celles dédiées au stockage des données, à la
communication client/serveur ou encore à la géolocalisation.
1) Introduction
2) Gestion de la persistance
3) Gestion du cache
4) Communication Client/Serveur
5) Gestion du glisser/copier
6) Géolocalisation
1) Introduction
- Les nouveautés HTML 5 : les nouveaux éléments sémantiques, les principales balises, les formulaires...
- Les nouveaux sélecteurs CSS : recherche d'éléments par Classe, par sélecteurs...
Travaux pratiques
Recherche d'éléments par positionnement ou Classe.
2) Gestion de la persistance
- Vue d'ensemble des problématiques de stockage.
- Stockage en local (localStorage), en session ou en base de données.
- Création de bases, requêtes.
- Outils d'administration sqLite.
- Opérations SQL disponibles.
Travaux pratiques
Création d'une table produit avec requêtage.
3) Gestion du cache
- Création d'application en mode non connecté.
- Création du fichier manifest.
- Prise en charge du mode déconnecté.
- Evénements liés au gestionnaire de cache : événements offline, online.
Travaux pratiques
Mise en place d'un mode déconnecté.
4) Communication Client/Serveur
- Communication crossDomain.
- Cross Document Messaging.
- API PostMessage.
- Types de communication : polling, long-polling, streaming.
- Ecouteur de messages émis par le serveur. API EventSource.
- XMLHTTPRequest Level 2. Présentation Level 2. Les événements de progression. Communication
multidocuments.
- Communication Web sockets. API et protocole.
Travaux pratiques
Mise en oeuvre et comparaison des différents protocoles C/S.
5) Gestion du glisser/copier
- Mécanismes du glisser/copier (Drag'n'Drop).
- API de manipulation du glisser/copier.
- L'attribut draggable.
- Propriété de comportements.
- Les événements.
- Possibilités et limites.
- Transfert d'un fichier, d'une image par glisser/copier.
Travaux pratiques
Gestion panier par glisser/copier.
6) Géolocalisation
- Vue d'ensemble de la géolocalisation.
- Données privées.
- Sources d'information de localisation.
- Utilisation de l'API de localisation.
- Respect de la vie privée.
page 50
Réf : JPG
Participants
projet Web.
Pré-requis
en JavaScript et HTML.
XML.
Prix 2017 : 2440€ HT
Le langage JavaScript est devenu incontournable pour le développement d'applications client riches. Ce
cours vous donnera tout le savoir-faire technologique pour mettre en oeuvre de véritables applications Web à
partir de concepts avancés JavaScript ES5, tout en vous préparant à l'utilisation de ES2015.
Découvrir les concepts avancés JavaScript ES5
Mettre en pratique la Programmation Orientée Objet
Maîtriser l'environnement de débogage
Mettre en œuvre le Framework JavaScript jQuery
Manipuler les API JavaScript HTML5
Appréhender la notion de JavaScript côté serveur avec Node.js
Dates des sessions
Paris
24 oct. 2016, 15 nov. 2016
14 fév. 2017, 9 mai 2017
1) Rappels JavaScript : ES5, DOM, événement,
manipulation
2) Framework jQuery
3) Initiation à ES6 / 2015
4) Programmation Orientée Objet
5) Expressions régulières
6) Environnement de débogage
7) Echange de données, interactions
8) Programmation JavaScript sous HTML5
1) Rappels JavaScript : ES5, DOM, événement, manipulation
- Les méthodes de création dynamique d'objets.
- Phases des événements capture, capturing, bubble.
- La gestion des événements. Les objets de type Event.
- Structure de données XML et JSON
- Les méthodes avancées en ES5.
Exercice
Echange de données JSON. Création d'événements.
2) Framework jQuery
- Fonctionnement et intégration.
- Gestion et délégation des événements.
Travaux pratiques
Créer un plugin jQuery.
- Les nouveautés principales.
- ES6 en production.
Travaux pratiques
Mise en production de code ES2015 avec TypeScript et Node.js.
- Rappels sur l'objet. Propriétés.
- La chaîne de portée. La chaîne de prototype.
- Design Pattern Clés en JavaScript.
- Closure function. Singleton et Modules.
Exercice
Mise en pratique de la POO. Développer un micro Framework de gestion du DOM.
- Bien utiliser l'objet RegExp.
- Validation asynchrone.
Travaux pratiques
Contrôle de dates, email.
- Chrome Devtools, Firefox Developper, Node-debug
- Gérer les messages d'erreur client en production.
- Tests multinavigateurs. Stockage des tests.
page 51
- Tests de performance.
Travaux pratiques
Recherche de bugs et optimisation des performances avec les ChromeDevtools.
- Compenser les latences de communication.
- JSON Web Token, sécuriser les échanges.
- Ajax et XMLHttpRequest, consommation de services distants.
- Serveur JavaScript Node.js.
Travaux pratiques
Appel de services Web. Utiliser une base embarquée, échanges avec la base distante.
- Nouveaux événements.
- Gestion des API multimédia.
- Modes de communication client/serveur.
- Utilisation des Web Worker.
- Le développement mobile "offline first".
- Technique d'optimisation des communications client/serveur.
Travaux pratiques
Manipulation des API JavaScript sous HTML5.
page 52
Réf : PAJ
Participants
Ce cours s'adresse aux
Web, informaticiens.
Pré-requis
Bonnes connaissances en
Javascript et en technologies
Web côté client.
Prix 2017 : 1960€ HT
Dates des sessions
Paris
28 nov. 2016, 6 fév. 2017
2 mai 2017
OBJECTIFS
Ajax est devenu une technologie incontournable du développement d'applications riches Web 2.0. Durant ce
cours, vous apprendrez la manipulation de ses composants, le CSS, le DOM, ainsi qu'à établir des échanges
client-serveur.
1) Ajax
2) Rappels XML et Javascript
3) Javascript Object Notation (JSON)
4) Programmation du DOM
5) Traitements XML en Javascript
6) XMLHttpRequest
7) Les patterns Ajax
8) Compléments
1) Ajax
- Les objectifs d'Ajax. Principes de fonctionnement.
- Choisir entre Ajax et Flash, Applet, Html. Application.
- La structure XML. Les namespaces.
- Les moyens de validation XML : DTD et XSD.
- Limite du XPath. Mise en oeuvre XSLT en Ajax.
- La programmation Objet. Types. Variables. Tableaux.
- Ecmascript. Emergence d'ActionScript.
Travaux pratiques
Création d'une structure XML bien formée et valide. Manipulation de classes et d'objets.
- Avantages et inconvénients dans les échanges.
- Objets, Arrays, syntaxe et parseur JSON.
- JSON, avantages et inconvénients.
- Sérialisation entre client et serveur.
- Importance du langage XHTML. Composants DHTML.
- Le rôle du DOM dans la programmation XML.
- Gestion dynamique de CSS.
Travaux pratiques
Modification dynamique du DOM d'une page HTML.
- Présentation XSLT. Langage Xpath. Format RSS.
Travaux pratiques
Traitement XSLT. Usage de flux RSS.
6) XMLHttpRequest
- Créer et utiliser un objet XMLHttpRequest.
- Outils de débogage (IE Toolbar, Firebug).
- Modification des en-têtes HTTP.
- Encodage et décodage des données.
- Gestion des erreurs. Gestion du cache.
Travaux pratiques
Gérer une table produit, un formulaire de login en Ajax. Remplir dynamiquement un menu déroulant.
- Threads. Usage d'iFrame pour les appels client/serveur.
- Traitements asynchrones, synchrones.
- Problématiques de sécurité et performance : cryptage, compression, débogage, offuscation.
- Mise en place de proxy crossDomain.
Travaux pratiques
Mise en oeuvre de requêtes asynchrones et multithreads. Développement Ajax en jQuery.
page 53
8) Compléments
- Framework Ajax, Java, .NET. Ajax et XUL.
- Présentation de la programmation Ajax avec HTML5.
- Ajax et les API Google : Google Search et Google Maps.
Travaux pratiques
Développer en Javascript un exemple de cartographie. Développement Ajax sous HTML5.
page 54
Réf : FUJ
Participants
projets.
Pré-requis
Bonnes connaissances des
fondamentaux du langage
JavaScript (notamment de
la notion de callback) ainsi
que des notions affirmées de
HTML et CSS.
Développer des applications Web Full JavaScript
Best
Cette formation vous apprendra à développer des applications Web multipages ou monopages en JavaScript.
Les frameworks utilisés seront AngularJS pour la partie client et Node.js pour la partie serveur. Les bases de
données NoSQL seront évoquées au travers de MongoDB ainsi que d'autres frameworks utiles.
Développer une application Web multipages ou monopages (SIA/SPA)
Développer le front-end d'une application avec AngularJS
Mettre en oeuvre des traitements JavaScript côté serveur via Node.JS
Ajouter une couche de persistance de données via une approche NoSQL
Prix 2017 : 2150€ HT
Dates des sessions
Paris
22 nov. 2016, 20 déc. 2016
14 fév. 2017, 4 avr. 2017
20 juin 2017, 22 aoû. 2017
Aix
20 déc. 2016
Bordeaux
13 déc. 2016
Bruxelles
13 déc. 2016, 11 avr. 2017
27 juin 2017
1) Rappels de fondamentaux
2) Introduction à Node.js
3) La persistance via une approche NoSQL
4) Initiation à Grunt, Bower et Bootstrap
5) Introduction à ExpressJS
6) Mise en oeuvre d'AngularJS
7) L'approche MEAN
Mise en pratique rapide des concepts, utilisation d'une application fil rouge, exercices.
Exercice
Une application fil rouge sera construite, en l'enrichissant progressivement des concepts abordés.
1) Rappels de fondamentaux
Geneve
13 déc. 2016, 11 avr. 2017
27 juin 2017
Grenoble
20 déc. 2016
Lille
20 déc. 2016
Luxembourg
13 déc. 2016, 11 avr. 2017
27 juin 2017
Lyon
20 déc. 2016
Montpellier
13 déc. 2016
Nantes
13 déc. 2016
Rennes
13 déc. 2016
Sophia-antipolis
11 oct. 2016, 20 déc. 2016
Strasbourg
20 déc. 2016
Toulouse
13 déc. 2016
- Concepts généraux JavaScript et JSON.
- La programmation événementielle en JavaScript.
- La manipulation du Document Object Model (DOM).
Travaux pratiques
Tests de primitives et de concepts avec JSFiddle.
2) Introduction à Node.js
- Pourquoi utiliser du JavaScript côté serveur ?
- Le packetmanager de node : NPM.
- Programmation asynchrone.
- Utiliser la programmation événementielle.
- Tour d'horizon de l'API Node.js.
Travaux pratiques
Mise en place du squelette d'application, principaux traitements côté serveur.
3) La persistance via une approche NoSQL
- Les concepts fondamentaux du NoSQL.
- Introduction à MongoDB.
- Des documents plutôt que des tables.
- Utilisation du MongoShell.
- Construire des opérations de CRUD (Create...).
- Recherche multicritère d'objets.
- Mise en oeuvre dans Node.js.
Travaux pratiques
Ajout d'une couche de persistance complète à l'application exemple.
4) Initiation à Grunt, Bower et Bootstrap
- L'automatisation de processus complexes avec Grunt.
- Gestion de dépendances dans le front-end via Bower.
- Initiation au framework Twitter Bootstrap.
5) Introduction à ExpressJS
- Les concepts fondamentaux d'Express.
- Construction d'un squelette d'application.
- Configuration d'Express et de l'application.
- Le rendu de vues avec EJS.
- La gestion de formulaires et des uploads de fichiers.
- Le routage d'URL par Express.
page 55
- Mise en place d'une API REST.
- La gestion des erreurs.
Travaux pratiques
Mise en place d'une approche SIA/SPA dans notre application.
6) Mise en oeuvre d'AngularJS
- Le databinding bidirectionnel. Le modèle MVVM.
- Vue d'ensemble des directives.
- Vues et templates. Modèles et contrôleurs.
- Gestion du scope.
- La gestion du routage.
Travaux pratiques
Ajout d'Angular sur le frontend.
7) L'approche MEAN
- Les concepts fondamentaux qui mènent à MEAN.
- Structure d'un projet MEAN. Les packages.
- L'injection de dépendances.
- Intégration avec AngularJS.
- La gestion des assets et l'agrégation.
- La gestion des routes.
Travaux pratiques
Refactoring de l'application construite afin de suivre l'approche MEAN.
page 56
Réf : JVS
Participants
Cette formation s'adresse
à tout développeur, chef de
projet ou intégrateur Web
souhaitant optimiser les
temps de développement
par la maîtrise des utilitaires
modernes.
Pré-requis
HTML et des technologies
du Web. Connaissance du
langage de programmation
JavaScript.
Prix 2017 : 1910€ HT
Dates des sessions
Industrialisation Front-End, maîtriser vos pratiques de
développement
Best
Depuis quelque temps, le langage JavaScript, en plein essor, a modifié l'environnement du développeur
Front-End. Ce stage vous présentera les outils modernes qui vous permettront de créer un Workflow efficace,
automatiser les tâches redondantes et produire des applications modulaires.
Maîtriser les "SuperSet" HTML CSS JavaScript
Automatiser les tâches de développement
Organiser son workflow
Intégrer efficacement les contributions
1) Composants d'une application Web
2) Choisir l'environnement de développement
3) "Versionner" avec GIT
4) Node.js comme utilitaire de développement
5) Automatisation des tâches avec Gulp
6) Intégration des tests automatisés
7) Créer un template de projet
Paris
7 nov. 2016, 27 fév. 2017
15 mai 2017
Développement, présentation et mise en oeuvre d'applications existantes.
Travaux pratiques
Vous configurerez pour chaque étape de vos développements les outils d'optimisation afin de pouvoir au final
générer vos profils de projets.
- Structurer un projet d'application Web.
- HTML5, les frameworks (bootstrap, foundation...).
- CSS3, automatisation avec LESS ou SASS.
- JavaScript, normaliser le code en modules (API CommonJS et AMD).
- "SuperSet JavaScript" : simplifier le développement avec TypeScript.
- Organiser le développement JavaScript.
- Optimiser l'empreinte des ressources.
Travaux pratiques
Migrer une application Web en utilisant le développement modulaire JavaScript. Développer un Framework
CSS avec SASS.
- Offre du marché (SublimeText, Eclipse...).
- Choisir et configuer son IDE (extensions...).
- Quelles fonctionnalités attendre, "live Template", "code snippet".
- Les solutions pour développer en ligne (Cloud 9...).
- Les environnements pré-intégrés (PrePros).
Travaux pratiques
Découverte des différentes plates-formes. Personnaliser l'IDE SublimeText.
- Gestion de source : centralisée vs distribuée.
- Concepts de base, initialiser un repository.
- Organiser les branches de développement.
Travaux pratiques
Mise en place d'un processus de développement en branches.
- Présentation de Node.js. Le Node Package Manager
- Les modules indispensables pour le développeur.
- Npm et Bower, objectifs et confusion.
- Gestion des dépendances. Créer un package npm.
Travaux pratiques
Créer un module pour configurer les dépendances du projet.
page 57
- Présentation : automatisation des tâches.
- Définition des types de tâches : créer une commande.
- Structure d'un fichier gulptfile.js.
- Les contributions indispensables.
- Créer un "Build" efficace avec Gulp.
Travaux pratiques
Configurer et utiliser Gulp.
- Utilitaires de test : Jasmine, Mocha...
- Recommandation pour l'écriture des tests unitaires.
- Karma : présentation et configuration.
- Générer les rapports de test et de couverture du code.
- End to End Testing : interface utilisateur.
Travaux pratiques
Tests unitaires avec Jasmine. Automatisation avec Karma et Istanbul.
- Présentation, avantage et inconvénient du scaffolding.
- Quels utilitaires : Yeoman, Lineman ?
- Les générateurs de Yo. Création de générateur.
page 58
Réf : AGU
Participants
Architectes, développeurs et
chefs de projets Web.
Pré-requis
des technologies du Web
et des outils modernes de
développement Front-End.
Connaissances de JavaScript.
Prix 2017 : 2380€ HT
Dates des sessions
Paris
6 déc. 2016, 14 mar. 2017
6 juin 2017
AngularJS 2, maîtriser le Framework Front-End de Google
migration et développement
New
AngularJS, devenu la référence des infrastructures JavaScript côté client, propose une refonte du cœur du
Framework en s'appuyant sur les nouveaux standards du Web. Cette formation vous permettra d'en maîtriser
les concepts et d'améliorer les performances de vos applications notamment mobiles.
Organiser, modulariser et tester ses développements JavaScript
Maîtriser les fondamentaux du Framework AngularJS 2
Créer rapidement des applications Web complexes
Savoir intégrer les tests unitaires au développement
Connaître les bonnes pratiques de développement et de mise en production
1) Développement JavaScript : rappels
2) Migrer d'AngularJS 1.x à AngularJS 2
3) Injection de dépendances
4) Définition de composants
5) Gestion des formulaires, "Routing" et requête
HTTP
6) Tests unitaires. Bonnes pratiques et outils
Chaque nouveau concept théorique sera appliqué immédiatement de façon pratique.
Travaux pratiques
Composition modulaire d'une application avec AngularJS 2
1) Développement JavaScript : rappels
- Bonnes pratiques ECMAScript 5.
- ES6/ES2015, présentation générale.
- Nouveautés syntaxiques : portée, "template string", "arrow functions"...
- Outils indispensables. Babel, Traceur et Typescript.
- Typescript en détail, configuration.
- ES6 approche modulaire.
- "Modules Loaders" : SystemJS, "import/export".
Travaux pratiques
Migrer un script ES5/ES6. Mise en œuvre de l'environnement avec TypeScript.
2) Migrer d'AngularJS 1.x à AngularJS 2
- Comparaison et "topographie" des concepts.
- Préparer la migration. Structure d'une application AngularJS 2.
- Les modules AngularJS 2, "core" et principaux modules.
- Classification des directives : Composant, Attribut, Structure.
- Les décorateurs : définition des hiérarchies.
Travaux pratiques
Migrer une application AngularJS 1.x vers AngularJS 2.
3) Injection de dépendances
- Utiliser les annotations et décorateurs.
- Configuration de l'injecteur.
- Gestion des modules : bonnes pratiques.
- Création de services injectables. Classification des services.
- "BootStrap" d'application.
Travaux pratiques
Structurer, "scaffolder" un projet d'application.
4) Définition de composants
- Cycle de vie dans l'application.
- Syntaxe des templates : interpolation/expression, "Binding" et filtres.
- Directives de transformation : ngIf, ngFor, ngSwitch...
- Définition syntaxique, le symbole (*). Variables locales.
- Classe de composants. Directives de configuration : selector, provider.
- Evènements utilisateur.
page 59
Travaux pratiques
Création de composants.
5) Gestion des formulaires, "Routing" et requête HTTP
- Control et ControlGroup.
- Validation et gestion d'erreur personnalisée.
- "FormBuilder", composants avancés de formulaire.
- Liaison de données via HTTP.
- Création de routes. Paramètrage et wildcard.
- Ciblage, "router-outlet" événements de routage.
Travaux pratiques
Formulaire validation. Consommation d'une API REST.
6) Tests unitaires. Bonnes pratiques et outils
- Configurer l'environnement de test.
- Ecrire les tests avec Jasmine. Couverture.
- Cas de test : pipe, composant, application.
- ngUpgrade : coexistence et ngForward.
- AngularJS2 "Coding guide Style".
Travaux pratiques
Rédaction de tests unitaires. Mise en œuvre TDD.
page 60
Réf : FAN
Participants
Pré-requis
JavaScript.
Prix 2017 : 1960€ HT
Dates des sessions
Paris
10 oct. 2016, 14 nov. 2016
12 déc. 2016, 23 jan. 2017
20 fév. 2017, 20 mar. 2017
18 avr. 2017, 15 mai 2017
26 juin 2017, 17 juil. 2017
21 aoû. 2017
Aix
28 nov. 2016, 19 déc. 2016
27 fév. 2017, 24 avr. 2017
26 juin 2017
Best
Développé par Google, AngularJS est un framework structurant et simplifiant le développement des
applications riches côté client. Cette formation vous apportera la maîtrise des fonctionnalités clés du
framework : filtres, contrôleurs, templates... Vous verrez également son intégration dans une architecture
REST.
Maîtriser les fonctionnalités clés du Framework (filtres, contrôleurs, routes, templates...)
Intégrer AngularJS dans une architecture orientée REST
Intégrer des tests automatisés
1) Rappels JavaScript
2) Présentation du framework AngularJS
3) Contrôleurs et gestion des scopes
4) Module et injection de dépendance
5) Définition des routes
6) Fonctionnalité de données, Echange Serveur
8) Bonnes pratiques et outils
Développement, présentation d'applications existantes.
Travaux pratiques
Angers
Vous transformerez une maquette HTML en "Single Page Application" utilisant les fonctionnalités du
framework AngularJS.
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Bordeaux
14 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Bruxelles
21 nov. 2016, 10 avr. 2017
12 juin 2017
Dijon
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Geneve
21 nov. 2016, 10 avr. 2017
12 juin 2017
Grenoble
21 nov. 2016, 19 déc. 2016
20 fév. 2017, 18 avr. 2017
19 juin 2017, 28 aoû. 2017
Lille
21 nov. 2016, 19 déc. 2016
27 fév. 2017, 24 avr. 2017
26 juin 2017
Luxembourg
21 nov. 2016, 10 avr. 2017
12 juin 2017
Lyon
21 nov. 2016, 19 déc. 2016
20 fév. 2017, 18 avr. 2017
19 juin 2017, 28 aoû. 2017
Montpellier
14 nov. 2016, 27 fév. 2017
24 avr. 2017, 26 juin 2017
Nancy
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
- Composants d'une application Web. HTML5 et CSS3.
- Outils de développement Web/JavaScript.
- Moteurs de rendu HTML et JavaScript. DOM, BOM.
- JavaScript rappels : prototypes, closures et callbacks.
- Rappels sur les concepts objet en JavaScript.
- Application Ajax orientée REST.
Exercice
Configuration de l'environnement.
- AngularJS, positionnement : jQuery, ExtJS...
- Intégration. Compatibilité, versions, documentation.
Exercice
Préparation d'une maquette HTML pour développer avec AngularJS.
- Création et utilisation des contrôleurs.
- Gestion du contexte, la variable $scope.
- Traitement et validation des formulaires.
Exercice
Intégration des contrôleurs.
- Fonctionnalités de l'objet angular.
- Découper son application.
Nantes
Exercice
Modularisation de l'application.
14 nov. 2016, 27 fév. 2017
24 avr. 2017, 26 juin 2017
page 61
Orleans
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Rennes
14 nov. 2016, 27 fév. 2017
24 avr. 2017, 26 juin 2017
Rouen
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Sophia-antipolis
21 nov. 2016, 19 déc. 2016
27 fév. 2017, 24 avr. 2017
26 juin 2017
- Routing. API ($routeProvider). Le "deep linking".
- Historique et accès aux paramètres de l'URL.
- Utilisation de $location et $routeParams. Modes Hashbang et HTML5.
- Prétraitement des vues. Utilisation des "fragments".
Exercice
Création d'une "Single Page Application".
- API ($provide, $injector). Création de provider.
- Les méthodes : Service, Factory, Provider, Value.
- Requête Ajax avec le service $http. Intégration REST avec le service $resource. WebSockets. API Promise.
- Intégration avec Node.js.
Exercice
Intégration REST avec Node.js.
Strasbourg
21 nov. 2016, 19 déc. 2016
27 fév. 2017, 24 avr. 2017
26 juin 2017
Toulouse
14 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Exercice
Création des tests unitaires.
Tours
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
- Yeoman, optimisation du développement.
- Internationalisation (I18N), mise en oeuvre.
Démonstration
Mise en oeuvre.
page 62
Réf : GUL
Participants
Architectes et développeurs.
Pré-requis
Connaissances pratiques
du framework AngularJS
et des outils modernes
du développement FrontEnd (Bower, Grunt,
Framework CSS...). Bonnes
connaissances JavaScript et
des Patterns Objets.
AngularJS, développement avancé
de la conception à l'analyse des performances
Cette formation vous permettra d'approfondir votre connaissance des mécanismes internes d'AngularJS.
Vous apprendrez à organiser vos développements depuis les tests jusqu'à l'optimisation des applications
tout en mettant en œuvre de bonnes pratiques. Vous développerez également des composants métiers
personnalisés.
Appréhender AngularJS en profondeur
Devancer les besoins conceptuels
Savoir développer et gérer des composants métiers
Optimiser une application AngularJS
Prix 2017 : 1440€ HT
Dates des sessions
Paris
6 oct. 2016, 15 déc. 2016
9 mar. 2017, 1 juin 2017
1) "Best Pratices" et rappels
2) Maîtriser les directives et la "compilation"
AngularJS
3) Utiliser et écrire des composants avancés.
4) AngularJS : optimisation des développements
Travaux pratiques
Vous mettrez en œuvre des concepts avancés. Vous développerez des composants distribuables et
analyserez les performances l'application finale.
1) "Best Pratices" et rappels
- Ecosystème Front-End autour d'AngularJS. Rappels des composants essentiels.
- AnuglarsJS Coding Style Guide. Quels plugins pour votre IDE ?
- Mise en œuvre du workflow AngularJs avec nodejs, Yo, Grunt.
- Bonnes pratiques. Production : RequireJS, Browserify ou concaténation. (ngAnnotate).
- "Test Driven Development" avec Jasmine et Karma.
- Services natifs : interception et décoration.
Travaux pratiques
Intégration d'une structure d'application, rédiger des services en conformité avec les tests.
2) Maîtriser les directives et la "compilation" AngularJS
- Le "Dirty Checking" AngularJS détection des changements : $watch.
- $digest, $compile, comprendre le cycle de digestion.
- Expressions AngularJS : $eval et $parse.
- Options avancées : require, controllerAs, bindToController, terminal.
- Ensembles de directives inter-dépendantes.
- Gérer le cache des templates : $templateCache.
Travaux pratiques
Organiser vos directives en ensembles de composants réutilisables et distribuables.
3) Utiliser et écrire des composants avancés.
- De la directive au composant distribuable.
- AngularUI. Principaux modules complémentaires.
- UI-Utils, les outils indispensables. Intégrer ngTranslate. UI-Bootstrap.
- UI-Router, gestion de routes avancées.
- Famille de composants métiers personnalisés.
Travaux pratiques
Développer des composants dépendants de services asynchrones.
4) AngularJS : optimisation des développements
- Nomenclature et évaluation du code. Minification et gestion des scripts.
- Astuces programmatiques. Utilisation de $log et $exceptionHandler.
- Performances : bindOnce, préfixe "::", $scope.$apply versus to $scope.$digest.
- Guide des bonnes pratiques. Configuration dynamique des routes.
- Chargement des contrôleurs et modules à l'exécution : "On Demand".
- Déboguer une application AngularJS.
Démonstration
Analyser et améliorer les performances de votre application AngularJS.
page 63
Réf : ERY
Participants
Développeurs Web.
Pré-requis
langage JavaScript et des
technologies Web. Bonnes
connaissances du langage
HTML.
Prix 2017 : 2610€ HT
Dates des sessions
Paris
10 oct. 2016, 14 nov. 2016
12 déc. 2016, 20 fév. 2017
10 avr. 2017, 12 juin 2017
21 aoû. 2017
jQuery, développer des applications Web interactives
Best
Développer des applications Web en utilisant Javascript nécessite souvent d'adapter le code au navigateur.
Le framework jQuery est une solution très répandue pour répondre à ce genre de problématique. Ce cours
vous apprendra la façon de le mettre en oeuvre et d'améliorer l'ergonomie et l'interactivité de vos sites.
Développer des applications Web interactives "cross-browser"
Maîtriser les sélecteurs et les méthodes jQuery d'accès aux éléments d'une page Web
Gérer des évènements d'interaction avec l'utilisateur
Intégrer des effets visuels et des animations au sein de pages Web
Interagir avec un serveur en Ajax
1) Présentation de jQuery
2) Méthodes utilitaires de jQuery
3) Les sélecteurs
4) Accès à l'arbre DOM
5) La gestion des événements
6) Ajax et jQuery
7) Effets visuels et interface riche avec jQuery
Aix
5 déc. 2016, 30 jan. 2017
29 mai 2017
Travaux pratiques
Mise en place d'applications Web utilisant jQuery.
Bordeaux
5 déc. 2016, 13 fév. 2017
12 juin 2017
Bruxelles
14 nov. 2016, 10 avr. 2017
12 juin 2017
Geneve
14 nov. 2016, 10 avr. 2017
12 juin 2017
Grenoble
5 déc. 2016, 13 fév. 2017
12 juin 2017
Lille
5 déc. 2016, 30 jan. 2017
29 mai 2017
Luxembourg
14 nov. 2016, 10 avr. 2017
12 juin 2017
Lyon
5 déc. 2016, 13 fév. 2017
12 juin 2017
Montpellier
1) Présentation de jQuery
- Qu'est-ce que jQuery ? Pourquoi jQuery ?
- L'apport par rapport à Javascript simple.
- Les éléments jQuery. jQuery UI. L'objet jQuery.
Travaux pratiques
Installation de jQuery. Mise en place d'une première page Web utilisant jQuery.
2) Méthodes utilitaires de jQuery
- Rappel sur les objets en Javascript.
- La manipulation d'objets avec jQuery.
- Les méthodes de traitement d'objets de jQuery.
- Les méthodes de traitement de tableaux en jQuery.
- Les chaînes de caractères et Javascript.
- Les méthodes de traitement de chaînes de jQuery.
Travaux pratiques
Mise en place d'applications Web avec différents types d'éléments en utilisant jQuery.
3) Les sélecteurs
Nantes
- Présentation des sélecteurs jQuery.
- Rôle des sélecteurs. Les différents types de sélecteurs.
- Les pseudo-classes. Les combinateurs.
5 déc. 2016, 30 jan. 2017
29 mai 2017
Travaux pratiques
Mise en place d'applications Web utilisant des sélecteurs.
5 déc. 2016, 30 jan. 2017
29 mai 2017
Rennes
5 déc. 2016, 30 jan. 2017
29 mai 2017
Sophia-antipolis
5 déc. 2016, 30 jan. 2017
29 mai 2017
Strasbourg
5 déc. 2016, 30 jan. 2017
29 mai 2017
4) Accès à l'arbre DOM
- Rappel sur DOM (Document Object Model).
- Accès direct aux éléments d'une page.
- Manipulation de DOM avec jQuery.
- Gestion des classes CSS (addClass(), removeClass() ...
- Insertion d'éléments dans l'arbre DOM.
Toulouse
Travaux pratiques
Manipulation de l'arbre DOM.
5 déc. 2016, 13 fév. 2017
12 juin 2017
5) La gestion des événements
- La notion d'événements en Javascript.
- Gestion des événements avec la méthode bind.
- Transmission de paramètre avec la méthode bind.
6) Ajax et jQuery
- Requêtage d'un serveur avec jQuery.
page 64
- Requêtes Ajax en utilisant $.ajax().
- Traitement de la réponse du serveur.
- Transmission de paramètres au serveur.
Travaux pratiques
Utilisation d'Ajax avec jQuery.
7) Effets visuels et interface riche avec jQuery
- Les effets visuels standard de jQuery. Créer ses propres effets visuels. Utilisation d'animate().
- Paramétrage d'effet avec easing. Gestion de la file d'attente des effets visuels.
- Présentation et installation de jQuery UI. Utilisation de composants évolués.
- Onglets (tabs(), accordéon (accordion()), boîte de dialogue (dialog()), barres de progression (progressbar()).
- Le glissé/déposé. Sélection multiple. Permutations d'éléments dans une page. Redimensionnement
d'élément.
Travaux pratiques
Mise en place d'effets visuels.
page 65
Réf : NJS
Participants
Développeurs, architectes
techniques et chefs de projet
Web.
Pré-requis
langage Javascript. Une
première approche d'un
framework JavaScript (côté
client) serait un plus.
Prix 2017 : 2440€ HT
Dates des sessions
Node.js, programmation JavaScript côté serveur
Cette formation vous apprendra à développer des applications réactives et performantes avec Node.js.
Vous mettrez en œuvre les concepts de programmation événementielle et asynchrone, de modularité et de
routage. Vous utiliserez également les API de Node.js et assurerez la persistance de vos données dans une
base NoSQL.
Installer et configurer un serveur Node.js
Mettre en œuvre les concepts de la programmation événementielle et asynchrone
Mettre en place un Framework Web
Manipuler l'API de Node.js
Gérer la persistance dans une base de données NoSQL avec un ODM
1) Du JavaScript côté serveur
2) Premiers pas en Node.js
3) Les fondamentaux Node.js
4) La gestion de routes
5) Framework Web
6) Persistance des données
7) Test d'une application Node.js
8) Concept avancés
Paris
22 nov. 2016, 14 mar. 2017
30 mai 2017
Aix
Etude de cas
Construction d'une application SPA (Single Page Application) en abordant les thématiques de la
programmation asynchrone, l'injection...
4 oct. 2016
1) Du JavaScript côté serveur
- Genèse du JavaScript côté serveur et de Node.js.
- Le moteur Google V8 utilisé côté serveur.
- Pourquoi utiliser la programmation événementielle ?
- Rappels JavaScript : callbacks, closures, notion de scope, apply, bind, call.
- Initiation à ECMAScript 6.
2) Premiers pas en Node.js
- Installation du serveur Node.js.
- Le gestionnaire d'extensions NPM.
- L'approche modulaire de Node.js
- Un serveur Web en quelques lignes.
- Utilisation de Node.js en REPL.
Travaux pratiques
Usage de l'utilitaire NPM. Développer une première application.
3) Les fondamentaux Node.js
- Quel intérêt de développer en asynchrone ?
- La gestion événementielle : réagir plutôt qu'attendre.
- Principaux modules de l'API : console, util, file, events & timer...
- Gestion des requêtes/réponses HTTP. HTTPS.
- Création de processus fils, https, sockets TCP et UDP...
Travaux pratiques
Lecture de fichier, lecture d'une ressource en ligne (météo sur Yahoo! Weather) et de la création d'un
processus fils avec communication IPC.
4) La gestion de routes
- Parsing d'URL (paramètres, requête...).
- Traiter une requête en mode asynchrone.
- Mettre en place un gestionnaire de routes.
Travaux pratiques
Mise en place d'un gestionnaire de routes.
5) Framework Web
- Les concepts fondamentaux d'Express.
- Construction d'un squelette d'application.
- Configuration d'Express et de l'application.
- Le rendu de vues avec EJS.
- La gestion de formulaires et des uploads de fichiers.
- Le routage d'URL par Express.
- Mise en place d'une API REST.
page 66
Travaux pratiques
Mise en place d'une API REST complète.
6) Persistance des données
- Initiation à une base NoSQL : MongoDB.
- Mise en place de CRUD (Create, Read, Update, Delete).
- Utilisation d'un ODM : Mongoose.
Travaux pratiques
Gestion d'une persistance au travers d'un ODM avec création des modèles.
7) Test d'une application Node.js
- Premiers pas avec Mocha.
- Les assertions et le test synchrone et asynchrone.
- Différentes méthodes de tests (inclusifs, exclusifs...).
- Le support du navigateur.
Travaux pratiques
Tester une application avec Mocha.
8) Concept avancés
- Bonnes pratiques de développement en Node.js (structuration, exploitation...).
- La bibliothèque async : rendre l'asynchrone séquentiel.
- Le clustering avec Node.js.
- La retro-compatibilité, les transpilers...
page 67
Réf : NCH
Participants
Développeurs Web,
informaticiens.
Pré-requis
du langage JavaScript et
des technologies Web.
Bonnes connaissances de la
programmation orientée objet.
Prix 2017 : 1960€ HT
Sencha Ext-JS 6, développer des applications
multiplateformes en JavaScript
Vous apprendrez dans ce cours à concevoir des applications Web interactives et multiplateformes avec la
bibliothèque Ext JS 6. Vous appréhenderez notamment les nouvelles fonctionnalités de cette version au
travers du data-binding, du routage d'URL et de la configuration avancée des aspects "responsive design".
Installer Ext JS et son environnement
Créer des applications MVVM multi-cibles (tablettes, Smartphone, desktop)
Créer et mettre en œuvre des composants graphiques
Gérer des données
Elaborer des thèmes
Dates des sessions
Paris
12 déc. 2016, 20 mar. 2017
22 mai 2017
1) Présentation du framework
2) Concepts fondamentaux
3) Composants de base
4) Architecture d'une application
5) Gestion des données
6) Composants graphiques orientés données
7) Concepts avancés
- Environnement : éditeur, Sencha Cmd...
- Exécuter et déboguer une application.
- Architecture Ext-JS 6, pourquoi MVVM plutôt que MVC.
Travaux pratiques
Installation d'Ext-JS. Création d'un espace de travail. Déboguer une application Ext-JS.
- Structure d'une application.
- Instanciation d'un objet : procédurale vs déclarative, Ext.create(), alias et new. La gestion du DOM.
- Définir une classe : Ext.define(), constructor et config.
- Hériter une classe : extend, overrides et mixins.
- Chargement dynamique des classes.
Travaux pratiques
Créer une application avec Sencha Cmd. Créer des composants personnalisés.
3) Composants de base
- Composants, Conteneurs et Evénements.
- Les objets «Panels», «Toolbar» et «Buttons».
- Les "Layouts". Les objets "Windows" (classic) et "NavigationView" (modern).
- Le nouvel objet « Menu » (modern).
Travaux pratiques
Agencer les composants de l'application. Créer des boutons et des fenêtres.
4) Architecture d'une application
- Le modèle MVVM. Concepts du pattern V VC VM
- Les dépendances : requires, views, models et stores.
- Envoi d'événements. Modulariser les classes.
- Partage de ressource entre Classic et Modern.
Travaux pratiques
Utilisation d'un pattern MVVM et du databinding.
- L'ensemble des données : Models, Proxies, Stores.
- Envoi et réception de données (HTTP, Ajax/JsonP).
- Appel direct vs Model et Store. L'objet "Forms".
Travaux pratiques
Créer, valider et associer les données.
- Templating et Vue. Les graphiques.
- Les grilles : Stores, Columns, Features...
- Les arbres : nœud racine/enfants, TreeStore...
page 68
- Les formulaires : soumission, champs, validation...
- Les « List »,« NestedList » et « Grid » en Modern.
Travaux pratiques
Utilisation de templates. Mise en place de grilles, d'arbres, de formulaires...
- Routages des URL de l'application.
- Responsive Design.
- Build de l'application avec Sencha Cmd.
- Internationalisation. Amélioration des performances.
- Theming avec Sass et Sencha Fashion.
- Outils optionnels : PivotGrid, Inspector, Test...
- Compatibilité mobile avec les applications universelles.
Travaux pratiques
Associer une URL à un écran. Rendre une application responsive. Mettre à jour le thème à l'exécution.
page 69
Réf : BOO
Participants
Webmasters, développeurs et
intégrateurs.
Pré-requis
Connaître HTML et CSS
et avoir des notions de
JavaScript.
Prix 2017 : 1440€ HT
Dates des sessions
BootStrap, développer des pages Web Responsive
Le framework Bootstrap, créé par les développeurs de Twitter, est devenu un framework CSS de référence
dans la conception de sites Web. Vous apprendrez dans ce stage à habiller vos pages et à les enrichir de
composants interactifs avec Bootstrap afin de rendre vos sites attractifs et adaptatifs.
Intégrer Bootstrap dans un projet Web
Réaliser des pages Web reprenant les codes esthétiques des sites actuels
Maîtriser les composants et les plug-ins du framework Bootstrap
Développer des sites Web responsive
2) Les feuilles de style de Bootstrap
3) Les grilles
Paris
17 nov. 2016, 16 fév. 2017
13 avr. 2017, 15 juin 2017
50% d'exposé, 50% de pratique.
Bruxelles
13 oct. 2016
4) Les composants de base
5) Les plug-ins jQuery de Bootstrap
6) Analyse des modèles Bootstrap
Travaux pratiques
Réalisation d'une interface administrateur back-office avec Bootstrap. Création d'un site Web Responsive
depuis un modèle Bootstrap.
- Vue d'ensemble du framework Bootstrap.
- L'apport de BootStrap par rapport à CSS.
- Les éléments du kit Bootstrap (grilles, Normalize.css, icônes, plug-ins jQuery...).
- Comprendre l'arborescence des différents fichiers : feuilles de style, JavaScript...
- Lier une page Web à la feuille de style de base de Bootstrap.
Travaux pratiques
Installation de Bootstrap. Habiller une page HTML avec Bootstrap.
2) Les feuilles de style de Bootstrap
- Les CSS pour les éléments textuels et les images.
- Les CSS pour les éléments de formulaires et les tableaux.
- Utilisation des polices icones pour afficher des icônes sur les pages.
- Les CSS pour la mise en page, les blocs de texte.
- Personnaliser sa feuille de style.
Travaux pratiques
Styler les différents éléments constituant une page Web avec les CSS de Bootstrap. Personnaliser le style de
certains éléments de la page.
3) Les grilles
- Comprendre le concept de grille.
- Les grilles adaptatives (le Responsive Web Design, Media Queries, positionnement...).
- Organisation de la grille. Manipuler les grilles.
- Créer une page multigrille.
- Les grilles statiques et élastiques.
Travaux pratiques
Créer une page Web responsive basée sur une grille.
4) Les composants de base
- Les menus déroulants.
- Les composants de navigation et de pagination.
- Les boutons, les badges, les alertes.
- Les barres de progression.
- Les tableaux, les listes d'éléments.
Travaux pratiques
Conception d'une page Web pour un site internet ou intranet intégrant plusieurs composants Bootstrap.
5) Les plug-ins jQuery de Bootstrap
- Les fenêtres modales. Les accordéons. Le carrousel de photos.
- La barre de navigation. Les onglets. Les menus déroulants.
page 70
- Les champs d'auto-complétion.
- Intégration de plug-ins externes (Datepicker...).
- Les cards conteneurs flexibles et extensibles.
Travaux pratiques
Intégrer des effets visuels modernes par le biais de plug-ins jQuery associés à la librairie Bootstrap.
6) Analyse des modèles Bootstrap
- Analyser des modèles construits à partir de Bootstraps.
- Créer un site avec un des modèles.
- Créer une page à partir d'un modèle en surchargeant le fichier CSS.
- Utiliser des fichiers LESS avec un préprocesseur et un serveur Nodejs.
Travaux pratiques
Créer un site depuis un modèle.
page 71
Réf : SSC
Participants
Intégrateurs et développeurs
Front-End.
Pré-requis
Bonnes connaissances de
CSS. Connaissances de base
en HTML.
Prix 2017 : 1440€ HT
Dates des sessions
Paris
15 déc. 2016, 6 avr. 2017
15 juin 2017
Sass, Compass et Less, simplifier la création et la
maintenance de vos CSS
Alors que le développement web est aujourd'hui une véritable industrie, l'intégration HTML/CSS souffre
encore de freins techniques limitant la réutilisation du code et sa maintenance. Découvrez comment
les préprocesseurs CSS Sass et Less aident à gagner en productivité et à rationaliser cette étape du
développement.
Comprendre les enjeux actuels liés à l'intégration CSS
Savoir identifier le préprocesseur adapté à ses besoins
Maîtriser les outils Sass, Compass et Less pour gagner en productivité et en maintenabilité
Appliquer les bonnes pratiques dans l'organisation de ses projets et dans la rédaction de feuilles de style
Profiter des apports de ces outils pour exploiter pleinement les fonctionnalités CSS3
1) Pourquoi les préprocesseurs CSS ?
2) Sass, les bases
3) Sass, utilisation avancée
4) L'extension Compass
5) Less
6) Bonnes pratiques et techniques avancées
1) Pourquoi les préprocesseurs CSS ?
- Rappels de syntaxe CSS.
- Les difficultés du métier d'intégrateur web.
- Les préprocesseurs : à quoi ça sert ?
- L'approche DRY.
- Les principaux préprocesseurs.
2) Sass, les bases
- Présentation et objectifs.
- Mise en place de l'environnement de développement.
- Les différentes syntaxes : Sass vs Scss.
- L'imbrication, les variables et les sélecteurs.
- Les conditions, boucles et fonctions mathématiques.
Travaux pratiques
Installer Sass. Créer une page à l'aide de Sass. Convertir une page CSS vers Sass.
3) Sass, utilisation avancée
- Les mixins et l'héritage @extend.
- Organisation d'un projet : partials et import.
- Intégrer des media queries dans Sass.
- Les fonctions de couleur.
- Générer des thèmes graphiques.
- Configuration avancée : livereload, compression et configuration du format de sortie.
- Déboguer les CSS générées.
Travaux pratiques
Structurer un projet complexe et mettre en place un mécanisme de thème sur un site.
4) L'extension Compass
- Présentation et apports de Compass.
- Installation et configuration.
- Les mixins CSS3 : animation, border-radius, shadow...
- Les sprites CSS : de la théorie à la pratique.
- Utilisation des fonts CSS : @font-face, icon-font.
- Les grilles CSS et les helpers de layout.
- Les principaux plug-ins et outils associés.
Travaux pratiques
Intégration avancée : CSS3, layout helpers, Sprites & Grid CSS.
5) Less
- Installation et configuration.
- Le langage et la syntaxe de base.
- Les variables et opérations.
- Les règles imbriquées, mixins et fonctions natives.
- Outils complémentaires.
- Comparaison avec Sass & Compass.
page 72
Travaux pratiques
Installation et configuration de Less. Portage d'un projet Sass en Less.
6) Bonnes pratiques et techniques avancées
- Idées reçues sur les bonnes pratiques d'intégration.
- Les pièges à éviter (inception, portée des variables...).
- Conventions de codes et CSS modulaires : les guides SMACSS, BEM...
- CSS hautes performances et postprocesseurs.
- Workflow et travail en équipe.
- Optimisations.
Travaux pratiques
Application de la méthodologie SMACCS. Optimiser le code et le temps de chargement/rendu.
page 73
Réf : TJS
Participants
Développeurs JavaScript,
architectes et chefs de projets
web.
ReactJS, maîtriser le Framework JavaScript de Facebook
Prenant à contrepied les modèles traditionnels, le Framework maintenu par Facebook favorise la simplicité et
la performance des composants de RIA. Vous apprendrez dans ce cours à développer des applications avec
ReactJS, JSX et Flux et découvrirez le principe et les bénéfices du développement isomorphique.
Pré-requis
Bonne connaissance de
JavaScript, pratique du
développement web.
Développer avec ReactJS
Concevoir une SPA avec ReactJS et Flux
Comprendre le subset JavaScript JSX
Optimiser les performances des RIA
Prix 2017 : 1960€ HT
Dates des sessions
Paris
1) Rappels des composants des RIA
2) Développer avec ReactJS
3) Interactivité des composants
19 déc. 2016, 13 mar. 2017
19 juin 2017
4) Application monopage avec ReactJS et Flux
ou Redux
5) Application isomorphique
6) Introduction à React Native
Développement guidé. 50% de théorie illustrée par 50% de pratique.
Travaux pratiques
Vous réaliserez une application complète basée sur le framework ReactJS.
1) Rappels des composants des RIA
- Les fondamentaux. HTML, CSS, JavaScript. Le DOM.
- Design patterns applicatifs classiques. Limitations des applications JavaScript.
- Ecosystème des frameworks JavaScript.
- Principes de Data-Binding : dirty-checking, observable, virtual-dom.
- ReactJS, positionnement et philosophie.
- JSX, présentation. Mise en œuvre "Transpilers".
- Environnement de développement. IDE et plug-ins.
Travaux pratiques
Mise en place de l'environnement de développement. Initiation à JSX. Définition de la structure de
l'application.
2) Développer avec ReactJS
- Approche : MVC et Virtual Dom, un choix de performance.
- Utiliser JavaScript ou JSX.
- Comprendre JSX en détail. Pièges à éviter.
- Méthodes principales de l'API.
- Création de composant de vues. Cycle de vie.
- Initialisation de propriétés.
- "Render Function" : gestion des états de composant.
Travaux pratiques
Définition et réalisation de composants selon les spécifications déterminées.
3) Interactivité des composants
- Gestion des événements. "autobinding" et délégation.
- Design Pattern : stratégie pour les composants à état.
- Composer par ensembles.
- "Component Data Flow" : propriétaire, enfants et création dynamique.
- Composants réutilisables : contrôle et transfert de propriétés.
- Contrôle des composants de formulaire.
- Manipulation du DOM.
Travaux pratiques
Création d'un ensemble structuré de composant UI.
4) Application monopage avec ReactJS et Flux ou Redux
- Flux/Redux : présentation. Propagation de données.
- Comparaison des architectures.
- Création de vues et contrôleurs dans Flux.
- Rôle du "Dispacther" dans Flux pour les actions.
- Les "Stores", gestionnaire d'états logique dans Flux.
- Définition du Functionnal Programming.
page 74
- Approche avec Redux. Le "Reducer".
- Extension pour ReactJS : "hot-loader".
Travaux pratiques
Intégration d'une SPA.
5) Application isomorphique
- Principe et bénéfices du développement isomorphique.
- Ecosystème du JavaScript côté serveur.
- Initiation à NodeJS.
- Configuration de NodeJs pour ReactJS.
- Organisation de routes.
Travaux pratiques
Prérendu serveur d'une application.
6) Introduction à React Native
- Positionnement, différences avec Cordova.
- De React aux composant iOS natifs, un projet à suivre.
Démonstration
Démonstration d'une application utilisant React Native.
page 75
Réf : BAB
Participants
Chefs de projet web,
architectes techniques,
développeurs front-end.
Pré-requis
Très bonne connaissance de
JavaScript. Connaissance
de HTML, CSS. Une
connaissance des design
patterns courants et de
l'architecture MVC est un plus.
BackBone.js, maîtriser le Framework de développement
Web
OBJECTIFS
Ce stage vous permettra de découvrir le Framework BackBone.js et d'en comprendre les mécanismes. Vous
verrez comment le mettre en oeuvre avec efficacité, adapter l'outil à vos solutions internes, et comment
assurer un développement itératif de qualité en testant en continu vos sources Backbone.js.
1) Présentation de Backbone.js
2) Concepts de base
4) Concevoir les formulaires
5) Organiser, structurer et enrichir Backbone.js
6) Les extensions de Backbone.js
7) Tester unitairement Backbone.js
Prix 2017 : 1960€ HT
Dates des sessions
Paris
1/3 de cours magistraux et 2/3 de travaux pratiques. Objectif : réalisation d'une application web simple,
capable d'exploiter les briques mises en œuvre (Backbone.js, Marionnette, LocalStorage).
3 oct. 2016, 27 mar. 2017
6 juin 2017
Travaux pratiques
A l'issue de la formation, accès au code source complet de l'application développée, ainsi qu'à la
documentation relative aux éléments mis en place.
1) Présentation de Backbone.js
- Rappels JavaScript.
- Les concepts fondamentaux de Backbone.js. Quand l'utiliser ?
- Les dépendances (underscore.js, jQuery).
- Créer et configurer un environnement de développement.
Travaux pratiques
Installer Backbone, configurer un environnement de développement.
2) Concepts de base
- L'architecture Event-Driven. Gérer les événements dans les composants Backbone.js.
- Les modèles. Gérer les données. Synchroniser les composants avec Sync.
- Les vues. Gérer les interactions entre les modèles et les vues. Dépendance à jQuery.
- Les collections d'objets. Gérer les interactions entre les collections et les vues.
- Le Router. Mapper les URLs, naviguer dans les ressources. L'History API.
Travaux pratiques
Récupérer des données via un WebService REST et les afficher dans une interface.
- Gérer une pagination, trier les collections.
- Les URLs à sections optionnelles, utiliser les regex pour capturer les URI.
- Optimiser ses vues pour la gestion des interactions utilisateur.
Travaux pratiques
Enregistrer des informations depuis l'application vers le WebService.
4) Concevoir les formulaires
- Construire un formulaire depuis une vue.
- Attacher les événements aux actions utilisateurs.
- Réutiliser les formulaires pour construire les vues-modèle.
- Créer un formulaire d'édition de modèle.
- Gérer les alertes utilisateur.
Travaux pratiques
Construction des vues de formulaires dynamiques.
5) Organiser, structurer et enrichir Backbone.js
- Conseils de rédaction, chartes de nommage. Organiser ses sources.
- Utiliser AMD pattern et RequireJS.
- Boostrapping de l'application.
Travaux pratiques
Encapsuler les composants d'application dans un pattern AMD en utilisant les libraires RequireJS.
page 76
6) Les extensions de Backbone.js
- Implémentation du DataBinding.
- Structurer plus facilement vos applications avec Marionette.
- Persister les données avec le LocalStorage. Gérer le mode offline.
- Moteurs de templating alternatifs. Cache applicatif.
Travaux pratiques
Restructurer l'application avec Marionette. Enregistrer des données locales. Gérer le mode offline,
synchroniser les données à la reconnexion.
7) Tester unitairement Backbone.js
- Pourquoi mettre en place des tests ?
- Assurer la cohérence des développements avec Mocha.
- Mettre en place des Mocks WebService.
- Assurer ses stratégies de test.
Travaux pratiques
Ecriture de tests unitaires à l'aide de Mocha.
page 77
Réf : COW
Participants
Ce cours s'adresse à tous
les chefs de projet, web
masters, informaticiens,
maîtres d'ouvrage...
Pré-requis
Aucune connaissance
particulière.
Réussir votre projet Web
Ce cours vous apportera une démarche pour la conduite de vos projets Web, ainsi que les connaissances
indispensables pour les mener à bien, de la conception à la mise en production. Il vous présentera aussi les
tendances à venir dans ce domaine et leurs impacts possibles sur vos projets.
Appréhender l'environnement technique et technologique d'un projet web
Elaborer le cahier des charges d'un site web
Définir les rôles et contributions des différents acteurs du projet
Planifier et piloter un projet de conception et de mise en ligne d'un site web
1) Positionner son site Web
2) Les acteurs, les sous-traitants
3) Choisir les outils du projet Web
4) Les cahiers des charges
5) La plateforme du site web
6) Conduite de projet
1) Positionner son site Web
- Intranet, Internet, Extranet, projets multicanaux.
- Impacts de la stratégie de l'entreprise sur la conception du site (portails, sites B2B, P2P, B2C...).
- Identifier les forces et les faiblesses du site à partir de la technique SWOT.
Travaux pratiques
Réalisation d'un SWOT, organisation sur une étude de cas.
2) Les acteurs, les sous-traitants
- Quels sont les acteurs MOA et MOE (éditorial, technique, chef de projet...). Leur rôle ?
- Quand faut-il sous-traiter ou prendre en charge ?
- Organisation et rôle respectif des acteurs.
Travaux pratiques
Définir une organisation d'acteurs sur une étude de cas.
3) Choisir les outils du projet Web
- Choix du serveur Web (IIS, Apache) ou du serveur applicatif (.NET, Websphere...). Les impacts.
- Les solutions autour de l'Open source.
- Les outils de publication et de gestion de contenu.
- Les technologies Web 2.0 (wiki, blogs, collaboratif...). Rich Internet Application, Rich Desktop Application.
Travaux pratiques
Définition des outils et serveurs selon des études de cas.
4) Les cahiers des charges
- Spécifications fonctionnelles. Optimiser la collaboration MOE/MOA.
- Cahier des charges (CDC) de la charte graphique, technique. Rôle clé de l'usability.
Travaux pratiques
Réaliser le CDC d'un site web.
5) La plateforme du site web
- Choix et achat d'un nom de domaine.
- Types d'hébergement (mutualiste, dédié), les critères (bande passante, sécurité...), coûts et impact.
- Choix d'une plateforme multimédia (streaming, multicanaux...). Choix du FAI. Changer d'hébergeur.
- Administration du serveur. Analyse des logs et optimisation du trafic.
Travaux pratiques
Définir un choix de sites Web, acquisition d'un nom de domaine autour du cas d'étude.
6) Conduite de projet
- Lancement et préparation de l'appel d'offres.
- Mise en place d'audits sécurité, juridique.
- Les démarches administratives (CNIL...).
- Les droits d'auteur (ressources graphiques, textes).
- Gestion du référencement : budget, suivi, reporting.
- Gestion d'une campagne publicitaire : budget, suivi.
- Conduite de projet et gestion de l'équipe Web.
- Planification des tâches. Piloter les tests. Mise en service (formation, référencement, documentation).
Travaux pratiques
page 78
Atelier de pilotage projet.
page 79
Réf : WEM
Participants
Ce cours s'adresse à tout
Webmaster en devenir ou
à tous ceux en poste qui
souhaitent renforcer ou mettre
à jour leur connaissance du
métier.
Pré-requis
création de sites Web.
Webmaster, le métier, les techniques
OBJECTIFS
Ce cours apportera au Webmaster toutes les connaissances utiles pour concevoir et maintenir un site Web.
A l'issue, il saura choisir un hébergeur, définir un cahier des charges, il comprendra les technologies du Web
2.0 et aura été sensibilisé aux règles juridiques du Web.
1) Editeurs et outils graphiques
2) Expression des besoins
3) Gestion de l'hébergement
Prix 2017 : 1960€ HT
1) Editeurs et outils graphiques
Dates des sessions
- Utiliser un éditeur pour auditer le code.
- Les outils d'intégration.
- Le CMS. HTML, XHTML, HTML5, CSS, JavaScript.
- La publication et maintenance des pages.
- Les outils de création graphique.
Paris
5 déc. 2016, 27 mar. 2017
26 juin 2017
4) Animation du site
5) Suivi de projet Web
6) Technologies 2.0
Travaux pratiques
Installer un CMS (WordPress), le paramétrer, le prendre en main et en auditer le code.
2) Expression des besoins
- Définir les besoins d'une application. Rôle MOE/MOA. Définir et utiliser une charte graphique.
- Rédiger un cahier des charges techniques.
- Rédiger une charte éditoriale.
Etude de cas
Réaliser un cahier des charges.
3) Gestion de l'hébergement
- Acheter et administrer des noms de domaine. Choix de l'hébergement.
- Réussir une migration vers un nouvel hébergeur.
- Analyser les besoins spécifiques d'un site Web.
- Maintenir et administrer un serveur.
- Optimiser le trafic.
- Sécuriser le site.
Travaux pratiques
Définir un choix de sites Web, acquisition de noms de domaine et choix de l'hébergement.
4) Animation du site
- Etablir une stratégie de contenu.
- Le référencement : SEO. SMA. SMO.
- Le Community Management.
- Mettre en place une campagne d'emailing.
Travaux pratiques
Mise en place d'une stratégie de référencement globale.
- Recherche de prestataires pour le développement d'applications Web.
- Les règles juridiques et administratives. La CNIL.
- Suivre le référencement d'un site, actions correctives.
- Le rôle du Webmaster dans l'équipe projet.
- L'utilisation des outils Google pour Webmasters.
- Evaluer la qualité du travail de la sous-traitance.
Travaux pratiques
Mise en place d'une stratégie de référencement globale.
6) Technologies 2.0
- Principes. Faire un site en respectant le Web 2.0.
- Le rôle de XML et de JSON, utilisation pour l'échange de données. Intégrer Ajax.
- Les bibliothèques et frameworks JavaScript (AngularJS, BootStrap...).
- Les préprocesseurs CSS (Sass, Less..).
Travaux pratiques
Découverte de bibliothèque JavaScript et de framework CSS.
page 80
Réf : OPS
Participants
Chef de projet, Webmestre,
développeur, designer,
toute personne liée au
développement et à la
promotion d'un site Web.
Pré-requis
concepts et technologies
Web.
Prix 2017 : 1410€ HT
Cette formation vous permettra de maîtriser les différentes techniques pour améliorer le référencement et
promouvoir votre site. Elle vous montrera également comment mettre en oeuvre et utiliser les outils d'analyse
et de mesure associés.
Comprendre le fonctionnement des moteurs de recherche
Mesure l'audience de son site
Maîtriser les techniques d'optimisation de son référencement naturel
Accroître la notoriété de son site avec le référencement payant
1) Rappel sur le Web
2) Moteurs de recherche
3) Audit de référencement
4) Techniques de référencement
5) Optimisation du site Web
6) Accroître la popularité du site, campagne de
publicité Web
Dates des sessions
Paris
12 déc. 2016, 9 mar. 2017
6 juin 2017
- Les serveurs Web (Apache, IIS). Protocole HTTP.
- HTML, XHTML. Tests de validation, enjeux sur le référencement. Accessibilité.
Travaux pratiques
Création et audit de métatags, audit de conformité XHTML.
- Popularité. Classification des réponses. Langage de recherche. Principes de positionnement.
- Comprendre la recherche. Mots-clés.
- Les mises à jour d'algorythme Google Mayday, Panda, Penguin et Colibri.
- Google+ et le référencement : authorrank et author ship.
Travaux pratiques
Référencement sur des moteurs, annuaires, zones dédiées.
- Tableau de bord de suivi. Audit par mots-clés.
- Les outils de Google Adwords : affiner les mots-clés.
- Le pageRank et le TrustRank : la mesure de popularité et de confiance du site.
- Définir un plan d'action. Budget. Les partenaires.
Travaux pratiques
Mise en oeuvre d'un audit.
- Soumission, indexation, positionnement. Fréquence.
- Utilisation des balises : titres, images, liens, URL...
- Les SEO : Search Engine Optimizer. Les outils de référencement automatique : limites, coûts.
- Paiement au clic. Liens sponsorisés. Mesurer le taux de transformation d'une campagne.
- L'offre des sites Google et Bing. Achat de mots-clés.
- Le référencement et les réseaux sociaux (facebook, google+, partage de vidéos).
Travaux pratiques
Mise en oeuvre des techniques. Réécriture de contenu.
- Intégration de multimédia, Flash, JavaScript, Frames.
- Optimisation : MetaTag, Tag (url, alt, title... ).
- Impact des technologies riches (Ajax, Flash, SilverLight) et Web 2.0 sur le référencement.
Travaux pratiques
Mise en oeuvre et analyse sur des sites existants.
6) Accroître la popularité du site, campagne de publicité Web
- Référencement dans les stores.
- Principes de promotion dans l'Appstore et Google Play.
- Présentation des offres Adwords et AdSense.
- Budget. Création et optimisation de la campagne.
- Utilisation des gadgets, des offres cartographiques (maps) et Local Business.
- Usage des espaces vidéo, newsletters, forums, jeux, ...
page 81
Travaux pratiques
Mise en place d'une campagne Google AdWords. Définition d'un plan d'animation.
page 82
Réf : GAW
Participants
Commerciaux et responsables
marketing ou toute personne
liée à la promotion d'un site
Web avec une campagne
payante sur Internet.
Pré-requis
Connaissance de base d'un
site Web.
Google Adwords, optimiser vos campagnes
Ce stage vous montrera comment intégrer Google AdWords dans votre démarche e-marketing afin de
générer du trafic sur votre site Web. Vous apprendrez à créer une campagne, à la paramétrer en fonction de
vos besoins, à définir les mots-clés et le budget associés de manière optimale.
Intégrer une campagne Google Adwords dans une démarche marketing digital globale
Préparer et planifier une campagne Google Adwords
Paramétrer sa campagne en fonction de ses besoins
Exploiter les rapports pour optimiser ses campagnes
1) L'outil Google AdWords
2) Préparer sa campagne
3) Exploitation de l'outil
4) Optimiser ses campagnes
1) L'outil Google AdWords
- Etat des lieux : le marché du Web.
- Les pratiques en termes de publicité sur le Web.
- Faire la promotion de son entreprise sur Google.
- Les différentes liaisons entre outils Google et Google AdWords : Google AdWords versus Google Analytics
et AdSense.
- Les outils concurrents.
- Concilier une campagne AdWords avec son référencement naturel (SEO).
Travaux pratiques
Analyse et échange autour de différentes campagnes publicitaires existantes.
2) Préparer sa campagne
- Définir sa campagne en fonction de ses besoins.
- Une ou plusieurs campagnes ?
- Quel périmètre d'action pour une campagne ?
- Trouver des mots-clés en rapport avec son activité...
- Définition d'un budget et pratique des enchères. La notion de Coût Par Clic (CPC).
- Ecrire ses annonces, les associer aux mots-clés les plus pertinents.
- Planifier sa campagne.
Travaux pratiques
Identifier ses besoins, ses mots-clés pour établir une campagne publicitaire.
3) Exploitation de l'outil
- Présentation de l'outil et de ses possibilités.
- Création et exploitation d'un compte. La structure d'un compte AdWords.
- Les options de ciblage (géographique...) pour toucher le bon public, au bon moment et au bon endroit.
- Paramétrages d'une campagne.
- Utiliser efficacement le réseau Display.
- Maîtriser les campagnes de Remarketing Google.
Travaux pratiques
Prise en main de l'outil. Analyse des différentes étapes de la conception d'une campagne AdWords.
4) Optimiser ses campagnes
- Améliorer son Quality Score pour optimiser le positionnement de ses annonces.
- Les différents rapports disponibles pour analyser en profondeur les performances de vos campagnes.
- Exploiter des rapports avec Google Analytics.
- Mise en place de Landing page pour Google Adwords.
- Intégrer sa campagne dans une démarche e-marketing globale.
Travaux pratiques
Analyse de différents rapports. Etude de différentes démarches e-marketing sur Internet. Utiliser les landing
pages.
page 83
Réf : LYT
Participants
Commerciaux et responsables
marketing, ou toute personne
concernée par la promotion
d'un site Web.
Pré-requis
Connaissance de base d'un
site Web.
Google Analytics, analyser les statistiques de vos sites
Ce stage vous montrera comment utiliser avec efficacité Google Analytics pour mesurer l'audience de votre
site Web et produire un reporting de qualité. Vous apprendrez également à mieux qualifier votre ciblage
clientèle, ainsi que vos besoins en termes d'investissements techniques pour l'exploitation de votre site Web.
Comprendre le fonctionnement des principaux moteurs de recherche
Installer l'outil Google Analytics
Créer et personnaliser des rapports
Exploiter les données de Google Analytics pour optimiser son site
Prix 2017 : 1430€ HT
1) Rappel des fondamentaux du web
2) La terminologie essentielle
3) L'outil Google Analytics
4) Savoir lire et exploiter les différents rapports
5) Exploiter Google Analytics par rapport à ses
besoins
Dates des sessions
Paris
9 nov. 2016, 2 mar. 2017
22 juin 2017
Luxembourg
27 oct. 2016
1) Rappel des fondamentaux du web
- Comment fonctionne un moteur de recherche.
- Les différents moteurs de recherche.
- Le référencement naturel (SEO) et payant.
- Pourquoi faire du suivi de statistiques.
Travaux pratiques
Réflexion autour de différents acteurs du Web.
2) La terminologie essentielle
- Page vue, visite, visiteur.
- Les "Referrer", les pages par lesquelles les internautes sont arrivés sur votre site.
- Sources de trafic.
- Rebond et taux de rebond.
- Fidélisation, acquisition, fréquence, récence.
3) L'outil Google Analytics
- Google Analytics dans la sphère Google.
- Installation de Google Analytics.
- Le tableau de bord.
- Les différents types de mesure.
- Les alertes.
Travaux pratiques
Prise en main de l'outil. Analyse de différents tableaux de bord.
4) Savoir lire et exploiter les différents rapports
- Les visiteurs (synthèse géographique, nouveaux vs connus, tendances, fidélité , matériels/logiciels utilisé...).
- Les sources de trafic (provenance, impact, mots-clés, campagne, SEO...).
- Analyse du contenu (pages les plus consultées, détail par titre et par URL, pages de destinations et de
sorties...).
- Les objectifs (conversions, valeur d'un objectif...).
- Création de rapports.
- Personnalisation de rapports.
Travaux pratiques
Etudes de différents types de rapports et contenu.
5) Exploiter Google Analytics par rapport à ses besoins
- Maintenance technique de son site.
- Analyse e-marketing.
- Gestion e-commerce.
Travaux pratiques
Exercice d'exploitation des données Google Analytics.
page 84
Réf : ITF
Participants
Développeurs de sites
Web, Web designers,
acteurs du marketing ou de
l'informatique.
Pré-requis
Aucune connaissance
particulière.
Prix 2017 : 1410€ HT
Design d'un site Web, comment faire un site attractif et
efficace
Ce stage vous apprendra à concevoir un site attractif et efficace répondant à la stratégie de votre entreprise.
Il vous montrera les points à prendre en compte : positionnement, design, ergonomie, accessibilité, écriture,
gestion du contenu, organisation, techniques d'animation, syndication et conduite de projets.
Connaître les principales règles d'usabilité et d'accessibilité d'un site web
Gérer et optimiser le contenu de marque diffusé sur le site web
Maîtriser les techniques d'animation d'un site web
Optimiser son référencement et accroître le trafic
Dates des sessions
Paris
17 nov. 2016, 20 mar. 2017
18 mai 2017, 10 juil. 2017
Aix
1) Positionnement du site Web
2) Règles de conception et usabilité
3) Accessibilité
4) Décliner sa marque au site Web
5) Conception et gestion de contenu
6) Techniques d'animation
7) Analyse de trafic
7 nov. 2016
Bordeaux
8 déc. 2016
Grenoble
7 nov. 2016
Lille
7 nov. 2016
Lyon
7 nov. 2016
Montpellier
8 déc. 2016
Nantes
8 déc. 2016
Rennes
8 déc. 2016
Sophia-antipolis
7 nov. 2016
Strasbourg
7 nov. 2016
Toulouse
8 déc. 2016
- Impacts de la stratégie de l'entreprise sur la conception.
- Analyse selon le type de site et l'objectif.
- Forces et faiblesses de l'environnement dans la conception (SWOT).
- Quel positionnement pour atteindre sa cible ?
Travaux pratiques
Positionner un site exemple.
- Comportement des utilisateurs. Définition de l'usability. Règles de base de l'ossature du site.
- Standards et contraintes des terminaux Web. Tests de conception. Adaptation du design aux terminaux
mobiles.
- Impact du design sur les choix Flash, HTML5, Web 2.0...
Travaux pratiques
Définir une mise en forme adaptée à un site et écrire des textes orientés Web.
3) Accessibilité
- Législation. Référentiels d'accessibilité. Le W3C, le WCAG, BrailleNet...
- L'accessibilité et le développement HTML et CSS.
Travaux pratiques
Création d'une page valide et accessible. Correction des erreurs d'accessibilité. Tests sur les sites existants.
- Lier le design Web, la stratégie et la communication.
- Valoriser une marque. Brief et stratégie créative. Charte graphique.
Travaux pratiques
Définir une charte graphique et utiliser un outil de maquettage fonctionnel.
- Création de rubriques : la méthode Mind Mapping.
- Organisation du contenu, publication. Outillage.
- Gérer un contenu collaboratif. Droits d'auteur. Référencement.
Travaux pratiques
Utiliser un logiciel de publication Web.
- Concevoir un site Web 2.0 : animation, ergonomie...
- Jeux-concours, quiz, blogs, couponing, forums, mail...
- Comment faire un bon référencement ? Adaptation du design aux réseaux sociaux.
Travaux pratiques
Découvrir les techniques d'animation de différents sites.
page 85
- Suivi et analyse de trafic. Analyse de référencement et positionnement. Techniques pour accroître le trafic.
Travaux pratiques
Création, analyse et positionnement de référencement. Analyse statistique et approches des SEO.
- Audit juridique du site : les risques. Conduite de projet : maquettage, développement...
page 86
Réf : TOX
Participants
Créer un site Web, de la maquette Photoshop à
l'intégration HTML/CSS
Graphistes et intégrateurs.
Pré-requis
Bonne pratique de l'internet.
HTML. Notions de design et
connaissances de base de
l'interface de Photoshop.
Ce stage vous apprendra à créer un site Web depuis la livraison d'un fichier Photoshop PSD jusqu'à la
construction de sa structure et de ses pages modèles côté client. Vous concevrez le site en utilisant les
standards HTML/CSS et l'agrémenterez de fonctionnalités issues de la bibliothèque JavaScript jQuery.
Utiliser Photoshop pour la découpe et l'optimisation des images
Mettre en place une méthodologie d'intégration
Réaliser une intégration HTML en respectant la sémantique
Restituer le design d'un site avec les styles CSS en respectant les recommandations du W3C
Aborder la mise en oeuvre de la bibliothèque JavaScript jQuery
1) Organisation du projet
2) La découpe dans Photoshop
3) L'intégration XHTML
4) Le design avec CSS
5) Bonnes pratiques
6) Carousel jQuery
Réalisation d'un site simple dans un éditeur d'après une maquette graphique. Appréhension des points
théoriques fondamentaux à chaque étape du projet.
Exercice
Réalisation de l'intégration d'un site simple.
1) Organisation du projet
- Analyse du fichier Photoshop PSD. Le zoning.
- Choix des outils de développement.
- L'environnement de développement.
- Méthodologie. Prise en compte des contraintes.
Exercice
Edition du fichier PSD fourni. Exploration des calques. Réalisation du zoning. Détermination du nombre de
modèles de pages.
2) La découpe dans Photoshop
- Bien penser sa découpe.
- Les calques.
- L'outil tranche.
- L'optimisation d'images.
- Le choix de format des images.
- Fusion de tranches. Export de tranches.
- Les dangers de l'export HTML dans Photoshop.
Exercice
Organisation de la découpe. Réalisation de la découpe dans Photoshop. Optimisation des images.
3) L'intégration XHTML
- Rappel de la syntaxe HTML. Choix du Doctype.
- Les principales balises HTML.
- Utiliser les bonnes balises. Valider son code.
Exercice
Construction de la structure HTML du site en fonction du zoning effectué précédemment. Découverte du
validateur WC3.
4) Le design avec CSS
- Les navigateurs ciblés. Localisation du CSS.
- Les principaux sélecteurs CSS.
- Les principales propriétés.
- Le flux CSS. La notion de boîtes. Les fusions de marges. La notion de conteneur.
- Priorité des sélecteurs. Les balises block et inline.
- Le commentaire conditionnel.
Exercice
Construction de la feuille de style externe du site. Découverte ou rappel de la syntaxe CSS : les sélecteurs et
les propriétés. Inspection du code CSS avec Firebug ou Chrome. CSS et le menu du site.
page 87
5) Bonnes pratiques
- Le respect des normes de développement en CSS.
- Bien cibler les éléments HTML.
- La syntaxe raccourcie.
- Le regroupement des sélecteurs.
- Valider son code CSS. Commenter son code.
- Convention d'écriture du code CSS.
Exercice
Aperçu de la page dans différents navigateurs. Correction du code. Mise en pratique des conventions
d'écriture CSS. Découverte du validateur CSS. Construction d'une feuille de style pour IE.
6) Carousel jQuery
- Installation de jQuery.
- Installation de jquery.jcarousel.pack.
- Intégration d'un slider au site.
Exercice
Installation de jQuery et jquery.jcaroussel.pack. Découverte de la syntaxe. Intégration d'un slider. Modification
du CSS et du script JavaScript.
page 88
Réf : RPO
Participants
Développeurs, designers,
chefs de projets et
webmasters.
Pré-requis
HTML et CSS.
Prix 2017 : 1410€ HT
Dates des sessions
Responsive Web Design, créer des interfaces Web
adaptables
Best
Les concepteurs de sites Web doivent dorénavant revoir leur approche pour que leurs interfaces s'adaptent
à la diversité des terminaux. Cette formation apporte des réponses pratiques aux problématiques de
conception ergonomique et de gestion des contraintes liées au Responsive Design.
Concevoir et développer des interfaces Web pour tous types de terminaux
Adopter une approche de conception ergonomique Mobile First
Découvrir les composants graphiques, les Frameworks et les librairies Responsives
Optimiser les performances d'affichage des pages sur mobiles et ordinateurs
Paris
9 nov. 2016, 9 fév. 2017
20 avr. 2017, 8 juin 2017
Aix
15 déc. 2016, 16 mar. 2017
6 juin 2017
1) Les terminaux
2) Démarche de conception
3) MediaQueries
4) Principe de grille flexible, fluide
5) Composants graphiques
6) Framework et librairies responsive
7) Optimisation et performance
Bordeaux
8 déc. 2016, 23 mar. 2017
15 juin 2017
Bruxelles
15 déc. 2016, 9 fév. 2017
18 mai 2017
Geneve
15 déc. 2016, 9 fév. 2017
18 mai 2017
Grenoble
15 déc. 2016, 23 mar. 2017
15 juin 2017
1) Les terminaux
- Types de terminaux (mobile, tablette, tv, liseuse...) et leur résolution. Périphériques, OS, navigateurs.
- Le marché mobile et parts de marché.
- Standards HTML, HTML5, CSS3 (API, sélecteurs...).
Travaux pratiques
Détection du type de terminal en PHP JavaScript.
Luxembourg
- Concept de Marcotte, Mobile First.
- Séparation contenu/contenant.
- Approche portrait/paysage, tactile, impact sur l'ergonomie.
- Créer un plan de tests.
- Différence entre design Web et design Mobile.
15 déc. 2016, 9 fév. 2017
18 mai 2017
3) MediaQueries
Lille
15 déc. 2016, 16 mar. 2017
6 juin 2017
Lyon
15 déc. 2016, 23 mar. 2017
15 juin 2017
Montpellier
8 déc. 2016, 16 mar. 2017
6 juin 2017
- Adaptation des CSS aux caractéristiques du terminal.
- Règles conditionnelles (orientation, device-width...).
- JavaScript et les anciens navigateurs.
- Réglage complémentaire de rendu visuel (Viewport).
Nantes
Travaux pratiques
Construction de CSS selon les modes portrait/paysage, résolution du terminal.
8 déc. 2016, 16 mar. 2017
6 juin 2017
Rennes
- Conception classique vs conception selon une grille.
- Importance des blocs, approche contenu/contenant.
- Unités de mesure (% em px), mode Retina.
- Eviter les débordements. Points de rupture.
- Principe des box, layout avec CSS3.
8 déc. 2016, 16 mar. 2017
6 juin 2017
Sophia-antipolis
15 déc. 2016, 16 mar. 2017
6 juin 2017
Strasbourg
15 déc. 2016, 16 mar. 2017
6 juin 2017
Travaux pratiques
Construire une ergonomie basée sur une grille flexible.
Toulouse
8 déc. 2016, 23 mar. 2017
15 juin 2017
- Images flexibles : images de fond, adaptation HTML5, adaptation de la qualité graphique selon le terminal.
- Contenu responsive : rupture texte, multicolonnes. Césure et découpe.
- Polices fluides : format des polices, taille.
- Marges et espaces flexibles.
- Menus adaptables, carrousel adaptatif.
- Créer des images et des vidéos adaptées.
Travaux pratiques
Mise en oeuvre de solutions.
page 89
- Détecter les ressources avec "Modernizr".
- Librairies de substitution (less, css3pie...).
- Frameworks CSS 960 grid, HTML5 BoilerPlate, Bootstrap, Foundation, Skeleton, 320...
Travaux pratiques
Utilisation de frameworks.
- Mesurer la performance de chargement, optimisation de bande passante. Répartition Client/Serveur.
- Optimisation des ressources graphiques.
- Gestion du cache.
Travaux pratiques
Audit de pages Web, corrections conceptuelles et techniques.
page 90
Réf : AXU
Participants
Développeurs Front-End,
webmasters, MOA.
Pré-requis
sur le design d'interfaces
graphiques, ou connaissances
équivalentes à celles
apportées par le stage AIL,
IHM ou EGO.
Prix 2017 : 1600€ HT
Dates des sessions
Paris
8 déc. 2016, 6 avr. 2017
8 juin 2017
Concevoir des maquettes d'interface graphique
découverte d'outils et maquettage sur Axure
New
Définir des maquettes d'IHM permet d'impliquer utilisateurs et développeurs en amont de la réalisation,
pour bien valider l'ergonomie d'un site grand public ou d'une application métier. Ce stage vous présentera
comment bien utiliser les outils de maquettage et en particulier Axure pour la réussite d'une telle démarche.
Se familiariser avec les concepts de zoning, architecture de l'information, navigation
Créer des maquettes statiques et dynamiques avec Axure
Intégrer les principes de bases de la rédaction de spécifications d'IHM
1) Introduction
2) Les outils existants : panorama (Balsamiq,
Visio, Axure, InVision...)
3) Structurer les contenus
4) Créer une interface avec Axure : des bases
aux comportements dynamiques
5) Ecrire des spécifications d'interface hommemachine
Travaux pratiques
Travaux pratiques de complexité croissante sur Axure.
1) Introduction
- Pourquoi faire une maquette IHM ?
- Coûts et bénéfices.
- Quand faire une maquette IHM ?
- Les principes de "design centré utilisateur" : rappels.
- Utiliser une maquette pour des tests utilisateurs : l'approche AgileUX.
- Exemples de projets.
2) Les outils existants : panorama (Balsamiq, Visio, Axure, InVision...)
- Le maquettage vertical et le maquettage horizontal.
- Basse, moyenne et haute fidélité des maquettes.
- Différence entre maquettes et prototypes.
- Les outils du marché, gratuits et payants : avantages et inconvénients. Quel choix faire ?
Démonstration
Exemples de réalisations mises en œuvre avec différents outils.
3) Structurer les contenus
- Concevoir la structure du produit et l'architecture de l'information.
- Les flux de navigation.
- Valider une structure de contenus avec les utilisateurs finaux : le tri de cartes.
- Outils de mind mapping : XMind et les autres.
Exercice
Utilisation de XMind, outil de mind mapping, pour structurer les éléments de l'interface.
4) Créer une interface avec Axure : des bases aux comportements dynamiques
- Axure RP Pro : un outil puissant et complet.
- Créer des pages statiques. Widgets, masters, liens.
- Importer des bibliothèques (icônes, polices...) et gérer le style des pages.
- Widgets et masters.
- Créer des interfaces Responsive pour tablettes et smartphones.
- Créer des interactions.
- Les comportements dynamiques (panels dynamiques, événements, variables).
Exercice
Mise en œuvre de maquettes variées avec Axure.
5) Ecrire des spécifications d'interface homme-machine
- Pourquoi écrire des spécifications IHM ? Temps nécessaire et bénéfices.
- Générer des spécifications IHM avec Axure : un document exploitable ?
- Bonnes pratiques dans Axure afin d'optimiser les spécifications générées par l'outil.
- Charte ergonomique et charte graphique : complémentarités et différences.
- Exemples de réalisations.
page 91
Exercice
Exporter et compléter des spécifications IHM.
page 92
Réf : UTL
Participants
Développeurs d'applications,
ergonomes, concepteurs
d'IHM, responsables qualité.
Pré-requis
concepts de développement
d'applications possédant une
interface utilisateur.
Prix 2017 : 2320€ HT
Dates des sessions
Paris
21 nov. 2016, 6 fév. 2017
3 avr. 2017, 6 juin 2017
Utilisabilité des applications, certification
pour logiciels et sites Web
Les utilisateurs d'applications et sites Web doivent être guidés selon leurs besoins réels. C'est le rôle de
l'Utilisabilité ou ergonomie logicielle, centrée sur "l'expérience utilisateur". Ce stage vous donnera les savoirfaire essentiels pour conduire ces analyses et se terminera par la certification "IBUQ".
Comprendre les notions de perception, d'ergonomie et de comportement appliquées aux interfaces hommemachine (IHM)
Sélectionner et utiliser les techniques de conception orientée utilisateur
Identifier les normes, standards et lois applicables dans le domaine de l'utilisabilité
Organiser des tests d'utilisabilité en utilisant des techniques et procédures spécifiques
1) Importance de l'utilisabilité
2) Interfaces homme-machine
3) Ingénierie de l'utilisabilité
4) Test et évaluation de l'utilisabilité
5) Examen de certification
Présentation de concepts et méthodes puis mise en œuvre sur des exemples pratiques.
Certification
Ce stage se conclut par l'examen de certification officielle "IBUQ Professionnel en Utilisabilité" (IBUQ:
International Board for Usability Qualification).
1) Importance de l'utilisabilité
- Définition de l'utilisabilité et des termes associés : Satisfaction, Apprentissage, Mémorisation.
- Bénéfices pour les utilisateurs.
- Bénéfices économiques pour les fournisseurs : réduction des coûts, avantages compétitifs.
- Problèmes relatifs à une mauvaise utilisabilité : faiblesse des ventes en ligne...
- L'Expérience Utilisateur (UX: User Experience).
2) Interfaces homme-machine
- Ergonomie et règles de conception (HMI: Human-Machine Interface).
- Traitement de l'information utilisateur : vision statique ou dynamique, limitations physiologiques.
- Standards, règles et lois applicables : ISO 9241, W3C.
- Accessibilité : qualité du contenu, outils pour les personnes ayant un handicap visuel.
Exercice
Analyse des effets psychologiques de la perception visuelle (code couleur, vision statique et dynamique).
3) Ingénierie de l'utilisabilité
- Fondamentaux : la conception centrée utilisateurs, l'utilisabilité dans le cycle de vie des projets.
- Phase d'analyse : définition des objectifs d'utilisabilité, construction de scénarios et cas d'utilisation.
- Phase de conception : conception en parallèle, conception itérative, conception participative.
- Phase de prototypage : différents types de prototypes.
- Phase d'évaluation : participation des utilisateurs.
Mise en situation
Sur la base d'un cas d'étude (organisation d'un atelier de conception centrée utilisateurs, définition de
scénarios utilisateurs, création d'un prototype, réalisation d'un Storyboard).
4) Test et évaluation de l'utilisabilité
- Techniques de test et d'évaluation : "Eye-tracking", vidéo, Groupe, Laboratoire.
- Contenu d'un rapport d'évaluation.
Exercice
Utilisation d'une checklist d'évaluation sur différents exemples réels. Analyse d'une vidéo montrant les
réactions d'utilisateurs dans un laboratoire.
5) Examen de certification
- Préparation et passage de l'examen de certification officielle "IBUQ Professionnel en Utilisabilité".
page 93
Réf : CSN
Participants
à tous les concepteurs de
newsletters.
Pré-requis
HTML et CSS souhaitables.
Réaliser vos newsletters en HTML/CSS et gérer les envois
OBJECTIFS
Cette formation vous apprendra à créer une newsletter dont le contenu et la mise en forme pourront être
restitués fidèlement par les routeurs de messageries. Vous découvrirez les contraintes propres à la création
et à l'envoi de newsletters, ainsi que les aspects juridiques, éditoriaux et graphiques.
1) Introduction : importance et enjeux de la
newsletter
2) Construction du gabarit (HTML/CSS)
3) Contenu éditorial
4) Aspects juridiques
5) Envoi de la newsletter
1) Introduction : importance et enjeux de la newsletter
- Qu'est-ce qu'une newsletter ?
- Particularité de la newsletter, les enjeux.
- La newsletter et le site internet.
Démonstration
Présentation de différents modèles de newsletter.
2) Construction du gabarit (HTML/CSS)
- Réception de la maquette graphique, problématiques graphiques, utilisation de templates préexistants.
- Préparation de l'intégration et organisation du projet.
- Les contraintes spécifiques : les routeurs de messageries (webmail).
- Le langage HTML, CSS, éditeur WYSIWYG (Dreamweaver).
- Construction de la structure de la newsletter sous forme de tableaux (utilisation des attributs HTML
correspondants).
- Habillage de la newsletter (styles intégrés aux balises HTML).
- Tests et rendu sur terminaux mobiles.
Travaux pratiques
Construction d'un gabarit de newsletter simple à partir d'un modèle avec des éléments graphiques fournis.
3) Contenu éditorial
- Techniques de rédaction Web, place du texte à l'écran.
- Titre et paragraphes.
- Les images, les liens.
- Prise en compte de l'accessibilité.
Travaux pratiques
Structuration d'un paragraphe type respectant les règles d'écriture pour le Web à partir d'éléments textuels
fournis.
4) Aspects juridiques
- Gestion des abonnements, processus d'abonnement, de désabonnement.
- Les fichiers de destinataires, la loi LCEN.
- Les bonnes pratiques, la netiquette, archivage des newsletters.
Travaux pratiques
Utilisation de processus d'abonnement, désabonnement.
5) Envoi de la newsletter
- Les différentes possibilités techniques.
- Pourquoi prendre un prestataire externe pour gérer l'envoi de la newsletter ?
- Les risques de spam, les différentes précautions à prendre avant l'envoi.
- Préparer l'envoi de la newsletter, les tests.
- Analyse des statistiques de retour, sondage de satisfaction, tracking.
- Les différentes offres de prestataires d'envoi de newsletter (mailer).
Travaux pratiques
Préparation du dossier contenant tous les éléments constitutifs de la newsletter jusqu'à l'envoi sur le serveur
distant en ftp. Tests.
page 94
Réf : PHO
Participants
Toute personne (marketing,
communication, relations
humaines...) désireuses
d'effectuer des acquisitions
d'images, des retouches,
de travailler sur les calques,
de préparer ses propres
montages...
Pré-requis
Aucune connaissance
particulière.
Prix 2017 : 1200€ HT
Dates des sessions
Photoshop CC/CS6, prise en main
Best
Ce stage vous apprendra à utiliser la palette d'outils disponibles dans Photoshop® afin de créer et retoucher
des images numériques. Vous verrez comment préparer vos composants graphiques et les exporter pour les
exploiter, notamment, dans un environnement Web.
Apprendre à utiliser la palette d'outils disponibles dans Photoshop®
Créer et retoucher des images numériques
Savoir créer et gérer les calques
1) Introduction
2) Les couleurs et les images pour le Web
3) Les corrections chromatiques
4) Les filtres et leurs effets
5) Les sélections et les masques
6) Gestion des calques
7) La création et les retouches
8) Les importations et exportations vers le Web
Paris
17 oct. 2016, 14 nov. 2016
12 déc. 2016, 16 jan. 2017
13 fév. 2017, 20 mar. 2017
3 avr. 2017, 9 mai 2017
6 juin 2017, 17 juil. 2017
21 aoû. 2017
Aix
5 déc. 2016, 20 mar. 2017
19 juin 2017
Bordeaux
5 déc. 2016, 28 mar. 2017
26 juin 2017
Bruxelles
21 nov. 2016, 13 fév. 2017
9 mai 2017
Geneve
21 nov. 2016, 13 fév. 2017
9 mai 2017
1) Introduction
- Présentation de Photoshop.
- L'image numérique. La colorimétrie.
- Bridge et Mini Bridge.
- Outils : sélection, texte, main, loupe, dégradé, correcteur, gomme, aérographe, pinceau, tampon...
- Outil de recadrage et ses multiples possibilités.
- Palettes : calques, formes, couches, couleurs...
2) Les couleurs et les images pour le Web
- La lumière, la couleur, synthèse additive (RVB) et soustractive (CMJN).
- Les images pour le Web.
- La préparation des photos : recadrage par modification de la zone de travail.
- Les formats PNG, GIF, JPG, GIF animé.
3) Les corrections chromatiques
Lille
- Les réglages de luminosité et de contraste.
- Les corrections des couleurs.
- Les niveaux. Les courbes.
- Les corrections des couleurs (balance des couleurs, teinte saturation, correction sélective...).
- Gestion du noir & blanc.
5 déc. 2016, 20 mar. 2017
19 juin 2017
Travaux pratiques
Correction de photos.
Grenoble
5 déc. 2016, 28 mar. 2017
26 juin 2017
Luxembourg
21 nov. 2016, 13 fév. 2017
9 mai 2017
Lyon
5 déc. 2016, 28 mar. 2017
26 juin 2017
4) Les filtres et leurs effets
- Présentation des catégories de filtres.
- Description détaillée des principaux filtres.
Montpellier
Travaux pratiques
Redéfinir l'aspect d'une façade.
5 déc. 2016, 20 mar. 2017
19 juin 2017
5) Les sélections et les masques
Nantes
5 déc. 2016, 20 mar. 2017
19 juin 2017
Rennes
5 déc. 2016, 20 mar. 2017
19 juin 2017
Sophia-antipolis
- Outils et les commandes de sélection.
- Couches, masques de détourage. Mode masque.
- Plage de couleurs. Détourage vectoriel.
- Commande "améliorer le contour d'une sélection".
Travaux pratiques
Créer un effet loupe.
5 déc. 2016, 20 mar. 2017
19 juin 2017
6) Gestion des calques
Strasbourg
- Création des calques. Chaînage et fusion.
- Masques de fusion. Calques de réglage et texte.
- Tri sur les calques. Masque d'écrêtage.
- Styles de calque.
5 déc. 2016, 20 mar. 2017
19 juin 2017
Toulouse
5 déc. 2016, 28 mar. 2017
26 juin 2017
Travaux pratiques
Créer une carte de vœux.
page 95
7) La création et les retouches
- Colorations. Textes. Outils de dessin et de retouche.
- Transformations : symétrie, rotations, effets.
- Déformation de la marionnette.
- Contenu manquant. Échelle basée sur le contenu.
Travaux pratiques
Créer un bandeau à partir d'une photo qui n'est pas à l'échelle.
8) Les importations et exportations vers le Web
- Formats d'exportation. Exporter en haute résolution. Exporter pour le Web.
- Impressions. Animations. Palette montage.
Travaux pratiques
Créer un GIF animé.
page 96
Réf : EGO
Participants
Toute personne dans le
domaine de l'informatique
concernée directement ou
indirectement par la qualité
des interfaces HommeMachine.
Pré-requis
Connaissances de base sur
les systèmes d'exploitation
mobiles et les interfaces d'un
point de vue utilisateur.
Ergonomie des IHM mobiles pour tablettes et
Smartphones
OBJECTIFS
Ce cours concerne les interfaces d'applications pour mobiles, tablettes et Smartphones. Il présente les
fondements de l'ergonomie des IHM mobiles et montre les bonnes pratiques pour concevoir et améliorer
l'expérience utilisateur. Des travaux pratiques de maquettage et d'audit sont réalisés pendant la formation.
1) Introduction : qu'est-ce que l'ergonomie ?
2) Concevoir une interface mobile ergonomique
3) Etudier les utilisateurs, leurs tâches et le
contexte
4) Maquetter une interface mobile
5) L'analyse heuristique des IHM mobiles
Prix 2017 : 1440€ HT
1) Introduction : qu'est-ce que l'ergonomie ?
Dates des sessions
Paris
3 nov. 2016, 2 mar. 2017
8 juin 2017
- Définition de l'ergonomie.
- Pourquoi a-t-on besoin d'ergonomes ?
- Le rôle de l'ergonomie.
- Bénéfices de l'ergonomie.
- L'ergonomie à l'intersection de plusieurs disciplines.
- L'ergonomie et l'accessibilité : contrainte ou complémentarité.
- Pointage : loi de FITTS.
2) Concevoir une interface mobile ergonomique
- Introduire l'ergonomie dans le cycle de conception IHM.
- Types d'intervention : conception ou correction.
- Le retour sur investissement de l'ergonomie.
- Waterfall, cycle en V, Agile : comment prendre en compte l'ergonomie.
- Normes d'utilisabilité ISO 9241-210.
- Spécificités des IHM mobiles : affichage, interactions, nouveaux publics et usages.
- Les problèmes d'ergonomie courants.
Exemple
Familiarisation avec l'ergonomie. Audit de différentes IHM présentant des problèmes d'ergonomie.
Observation et identification par les participants des points à améliorer.
3) Etudier les utilisateurs, leurs tâches et le contexte
- Le fonctionnement cognitif humain.
- Optimiser l'affichage mobile.
- Sites mobiles, Apps dédiées ou Responsive Design ?
- Couleurs, images, menus, icônes : les règles pour les mobiles.
- La navigation dans une interface mobile.
- La population cible : établir des Personas.
- Les gestes du tactile, spécificités par système d'exploitation.
4) Maquetter une interface mobile
- Qu'est-ce que le maquettage ?
- Sketching, le maquettage basse fidélité.
- Le maquettage moyenne fidélité.
- Le maquettage haute fidélité.
- Les outils disponibles du marché.
Travaux pratiques
Conception d'interface à partir d'outils basse fidélité visuelle (Balsamiq, Wireframe Sketcher).
5) L'analyse heuristique des IHM mobiles
- La méthode de l'analyse heuristique : points forts, points faibles, ROI.
- Les critères heuristiques "universels".
- Méthodologie de l'analyse heuristique.
- Une grille d'analyse des IHM mobiles.
- Etude de grilles d'analyse, d'audit.
Travaux pratiques
Audit d'interfaces mobiles.
page 97
Réf : MOB
Participants
projets mobilité.
Pré-requis
du Web, d'HTML de CSS.
JavaScript et du XML.
Prix 2017 : 2440€ HT
Dates des sessions
Paris
11 oct. 2016, 15 nov. 2016
13 déc. 2016, 7 fév. 2017
4 avr. 2017, 6 juin 2017
22 aoû. 2017
Aix
22 nov. 2016, 28 mar. 2017
27 juin 2017
Créer des applications multiplateformes pour mobiles
Best
Cette formation vous montrera comment réaliser un site Web pour terminaux mobiles et tablettes avec les
technologies HTML, CSS et JavaScript. Elle vous apprendra à mettre en œuvre les frameworks les plus
utilisés pour réaliser des applications fonctionnant sous iPhone, Android et Windows.
Identifier les spécificités d'une application mobile
Découvrir les solutions de développement mobile
Construire une application mobile complète
Comprendre le processus de publication d'une application mobile
Piloter un projet mobile
1) Rappels sur les technologies de base
2) Solutions embarquées
3) Différence entre application Web traditionnelle
et mobile
4) Construction XHTML, HTML5
5) Framework multiplateforme
6) Stockage des données dans le mobile
7) Cartographie et géolocalisation
Travaux pratiques
Un Smartphone sera mis à la disposition des participants afin qu'ils puissent tester les applications qu'ils
développeront tout au long de cette formation.
Bordeaux
6 déc. 2016, 21 mar. 2017
13 juin 2017
1) Rappels sur les technologies de base
Bruxelles
Grenoble
- Présentation des familles de terminaux : Smartphones, tablettes, leurs spécificités.
- Rappel sur les technologies HTML, CSS, JavaScript.
- Rappels sur les outils de développement modernes (NodeJS, NPM, Bower, Gulp...).
- Présentation des moteurs Webkit, Gecko...
- Importance et intégration du useragent.
- Communication Ajax : importance et limite selon les mobiles.
- Outils de développement, de test, de simulation.
22 nov. 2016, 21 mar. 2017
13 juin 2017
Travaux pratiques
Mise en place d'un environnement de travail dédié au mobile.
13 déc. 2016, 14 mar. 2017
13 juin 2017
Geneve
13 déc. 2016, 14 mar. 2017
13 juin 2017
Lille
22 nov. 2016, 28 mar. 2017
27 juin 2017
Luxembourg
13 déc. 2016, 14 mar. 2017
13 juin 2017
Lyon
22 nov. 2016, 21 mar. 2017
13 juin 2017
Montpellier
6 déc. 2016, 28 mar. 2017
27 juin 2017
Nantes
6 déc. 2016, 28 mar. 2017
27 juin 2017
Rennes
6 déc. 2016, 28 mar. 2017
27 juin 2017
Sophia-antipolis
22 nov. 2016, 28 mar. 2017
27 juin 2017
Strasbourg
22 nov. 2016, 28 mar. 2017
27 juin 2017
Toulouse
4 oct. 2016, 6 déc. 2016
21 mar. 2017, 13 juin 2017
2) Solutions embarquées
- Présentation des technologies existantes et leurs environnements de développement : limite, coût,
portabilité.
- Objective-C et Swift (iPhone, iPad), Java (Android), C# .Net (Windows 10, Xamarin), Tizen, Firefox OS.
- Méthode de publication d'une application dans les catalogues officiels des opérateurs (Apple Store, Google
Play...).
- Démarches administratives (iPhone Developer Program, Certificats...).
3) Différence entre application Web traditionnelle et mobile
- Différences entre les navigateurs : moteurs JavaScript, CSS, limite des plug-ins (Flash, PDF...), autres
spécificités.
- Différence des tailles des écrans et solutions.
- Différences matérielles (CPU, mémoire).
4) Construction XHTML, HTML5
- Les balises META et spécifiques : Viewport et paramétrage dynamique des CSS.
- Balises traditionnelles de construction de pages.
- Constructions de tableaux.
- Les liens et les options dédiées accesskey.
- Les images et l'importance des images sur les terminaux (format, poids des images).
- Les textes p, span. Les blocs div et les blocs canvas en HTML 5.
- Les formulaires. Nouveaux types de données (daterange, slider...). Activation du clavier numérique.
- CSS, importance en mode multicanal. Positionnement des éléments, navigation entre les éléments (zindex,
display...).
- Apport des CSS3 en HTML5. Simplifier la création et la maintenance des CSS avec Bootstrap, Sass,
Compass et Less.
- Importance du DOM pour un portage multiterminal.
- Environnement mobile (sensors, battery, détection réseau...).
- Evénements multitouch spécifiques aux terminaux (gesture, touch, drag et drop...).
- Protocoles de communication (websocket, ajax), avantages de Node.js.
page 98
- Bibliothèque graphique : API de dessin (rectangle, ligne...), palette de couleur, manipulation des images.
- Tests de conformité au W3C : outils de validation.
Travaux pratiques
Mise en œuvre de formulaires de saisie ; de boutons et composants ; de rotation du terminal par CSS ; de
gestion dynamique des événements "touch" ; de drag&drop ; de mini gestionnaire de dessin. Mise en place
d'un serveur websocket avec Node.js. Détection des coupures réseaux.
5) Framework multiplateforme
- Avantages d'utilisation d'un Framework.
- Choisir un Framework mobile.
- Cordova (PhoneGap) et ses outils de publication.
- AngularJS 2.0, un Framework orienté développement mobile.
- Mobile Angular UI : construire des Apps Mobiles HTML5 avec Bootstrap et Angular JS.
- Ionic, construire des applications natives avec Cordova et Angular JS.
- Les Framework pour le Material Design (Polymer, Materialize CSS…).
Travaux pratiques
Mise en œuvre et découverte des différents Frameworks disponibles sur le marché. Réalisation d'un projet
Material Design, intégration Cordova et génération d'une application multi OS.
6) Stockage des données dans le mobile
- Mise en place d'une stratégie "mode déconnecté".
- Manifest et la montée en cache des ressources du site mobile.
- Bases de données SQLite, indexedDB intégrées au navigateur.
- Langage SQL et outils d'administration.
- Gestion et pilotage en JavaScript (création de table, requêtes...).
- Usage de Google Gears pour les terminaux non compatibles HTML 5.
- Gestion du cache côté client pour un travail en mode non connecté (localStorage, sessionStorage).
Travaux pratiques
Création d'un gestionnaire de notes avec stockage dans la base embarquée.
7) Cartographie et géolocalisation
- Gestion de la carte Google Maps.
- Options pour la prise en charge de la géolocalisation du mobile.
Travaux pratiques
Affichage de la carte par rapport à la localisation du mobile et affichage de markers sur la carte.
page 99
Réf : OVA
Participants
Chefs de projet, développeurs
Web et mobiles.
Pré-requis
développement Web (HTML /
CSS et JavaScript). Des
connaissances de base de
Visual Studio et de NodeJS
peuvent être un plus.
Cordova, développer des applications mobiles
multiplateformes
Le développement d'applications mobiles est devenu un enjeu majeur, mais viser les principales plateformes
(iOS, Windows et Android) coûte cher. Cette formation vous permettra de maîtriser le framework Cordova
(anciennement PhoneGap) afin de réduire considérablement le coût de développement de vos applications.
Découvrir les enjeux du développement d'applications mobiles
Comprendre le processus de développement d'une application mobile avec le framework Cordova
Maîtriser les outils Cordova de Visual Studio
Migrer une application Web en application mobile
Prix 2017 : 1960€ HT
Dates des sessions
Paris
5 déc. 2016, 3 avr. 2017
6 juin 2017
1) Développement mobile cross-platform avec
Cordova
2) A la découverte de Cordova
3) Utilisation de Visual Studio
4) Migrer une application Web en application
native
5) Interagir avec le device
6) Pour aller plus loin
Travaux pratiques
Tous les développements seront testés sur Smartphone mis à la disposition des participants. Les
environnements Android et IOS seront utilisés.
1) Développement mobile cross-platform avec Cordova
- Enjeux du développement mobile.
- Développement cross-platform vs développement natif.
- Le Framework Cordova.
- Fonctionnement technique de Cordova.
- Interagir avec le device.
- Avantages et limites de Cordova.
2) A la découverte de Cordova
- Installation de l'environnement (NodeJS / Cordova).
- Utilisation de la CLI.
- Création d'une première application.
- Analyse de la structure d'une application.
- Génération de l'application Windows.
- Génération de l'application Android.
- Génération de l'application iOS.
Travaux pratiques
Création d'une application Cordova en ligne de commande. Analyse de la structure de l'arborescence projet.
3) Utilisation de Visual Studio
- Découverte des outils Cordova de Visual Studio.
- Création d'une application avec Visual Studio.
- Génération de l'application Windows et Android.
- Déploiement et debug de l'application sur Device ou Emulateur.
- Visual Studio et iOS.
Travaux pratiques
Création d'une application Cordova avec Visual Studio. Déploiement puis debug sur un device ou émulateur.
4) Migrer une application Web en application native
- Application Web vs Application Native.
- Quel est l'effort à faire ?
- Rendre mon application responsive.
- Gestion du touch.
- Est-ce que l'on peut encapsuler un site Web ?
Travaux pratiques
Création d'une application Web. Encapsulation avec Cordova dans une application mobile. Déploiement sur
device ou émulateur.
5) Interagir avec le device
- Qu'est-ce qu'un plug-in ?
- Utilisation d'un plug-in Core.
page 100
- Utilisation d'un plug-in public.
- Développement d'un plug-in.
Travaux pratiques
Utilisation de plug-ins (accéder à la caméra...). Création d'un plug-in.
6) Pour aller plus loin
- Code spécifique par plateforme.
- Publier son application sur les stores.
- Quid des performances ?
- Utiliser AngularJS pour structurer son application Web.
- Utiliser TypeScript.
page 101
Réf : AMB
Participants
Développeurs web,
infographistes et web
designers.
Concevoir des applications mobiles performantes
Ce stage vous présentera les différentes techniques permettant de concevoir et d'optimiser des sites mobiles
adaptés aux différents formats de terminaux. Vous étudierez les règles d'ergonomie d'une interface, les
critères d'analyse technique de vos applications web pour optimiser leur execution et leur chargement.
Pré-requis
HTML, CSS et JavaScript.
Optimiser les performances graphiques
Optimiser les performances applicatives
Faire un audit de performance d'une application mobile
Eviter les pièges d'une ergonomie responsive
Donner de la visibilité à une application mobile
Prix 2017 : 1880€ HT
Dates des sessions
Paris
24 oct. 2016, 19 déc. 2016
27 fév. 2017, 22 mai 2017
28 aoû. 2017
1) Environnement de test
2) Optimisation de l'application
3) Design et device
4) Responsive design
5) Référencement et statistiques d'utilisation
6) Ergonomie tactile
7) Framework Web mobile
8) Design des publications numériques
Développement d'un site mobile Material Design, présentation d'applications existantes.
Exercice
Des exercices et études de cas basés sur la conception d'applications mobiles et tablettes.
1) Environnement de test
- Outils de tests mobile : gesture, performance réseau...
- Présentation de GoogleDevTools, pagespeed.
- Mesurer la performance d'une application.
- Construction de binaires avec Node.js/Phonegap.
- Outils de performance et de développement.
Exercice
Audit de performance, outils de tests.
2) Optimisation de l'application
- Optimiser le chargement des ressources, mode asynchrone et différé.
- Mise en place d'une stratégie de cache.
- Optimiser les ressources graphiques.
- Compression des CSS/JavaScript.
- CPU front end, back end. Les Webworker.
Exercice
Audit de performance. Optimiser les caches. Compression des ressources.
3) Design et device
- Définir un plan d'actions selon qualité du réseau.
- Détecter le changement d'orientation.
- Evènement périphérique : multitouch, orientation...
Exercice
Concevoir un design interactif selon des événements.
4) Responsive design
- Comment créer un responsive performant.
- Contenu fluide : multicolonne, découpage multipage.
- CSS3, viewport, media-queries.
- Composant graphique : indicateur de progression...
Exercice
Réaliser une page Responsive.
5) Référencement et statistiques d'utilisation
- Référencer une application sur le web, dans un store.
- Suivi statistique des usages, remontée d'anomalies.
6) Ergonomie tactile
page 102
- Critères d'ergonomie d'une interface tactile et des événements (touch, gesture...).
- Faire évoluer l'ergonomie et les fonctionnalités d'un site web vers le mobile.
- Différences entre les ergonomies mobiles et tablettes.
- Définition du contenu : page d'accueil, rédactionnel...
- Mode de navigation : fil d'ariane, menus de navigation...
Exercice
Analyse de projets web existants et études des design possibles.
7) Framework Web mobile
- Présentation des frameworks Web, natifs.
- Choisir un framework, impact sur la performance.
- Optimisation graphique Material Design.
Exercice
Réaliser un site mobile Material Design.
8) Design des publications numériques
- Format des publications. Livres iPad, KindlePad...
- Publication dans les bookstores.
Exercice
Réaliser un livre numérique avec Calibre.
page 103
Réf : IOC
Participants
Développeurs Web et chefs
de projets mobilité.
Pré-requis
des langages HTML,
CSS et JavaScript. La
maîtrise du Framework
AngularJS constitue un atout
supplémentaire.
Prix 2017 : 1600€ HT
Dates des sessions
Ionic, développer des applications mobiles hybrides
multiplateformes
New
Cette formation vous permettra de maîtriser le Framework et le SDK Ionic, basé sur AngularJS et Cordova.
Vous développerez des applications mobiles hybrides pour iPhone et Android proches des applications
natives. Outre la mise en œuvre des fonctionnalités, vous découvrirez les outils de productivité basés sur
Node.js.
Configurer un environnement de développement hybride
Développer une application mobile basée sur Ionic et AngularJS
Maîtriser les outils de productivité proposés par Node.js
Intégrer un Backend Mobile
Préparer le build et le déploiement d'une application
Paris
27 oct. 2016, 6 avr. 2017
29 juin 2017
1) Configurer un environnement de
développement moderne
2) Ionic SDK : présentation et mise en oeuvre
3) Ionic + AngularJS : initiation au Framework de
Google
4) Le Framework Ionic en profondeur
5) Gérer la persistance des données utilisateur
6) Préparer le "build" et le déploiement
Développement d'applications mobiles. 50% de théorie illustrée par 50% de pratique.
Travaux pratiques
Réalisation d'une application mobile "hybride" IOS/Android et compilation dans le Cloud.
1) Configurer un environnement de développement moderne
- Choix de l'éditeur, les Plug-ins indispensables.
- Socle des bonnes pratiques : mobile et "Web-platform".
- Node.js utilitaire de développement. Synchronisation "multi-device".
- Choisir et paramétrer un "workflow" mobile.
- Yeoman. Utiliser un "scaffoldeur" de projet.
Travaux pratiques
Configuration des outils.
2) Ionic SDK : présentation et mise en oeuvre
- Framework de développement "hybride", positionnement.
- Composantes : Utilitaires, CSS, JavaScript, Services.
- Technologies : services cloud, Cordova, le choix d'AngularJS.
- Démarrer, émuler et débugger une application.
- Apport du Framework CSS.
Travaux pratiques
Mise en œuvre d'un projet d'application.
3) Ionic + AngularJS : initiation au Framework de Google
- Structure d'une application AngularJS.
- Identifier les ressources : Services, Contrôleur, Directives.
- Ajax : consommation de services Web.
- SPA (Single Page Application) routes et navigation.
- Les directives apportées par Ionic.
- Utilisation indépendante du Framework CSS Ionic.
Démonstration
Structure d'une application AngularJS.
4) Le Framework Ionic en profondeur
- Personnalisation ciblée de la plateforme (IOS/Android).
- Gestion du contenu : listes, chargement, "scroll", "pull to refresh".
- Gestion de la navigation : menu, route et persistance.
- Composant interactifs : "modal, action sheet, popover"
- Créer des formulaires efficaces.
- Gestuelle utilisateur : "swipe, slide, tap...".
page 104
Travaux pratiques
Réalisation d'une application basée sur Ionic et AngularJS.
5) Gérer la persistance des données utilisateur
- Adopter une stratégie "offline first".
- Les API pour la sauvegarde locale : IndexDB localStorage.
- Centraliser les données : redéfinir le cycle UX.
- Quelles fonctionnalités attendre d'un Backend Mobile ?
- Les services d'authentification et de "push notification".
Travaux pratiques
Intégration d'un "Backend Cloud".
6) Préparer le "build" et le déploiement
- Automatiser la création des icônes et écrans de démarrage.
- Présentation des services de la "Ionic Platform".
- "Build" service de compilation.
- Cycle de déploiement continu.
Travaux pratiques
Préparation et déploiement de l'application.
page 105
Réf : PHG
Participants
Développeurs. Chefs de
projets.
Pré-requis
Il est important d'avoir une
expérience du développement
Web. Connaître le langage
Java et/ou Objective-C ainsi
que l'environnement Eclipse
et/ou XCODE est un plus.
PhoneGap, développer des applications mobiles
multiplateformes
OBJECTIFS
Le développement logiciel pour mobiles peut être complexe et fastidieux. Ce stage propose une méthode
basée sur HTML5 et le projet PhoneGap, un duo qui permet un déploiement identique aux applications
natives. Il vous apprendra tout le nécessaire pour mettre en œuvre vos applications avec ces technologies.
1) Applications Web sur mobiles
2) Technologies Web Client
3) Utilisation de HTML 5
4) Portage sur plateforme mobile
5) Introduction au projet PhoneGap
6) Utilisation de PhoneGap
Prix 2017 : 1880€ HT
Travaux pratiques
Tous les développements seront testés sur Smartphone mis à la disposition des participants. Les
environnements Android et IOS seront utilisés.
Dates des sessions
Paris
6 déc. 2016, 6 mar. 2017
6 juin 2017
1) Applications Web sur mobiles
- Possibilités offertes par ce modèle d'implémentation.
- Focus sur la librairie WebKit.
- Introduction aux technologies Web Apps.
Démonstration
Exemples de Web Apps.
2) Technologies Web Client
- JavaScript, la structure du langage.
- Les concepts Objet et JavaScript. Utilisation de FireBug.
- CSS version 3. Concepts et propriétés.
- Mise en œuvre de CSS via des exemples.
- HTML/DOM. Comprendre la structure d'un document.
- Librairies graphiques. L'exemple de Jquery.
- Le concept Ajax. Contraintes de sécurité d'exécution.
- Le module XmlHTTPRequest.
Travaux pratiques
Manipulation des différentes technologies dans le cadre de développement d'applications pour mobiles.
3) Utilisation de HTML 5
- Comment utiliser l'API de stockage ?
- La gestion Offline. La synchronisation des données.
- La concurrence de traitement.
- Le dessin via le Canvas. La gestion son/vidéo.
- Les nouveaux éléments de formulaire.
Travaux pratiques
Développement d'une application avec HTML5.
4) Portage sur plateforme mobile
- Les limitations des applications Web sur un navigateur de plateforme mobile. Comment les gérer ?
- Utilisation des debuggers Web.
- Les librairies graphiques mobiles. Jquery.
- Utilisation des écrans tactiles des plateformes mobiles.
- Evénements pour la gestion des gestes en JavaScript.
- Rendre une application Web native et déployable dans les stores (App Store et Market place).
Travaux pratiques
Mise au point d'une Web App pour mobile. Utilisation des API et outils présentés dans le chapitre.
5) Introduction au projet PhoneGap
- Présentation de l'architecture des applications.
- Introduction à PhoneGap.
- Installation de PhoneGap. Pour Android. Pour IOS.
Travaux pratiques
Prise en main de PhoneGap. Création d'un projet.
6) Utilisation de PhoneGap
page 106
- Accès aux spécificités des plateformes mobiles.
- Les dispositifs hardware natifs : accéléromètre, GPS, magnétomètre, appareil photo/vidéo, etc.
- Création d'un plugin PhoneGap.
- Comment étendre JavaScript ?
- Focus sur le développement natif pour les plateformes.
- Test dans les environnements respectifs. Simulateurs Android et IOS.
Travaux pratiques
Mise en œuvre de certaines spécificités de la plateforme mobile dans l'application développée. Création d'un
plugin PhoneGap.
page 107
Réf : UER
Participants
Développeurs, chefs de
projets mobilité, webmasters,
designers.
Pré-requis
HTML et du JavaScript.
JQuery Mobile Framework, développer des applications
pour mobiles
Vous apprendrez dans ce stage à utiliser le framework jQuery Mobile pour développer des applications
pour mobiles, tablettes et Smartphones. Dans une approche multicanale et Responsive Design, vous verrez
comment tirer parti de ses fonctionnalités pour créer des sites Web et des applications mobiles de qualité.
Concevoir des applications multicanales responsive.
Installer et configurer l'environnement de développement jQuery Mobile.
Mettre en oeuvre les différents composants graphiques pour concevoir des interfaces web mobile.
Créer et personnaliser les thèmes de vos applications.
Gérer les multiples événements permettant d'interagir avec l'utilisateur.
Assurer le chargement et la persistance de vos données.
1) Présentation de jQuery Mobile
2) L'ergonomie et les spécificités mobiles
3) Les thèmes jQuery Mobile
4) Les types de pages
5) Les composants graphiques
6) Les formulaires
7) Les API jQuery
1) Présentation de jQuery Mobile
- Présentation et rappels jQuery.
- jQuery Mobile vs autres frameworks du marché.
- Présentation HTML5, Ajax.
- Présentation de sites réalisés avec le framework.
- Présentation de l'éditeur Codiqa.
Travaux pratiques
Mise en oeuvre des éditeurs et préparation de l'environnement de développement.
2) L'ergonomie et les spécificités mobiles
- Environnements de test multi-devices.
- Approche design pour les approches tactiles.
- Performances et contraintes spécifiques.
Travaux pratiques
Test de performance et présentation des types de composants.
3) Les thèmes jQuery Mobile
- Utilisation de l'éditeur de thème.
- Import, export, migration d'un thème personnalisé.
- Personnalisation d'un thème.
Travaux pratiques
Création de multiples thèmes et intégration au projet jQuery.
4) Les types de pages
- Structure d'une page jQuery.
- Modes de transition entre les pages, gestion du cache.
- Boîtes de dialogue. Navigation entre les pages.
- Les liens internes, externes.
Travaux pratiques
Mise en oeuvre des types de pages et navigation entre les pages.
5) Les composants graphiques
- Les boutons : lien bouton, bouton inline, personnalisé avec icône, groupe de boutons.
- Barre d'en-tête : boutons de navigation, titre, images.
- Barre de bas de page : icônes, barre de navigation.
- Listes simples, numérotées, personnalisées (icône, texte, etc.), autosuggest, liste avec filtre de recherche.
Travaux pratiques
Mise en oeuvre des différents composants, chargement Ajax à partir d'une base de données.
6) Les formulaires
- Text input, ranges, calendriers, formulaires de recherche, formats standard.
- Sliders, liste dynamique, boutons radio, cases à cocher.
page 108
- Envoi du formulaire et contrôle du formulaire.
Travaux pratiques
Création d'un formulaire complet et envoi vers un serveur.
7) Les API jQuery
- Gestion des événements (chargement des pages, binding, etc.). Appels Ajax.
- Paramétrage de navigation (Slide, Flip, etc.).
- Méthodes de stockage et passage d'arguments entre pages. L'objet $.mobile.
Travaux pratiques
Gestion des multiples événements et solutions de stockage.
page 109
Réf : SEU
Participants
projets.
Pré-requis
du langage JavaScript et
des technologies Web.
Bonnes connaissances de la
programmation orientée objet.
Sencha Touch 2, développer des applications mobiles
multiplateformes
Ce stage vous permettra de prendre en main la bibliothèque Sencha Touch 2 permettant de concevoir
des applications mobiles cross-platform. Vous installerez Sencha Touch et son environnement, mettrez en
œuvre ses composants graphiques, créerez vos propres composants, élaborerez vos thèmes et gérerez vos
données.
Maîtriser les concepts fondamentaux de Sencha Touch 2
Développer des applications mobiles riches avec Sencha Touch 2
Packager une application Sencha Touch 2 dans une application native
3) Le modèle MVC
6) Thèmes
7) Utilisation des API natives
- Vue d'ensemble du framework Sencha Touch.
- L'environnement : Sencha Cmd. Exécuter et Débugger une application. État des lieux des solutions de Test.
Documentation.
- Structure d'une application Sencha Touch, le modèle MVC.
- Responsive Design vs Adaptive Design.
Travaux pratiques
Installation de Sencha Touch et de son environnement. Création d'un espace de travail. Création du
squelette d'une application MVC avec Sencha Cmd.
- Instanciation d'un objet : procédurale vs déclarative, Ext.create() vs new.
- La gestion du DOM.
- Les éléments de base : composants, conteneurs et événements. Le système de classes.
- Les objets "Toolbars" et "Button". Comprendre les "Layouts". Les fenêtres.
Travaux pratiques
Créer des composants personnalisés. Créer des boutons et des fenêtres.
3) Le modèle MVC
- Concepts du modèle. Le Contrôleur.
- Les dépendances : requires, controllers, views, models et stores.
- Références aux composants : ComponentQuery.
- Envoi d'événements personnalisés.
Travaux pratiques
Définition et utilisation d'un Contrôleur. Envoi d'événements personnalisés.
- L'ensemble des données : Models, Proxies, Stores.
- Envoi et réception de données : requêtes et réponses HTTP, Ajax/JsonP.
Travaux pratiques
Gérer les données.
- Liste : le composant Ext.List, XTemplate...
- Vue de navigation : Ext.NavigationView, bouton retour...
- Les Arbres : nœud racine/enfants, TreeStore, Proxy...
- Formulaires : l'objet de soumission, les champs, mise en page, soumission, validation, chargement.
Travaux pratiques
Mise en place de liste, vue de navigation d'arbres et de formulaires.
6) Thèmes
- Thèmes par défaut. Créer des thèmes personnalisés.
- Modifier les CSS et les thèmes avec Sass et Compass.
page 110
Travaux pratiques
Modifier le thème de l'application.
7) Utilisation des API natives
- Les applications hybrides : Build de l'application pour iOS, Android...
- API natives : Camera, notification, gyroscope...
Travaux pratiques
Utilisation de l'API Device.
page 111
Réf : FLX
Participants
Cette formation pratique
s'adresse aux développeurs
de sites, informaticiens,
designers.
Pré-requis
en programmation et en
développement Web.
Flex et ActionScript 3.0, programmation d'interfaces Web
OBJECTIFS
Vous apprendrez dans ce cours à développer des applications internet riches (RIA) à partir de la
plateforme Flex. Vous découvrirez son modèle de programmation basé sur MXML et Actionscript 3.0. Vous
développerez des interfaces graphiques interactives utilisant des données XML et des services Web.
1) Présentation de Flex 4
2) Le langage Actionscript 3.0
3) Langage MXML
4) Les contrôles et les conteneurs
5) Les formulaires
6) Styles
7) Accès aux données
8) Graphiques
Prix 2017 : 2440€ HT
Dates des sessions
Paris
15 nov. 2016, 14 mar. 2017
16 mai 2017, 25 juil. 2017
1) Présentation de Flex 4
- Présentation de Flex builder.
- Intégration dans une architecture J2EE ou .Net.
- Le lecteur Flash 10. Concept DisplayObject.
- Présentation d'Adobe Catalyst pour le design Flex.
Travaux pratiques
Création d'un projet et mise en oeuvre du débogueur.
2) Le langage Actionscript 3.0
- Rappels XML : modèle, schéma de validation...
- Spécificités Actionscript 3.0 et Ecmascript XML (E4X).
- Variables et opérateurs.
- Création de package et de classes.
Travaux pratiques
Prise en main Actionscript 3.0.
3) Langage MXML
- Structure d'une application Flex : blocs script, Model...
- La gestion des événements : propagation, trois phases.
Travaux pratiques
Programmation d'événements : clic sur un bouton, changement d'état...
4) Les contrôles et les conteneurs
- Architecture des composants graphiques.
- Propriétés spatiales, styles, paramétrages, ViewState.
- Les conteneurs ApplicationControlBar, TitleWindow...
- Les composants moduleLoader et Repeater.
- Les contrôles de navigation List, LinkButton, PopUpButton, PopUpMenuButton.
- Les conteneurs de navigation Accordion, ViewStack...
Travaux pratiques
Création de boutons multi-états, datagrid personnalisés. Construction dynamique de zones graphiques à
partir de Repeater. Mise en oeuvre de barres de menus, onglets, boutons dynamiques vers le Web.
5) Les formulaires
- Composants de saisie : texte, boutons radio, menus...
- Contrôles de saisie : dateFormator.
- Envoi du formulaire.
Travaux pratiques
Création de formulaires de login, contrôles de saisie de fiches produits.
6) Styles
- Design des composants : thèmes, styles, fonts.
- Effets et transitions : rotation, séquence, parallèle.
- Construction graphique avec Adobe Catalyst.
Travaux pratiques
Mise en pratique de multiples effets.
- Accès aux Web services. Echanges RPC et Soap.
page 112
- Le gestionnaire de données sous Flex4.
Travaux pratiques
Appel de service Web, appel d'URL, création de ShareObject.
8) Graphiques
- Mise en oeuvre de graphismes : pie, plot, bar, line,...
- Raccordement entre données et graphismes.
Travaux pratiques
Création de graphiques.
page 113
Réf : DJA
Participants
La formation est destinée
aux développeurs souhaitant
acquérir une connaissance
approfondie des bases du
framework Django.
Pré-requis
Connaissances des bases
du langage Python et
technologies Web (HTML,
JavaScript...)
Prix 2017 : 2440€ HT
Dates des sessions
Paris
22 nov. 2016, 14 mar. 2017
9 mai 2017, 25 juil. 2017
Django, développement Web avec Python
OBJECTIFS
Django est un framework Web MVC (Modèle-Vue-Contrôleur) basé sur le langage Python. Ce stage vous
apprendra à mettre en oeuvre ce framework et à utiliser avec efficacité ses différents modules dans le cadre
du développement d'applications Web.
1) Introduction
2) L'accès aux données avec Django
3) Gestion des vues
4) Les templates
5) Gestion des formulaires
6) Fonctions avancées
1) Introduction
- Rappel des principes de la POO.
- Le Design Pattern MVC.
- Présentation du framework Django.
- Origine et historique. Objectifs et avantages.
- Les composants de framework Django.
Exercice
Préparation de l'environnement. Installation de Python, Django, Serveur Apache, MySQL et Eclipse. Création
d'un nouveau projet.
2) L'accès aux données avec Django
- Le modèle ORM Django.
- Les modèles Django : Model, Field, Table, Column, Primary Key...
- Mapping des associations : OneToMany, ManyToOne, ManyToMany, OneToOne.
- Stratégies de mapping de l'héritage : Meta Class, OneToOneField, ManyToManyField...
- Accès aux données avec les QuerySets.
Exercice
Développer une couche d'accès aux données. Interfacer Django avec MySQL.
3) Gestion des vues
- Vues simples ou fonctions vues.
- Les classes HttpResponse, HttpRequest et QueryDict.
- Configuration des URL : UrlConf.
- Vues génériques.
- Exemples de vues génériques : Redirects, Create, Update, Delete...
Exercice
Développer des vues dynamiques HTML avec Django.
4) Les templates
- Le rôle des templates.
- Création et chargement des templates.
- Gestion des contextes.
- Utilisation des tags et filtres personnalisés.
- Réutilisation des templates : héritage entre templates.
Exercice
Développer un template pour faciliter la génération de la présentation.
5) Gestion des formulaires
- Les avantages des formulaires Django.
- Création des formulaires.
- Les différents types de champs.
- Validation des données d'un formulaire.
- Gestion et personnalisation des messages d'erreurs.
- Génération des formulaires à partir des modèles.
Exercice
Développer les formulaires associés aux opérations CRUD de l'atelier précédent.
6) Fonctions avancées
- L'internationalisation.
- L'authentification et la gestion des sessions.
- Optimisation et caches.
- Intégration d'Ajax.
page 114
- L'interface d'administration.
- Les tests unitaires.
Exercice
Intégrer Ajax à travers le framework JQuery.
page 115
Réf : WEB
Participants
Cette formation pratique
s'adresse aux futurs
développeurs WebDev
souhaitant réaliser des sites
dynamiques Internet ou
Intranet.
Pré-requis
Connaissances de
base du HTML et de la
programmation.
Webdev, développement Web
OBJECTIFS
Ce stage vous montrera comment réaliser un site web dynamique à l'aide de WebDev. Vous verrez comment
utiliser les fonctions courantes de l'environnement logiciel, créer vos IHMs, utiliser des bases de données et
déployer vos applications sur un serveur Web.
1) Concepts de base
3) Le code
4) Gestion de l'IHM
5) Pages pour l'impression
6) Créer le dossier du site
7) Déploiement de l'application
Travaux pratiques
Prise en main de l'environnement, la bonne méthode de création d'un nouveau projet WebDev.
1) Concepts de base
- Qu'est-ce qu'un site Web dynamique.
- L'environnement de développement.
- L'éditeur graphique.
- L'éditeur de code.
- Etapes de création d'un nouveau projet.
- Créer une base de données HYPERFILE.
- Se connecter à une base de données SQL Server, MySQL ou Oracle.
- Création de l'application à l'aide du RAD.
- Ajouter, supprimer, modifier des données automatiquement.
Travaux pratiques
Réalisation d'une base de données catalogue.de produits
3) Le code
- Le WDLANGAGE (Variables, procédure, fonctions, boucles...)
- Code coté client.
- Code côté serveur.
- Accéder aux données par le code.
Travaux pratiques
Création de pages personnalisés.
4) Gestion de l'IHM
- Apparence des pages.
- Création et utilisation de modèles.
- Les différents objets des pages.
- Réalisation de menus.
Travaux pratiques
Réalisation d'un IHM via le RAD, et ajout de pages spécifiques.
5) Pages pour l'impression
- L'éditeur d'état.
- Les différents états (Lié aux données, libres ...).
- Composition d'un état WEBDEV (entêtes, corps, pieds...).
- Les objets à disposition (différents types de champs).
- Les options d'impression.
- Génération d'impression HTML et PDF.
Travaux pratiques
Génération d'état pour l'impression, au format HTML et PDF.
6) Créer le dossier du site
- Importance de ce dossier.
- Génération du dossier (pages, états, code sources).
Travaux pratiques
Bien organiser ses dossiers de projet, créer la documentation de l'application.
page 116
7) Déploiement de l'application
- Génération de l'application.
- Génération de la procédure d'installation.
- Déploiement.
Travaux pratiques
Créer le programme d'installation et installation d'un programme
page 117
Réf : RUR
Participants
Programmeurs, développeurs
Web et Webmasters désirant
concevoir des sites Internet
professionnels orientés Web
Services.
Pré-requis
d'HTML, de JavaScript, d'un
langage de développement
côté serveur et en
administration d'un serveur
Web.
RUBY On Rails 4, développement Web
Ce stage vous apprendra à maîtriser le framework Ruby On Rails 4 pour développer vos applications
Web. Vous verrez comment tirer parti de la simplicité et de la rapidité d'utilisation de Rails 4 pour créer des
applications riches et évolutives en utilisant le modèle MVC et les connecter à des Services Web.
Maîtriser le développement d'applications Web évoluées à l'aide du framework Ruby On Rails 4
Maîtriser l'architecture RESTful, le design pattern MVC
Dynamiser une application Web y en intégrant les librairies JQuery et CoffeeScript
Appliquer le développement dirigé par les tests à un développement Ruby On Rails 4
1) Introduction
2) Préparer son environnement de travail
3) Programmer en Ruby
4) Découverte de Rails
5) Notions avancées de Rails
6) Tests et versioning
7) Migration vers Rails 4
1) Introduction
- Rappel Internet, HTML et CSS, XML, JSON, YAML.
- Design Pattern MVC.
- Les hébergeurs Rails.
2) Préparer son environnement de travail
- Environnement de travail (interpréteur Ruby).
- Préparer le dossier de travail.
- Les outils en ligne de commande.
- Installer les outils de développement.
Travaux pratiques
Installation de l'environnement.
3) Programmer en Ruby
- Rappel objet (modules, classes, instances, UML...).
- Conventions de nommage de Rails.
- Syntaxe Ruby (module, classe, portée, méthodes...).
- Aides Ruby (RI, Rubycore, inspect).
Travaux pratiques
Réaliser un premier programme.
4) Découverte de Rails
- Architecture Rails (ActiveRecord, ActiveModel, ORM, ActionVue, ActionController, routage des requêtes...).
- Préparer une maquette HTML/CSS dans le respect des normes (XHTML/WCAG 2).
- Créer un contrôleur de pages statiques.
- Etablir des modèles de pages (application/contrôleur).
- Mise en place de scripts de vues ERB, RHTML, HAML, Liquid, SASS, SCSS, RJS, CoffeeScript, RXML.
- Utiliser des assistants de pagination. Gestion des gems dans l'application.
- Placer des ressources partagées.
- Paramétrage de la BDD (database.yml), création et "migration" d'une base de données.
Travaux pratiques
Réaliser une application avec Rails.
5) Notions avancées de Rails
- Le CRUD, RESTFul Web Services, ActiveRecord et le routage orienté ressources, routage avancé des
requêtes.
- Les migrations d'ActiveRecord. Les transactions.
- Les formulaires Rails (form_for...). Les filtres.
- Internationaliser "i18n". Intégrer l'UNICODE côté client et côté serveur.
- Gérer les sessions, les Cookies et le cache.
- Protéger et sécuriser ses pages côté client et serveur.
- Débogue, la console iRb, les points d'arrêt.
- Dynamiser son site avec Ajax, JQuery et CoffeeScript.
Travaux pratiques
Ecriture de formulaires. Intégration de JQuery et CoffeeScript dans les développements.
page 118
6) Tests et versioning
- Le TDD (Test Driven Development).
- Rails Tests et RSpec.
- Gérer les versions avec GIT.
Travaux pratiques
Application du TDD. Gestion des sources avec GIT.
7) Migration vers Rails 4
- Les fonctionnalités de Rails converties en gems.
- Utilitaire de migration.
Travaux pratiques
Migrer une application Rails 3.
page 119
Réf : APJ
Participants
Développeurs, architectes et
chefs de projets.
Pré-requis
Java ainsi que des bases du
Web : HTTP, HTML, CSS,
JavaScript.
Prix 2017 : 2610€ HT
Dates des sessions
Paris
24 oct. 2016, 21 nov. 2016
19 déc. 2016, 6 fév. 2017
10 avr. 2017, 12 juin 2017
28 aoû. 2017
Aix
27 mar. 2017, 29 mai 2017
Bordeaux
Java EE 7, conception et développement d'applications
Web
Best
La plateforme Java EE 7 améliore de manière significative la productivité des développeurs et offre une
meilleure intégration du HTML 5. Cette formation vous permettra de développer des applications d'entreprise
en vous basant sur les API Java EE 7: JPA, JMS, CDI, EJB, JSF, JAX-RS et WebSocket.
Concevoir et développer une application n-tiers basée sur les spécifications Java JEE 7
Mettre en place une couche d'accès aux données avec JPA.
Mettre en place une architecture distribuée avec EJB et JMS
Mettre en place une couche de présentation avec JSF et Ajax
Développer et consommer des webservice REST
Mettre en place un canal de communication entre un navigateur HTML5 et un serveur via les Websockets
1) Introduction
2) Environnement de travail
3) Découpage n-tiers et injection de
dépendances
4) Accès aux données avec JPA
5) Architecture distribuée avec EJB et JMS
6) Web et JSF
7) Web Services REST
8) Websockets
20 mar. 2017, 15 mai 2017
Bruxelles
12 déc. 2016, 13 mar. 2017
12 juin 2017
Un exercice "fil rouge" sera déroulé. Les différents modules seront validés par des tests unitaires (lancé avec
le conteneur embarqué) et seront déployés sur un serveur d'application Java EE 7.
Geneve
12 déc. 2016, 13 mar. 2017
12 juin 2017
1) Introduction
Grenoble
20 mar. 2017, 15 mai 2017
Lille
27 mar. 2017, 29 mai 2017
Luxembourg
- Briques de la spécification Java EE 7.
- Bonnes pratiques de conception : séparation des responsabilités, KISS, DRY, POJO.
- Nouveautés par rapport à la version 6.
- Panorama de l'offre Java EE, le framework Spring.
12 déc. 2016, 13 mar. 2017
12 juin 2017
2) Environnement de travail
Lyon
- Environnement Eclipse. Dépendances Maven.
- Tests unitaires avec le conteneur embarqué.
- Utilisation des webtools, prise en main du serveur.
20 mar. 2017, 15 mai 2017
Montpellier
27 mar. 2017, 29 mai 2017
Nantes
27 mar. 2017, 29 mai 2017
Rennes
27 mar. 2017, 29 mai 2017
Sophia-antipolis
27 mar. 2017, 29 mai 2017
Strasbourg
27 mar. 2017, 29 mai 2017
Toulouse
20 mar. 2017, 15 mai 2017
Travaux pratiques
Installer l'IDE et le serveur.
3) Découpage n-tiers et injection de dépendances
- Découpage en couche, approche POJO.
- Scopes et gestion de l'état.
- Injection de dépendances.
- Intercepteurs.
Travaux pratiques
Mise en place d'une application n-tiers, utilisation de CDI (injection de dépendance...).
4) Accès aux données avec JPA
- Mapping objet relationnel (xml, annnotations).
- Lazy loading.
- Manipulation de l'API 2.1 : EntityManager...
- JPA-QL, API Criteria, MetaModel, EntityGraph.
- Transactions, l'annotation @Transactional JTA 1.2.
Travaux pratiques
Mise en place de la couche d'accès aux données.
5) Architecture distribuée avec EJB et JMS
- Services techniques de l'API EJB : sécurité, remoting, accès concurrents, accès asynchrones, timers.
- Positionnement des EJB par rapport aux beans CDI.
- JMS 2.0 pour les échanges de messages.
Travaux pratiques
Mise en place de services avec les EJB Sessions et d'un bus d'échange de messages avec JMS.
page 120
6) Web et JSF
- Concepts (MVP, Presenter, View).
- Facelets, taglibs, jsf-el.
- Validation JSR303.
- Mise en oeuvre d'Ajax.
Travaux pratiques
Mise en oeuvre de JSF 2.2 et d'Ajax.
7) Web Services REST
- API JAX-RS 2.0 pour les services web RESTful.
- Rappels HTTP : les verbes, les contentType...
- CORS : Cross origin shared ressource. HATEOAS.
- Produire et consommer des objets via l'API Java de traitement JSON.
Travaux pratiques
Exposant des services, consommer ces services REST via un client web (AngularJS).
8) Websockets
- Concepts du web "real time".
- Support par les navigateurs, mécanismes de fallback.
- Mise en place côté serveur et client.
Travaux pratiques
Ajout d'une connexion websocket au client web.
page 121
Réf : APP
Participants
Informaticiens souhaitant
développer des applications
Web avec les technologies
Java/Java EE.
Pré-requis
langage Java 5 ou 6 et des
technologies Web. Expérience
requise en programmation
Java. Connaissance du
langage HTML préférable.
Prix 2016 : 2560€ HT
Dates des sessions
Java, développement de Servlets et JSP pour JEE 6
Ce cours vous apprendra développer des applications Web d'entreprise basées sur la plateforme Java EE
6. Vous verrez comment mettre en oeuvre des solutions robustes et facilement extensibles, notamment au
moyen des architectures MVC et de l'environnement JSF.
Maîtriser l'architecture des applications Java EE
Développer une couche présentation basée sur des JSP, des librairies de balises et JSF
Développer des composants de contrôle et de navigation basés sur des servlets
Gérer l'accès à une base de données
Sécuriser une application Java EE
1) Rappel sur les applications Web d'entreprise
2) Architecture des applications Java Web
3) Pages JSP : composants de présentation
4) API Servlet 3.0 : composants de contrôle et de
navigation
6) JSF 2
7) Sécurisation des applications Web
Travaux pratiques
Paris
24 oct. 2016, 12 déc. 2016
Développement d'une application Web en Java. Utilisation du conteneur de Servlet/JSP, Tomcat.
Environnement de développement Eclipse ou NetBeans.
1) Rappel sur les applications Web d'entreprise
- Serveur et client Web. Protocoles applicatifs (HTTP). Gestion des sessions. Accès aux bases de données.
- La plateforme Java EE. Architecture multitiers.
2) Architecture des applications Java Web
- Serveur applicatif, notion de conteneur. Modèle MVC.
- Principaux composants : Servlets, pages JSP, JSF.
- Architecture du conteneur Web Tomcat.
- Déploiement et packaging des applications JEE. Le fichier web.xml. Notion de pluggability.
Travaux pratiques
Installer un environnement de développement. Déployer une application.
3) Pages JSP : composants de présentation
- Technique de développement. Les Scriplets.
- Utilisation de JavaBeans à partir de pages JSP.
- Expression Language (EL).
- Principe des librairies et extensions de balises.
- Présentation de la JSTL.
Travaux pratiques
Développer la couche présentation (JSP, JSTL et librairies de balises).
4) API Servlet 3.0 : composants de contrôle et de navigation
- Conteneur de servlets. Cycle de vie d'une servlet. L'annotation WebServlet. Gestion des formulaires HTML.
- Filtrage des requêtes/réponses. Invocation d'autres ressources Web.
- Gestion des erreurs et journalisation des événements.
- Suivi de session. Les différentes méthodes.
Travaux pratiques
Développement de servlets.
- Mise en place de la base et de l'interface JDBC. Connexion à la base, requêtes.
- Transaction. Pool de connexions. Les DataSources. L'annotation Ressource.
- Correspondance BDR/Modèles objet : l'API JPA.
Travaux pratiques
Présenter des données issues d'un SGBDR dans l'application.
6) JSF 2
- Présentation du framework. Composants essentiels.
- Cycle de vie du traitement d'une page JSF. Les composants UI. Facelets.
- La Servlet « FacesServlet ». Notion de FacesContext.
page 122
- Mise en œuvre des Managed Beans. Définir la navigation entre pages. Convertir et valider des données.
Travaux pratiques
Adapter l'application à JSF 2.
7) Sécurisation des applications Web
- Notions de users, realms, roles. Authentification et autorisation.
- Sécurité et programmation de servlets.
- Installer et configurer SSL. Certificats numériques.
- L'API JAAS. Les annotations spécifiques.
Travaux pratiques
Sécuriser l'accès à l'application.
page 123
Réf : JSF
Participants
projets.
Pré-requis
Connaissance du langage
Java. La connaissance de la
plate-forme Java EE est un
plus, mais non indispensable.
Framework JSF 2, développer des applications Web
Ce cours vous permettra de prendre en main les composants JSF 2 afin de construire des solutions Web
facilement extensibles. Il propose, entre autres, une introduction au développement Server Side Scripting.
Maîtriser le cycle de vie d'une requête JSF 2
Utiliser les composants graphiques JSF 2 et gérer les événements sur ces composants
Définir et utiliser des beans managés
Configurer une application JSF
Utiliser des composants Ajax dans JSF 2
Prix 2017 : 1960€ HT
Dates des sessions
Paris
7 nov. 2016, 6 mar. 2017
29 mai 2017
1) Premiers pas avec JSF
2) Concepts JSF
3) Définir et utiliser des ManagedBeans
4) Composants standards
5) Configurer une application JSF
6) Compléments
7) Facelets et Ajax
Travaux pratiques
Le conteneur de Servlet/JSP utilisé est Tomcat ou GlassFish. L'environnement de développement utilisé est
Eclipse ou Netbeans.
1) Premiers pas avec JSF
- Rappels : Servlet, JSP, MVC 2. Frameworks du marché.
- Compatibilité entre JSF 1 et JSF 2.
- Configurer l'application Web. Configurer JSF.
- Créer un backing-bean et un formulaire.
- Configuration simplifiée avec JSF 2.0.
Travaux pratiques
Première application JSF.
2) Concepts JSF
- Composants graphiques. Représentation côté client et serveur. Arbre de composants.
- Cycle de traitement d'une requête.
- Validation des données saisies.
- Backing beans et beans managés.
- Ajouter un listener. Evénements.
- Afficher des messages. Naviguer entre les pages.
- Langage d'expression (EL).
3) Définir et utiliser des ManagedBeans
- Utiliser les annotations JSF 2.
- La notion de scope et le lien avec les concepts de request, session, application.
- L'injection de dépendances (autres beans, ejb...).
- Affecter des propriétés à partir de données saisies.
- Définir des méthodes de navigation statique ou dynamique.
Travaux pratiques
Saisie de données via un formulaire, affectation d'un bean à l'aide des informations saisies.
4) Composants standards
- Les familles de composants. Les propriétés.
- Vue racine. Paramètres. Sorties formatées.
- Images. Formulaires. Saisies simples. Panneaux.
Travaux pratiques
Créer un formulaire de recherche. Afficher les résultats dans un Datatable.
5) Configurer une application JSF
- Archive Web. Configurer web.xml.
- Déclarer la Servlet JSF. Structure du fichier de configuration JSF.
- Configurer les backing beans et la navigation à l'aide du fichier faces-config.xml.
Travaux pratiques
Faire coopérer des backing beans.
6) Compléments
page 124
- Afficher des messages utilisateur.
- Conversion et validation des données.
- Principe. Converters et validators standards et personnalisés avec un backing bean.
- Internationalisation. La classe locale. Configuration.
Travaux pratiques
Ajouter des contraintes de validation à un formulaire.
7) Facelets et Ajax
- Présentation de Facelets. Gérer des layouts.
- Présentation de composants Ajax. Le tag <f:ajax>.
Travaux pratiques
Définition d'une nouvelle classe de composant. Usage de composants Ajax dans JSF.
page 125
Réf : SRB
Participants
Développeurs Java impliqués
dans le développement d'une
couche de présentation Web.
Struts 2, développer des applications Web MVC
Ce cours vise à fournir une compréhension globale du framework Struts 2 vous permettant d'exploiter
ses possibilités dans le cadre d'un développement Web. Les éléments d'architecture seront abordés
théoriquement puis mis en oeuvre dans le cadre de la migration d'une application Servlet/Jsp en Struts2.
Pré-requis
Expérience requise en
programmation Servlet et
JSP.
Maîtriser les composants d'architecture Struts 2 (contrôleur, actions, intercepteurs...)
Accéder aux objets Java avec OGNL
Construire la couche de présentation à l'aide de la taglib Struts 2
Concevoir un formulaire avec validation
Implémenter un modèle CRUD
Internationaliser une application
Prix 2017 : 2440€ HT
Dates des sessions
Paris
15 nov. 2016, 14 mar. 2017
6 juin 2017
1) Rappels et compléments sur l'API Servlet
2) Présentation du framework Struts 2
3) Le "front Controller" de Struts 2
4) La pile d'objets et langage d'expressions
OGNL
5) Les classes d'actions Struts 2
6) La librairie de tags "struts-tags"
7) L'approche "Model Driven"
8) Compléments
Travaux pratiques
Les exercices ont été conçus pour illustrer tous les éléments du framework et leur mise en oeuvre dans le
cadre d'un développement industriel.
1) Rappels et compléments sur l'API Servlet
- Rappel sur les mécanismes de base de l'API Servlet/JSP.
Travaux pratiques
Appropriation d'une application Web développée en Servlet/JSP, fil directeur pour la migration.
2) Présentation du framework Struts 2
- Principales caractéristiques de Struts 1.
- Principales caractéristiques de Struts 2.
- Les constituants de base d'une application Struts 2.
Travaux pratiques
Configurer un projet Eclipse pour un développement Struts 2 (librairie et fichier web.xml). Implémenter une
fonctionnalité d'authentification.
3) Le "front Controller" de Struts 2
- Les fichiers de configuration : struts.xml...
- Le rôle de la classe FilterDispatcher.
- Rôle des intercepteurs, règles de configuration.
- L'intercepteur ServletConfigInterceptor.
- Création de ses propres intercepteurs.
- Contexte d'exécution d'une action : l'ActionContext.
Travaux pratiques
Intégrer la fonctionnalité d'authentification Struts 2 au projet d'origine sans régression. Tracer le temps de
traitement en utilisant l'intercepteur "TimeInterceptor".
4) La pile d'objets et langage d'expressions OGNL
- Rôles de la pile d'objets et du langage OGNL.
- Organisation de la pile d'objets et positionnement dans l'ActionContext.
5) Les classes d'actions Struts 2
- Les différentes classes d'action.
- Mapping des paramètres des requêtes sur les propriétés de l'action.
- Traitement des exceptions.
Travaux pratiques
Traiter toutes les "RuntimeException" et les erreurs d'authentification au niveau de l'action. Utiliser OGNL.
6) La librairie de tags "struts-tags"
- Organisation de la librairie de tags.
- Les control-tags, les data tags et les form-ui-tags.
- Traitement d'un upload de fichier.
page 126
7) L'approche "Model Driven"
- Implémentation du modèle CRUD en Struts 2.
8) Compléments
- Internationalisation d'une application Struts 2.
- Les techniques de validation de Struts 2.
- Les balises actionerror, fielderror et actionmessage.
- Utilisation du framework Tiles.
- Le fichier de configuration "tiles.xml".
- Intégration de Tiles à Struts 2.
Travaux pratiques
Externaliser les libellés des actions et des JSP dans des fichiers de propriétés.
page 127
Réf : GWT
Participants
projets.
Pré-requis
Bonnes connaissances des
langages Java et JavaScript.
Expérience souhaitable en
programmation Java/Web.
Prix 2017 : 1960€ HT
Dates des sessions
Paris
21 nov. 2016, 6 fév. 2017
2 mai 2017
Aix
12 déc. 2016
Développer une application Web 2.0/GWT
le Google Web Toolkit
Ce cours a pour objectif de présenter le Google Web Toolkit (GWT) en tant que solution pour la mise au point
d'applications Web riches basées sur Ajax. Il détaille le modèle applicatif et les mécanismes de base de GWT
qui sont nécessaires à la réalisation d'applications plus ergonomiques et plus réactives.
Créer des interfaces web riches et ergonomiques avec les composants GWT
Mettre en œuvre une communication client-serveur avec GWT
Intégrer GWT dans une architecture existante
Tester une application GWT
Analyser les performances d'une application GWT
1) Présentation
2) La bibliothèque de composants graphiques
3) JavaScript Native Interface et composants
personnalisés
4) Accès au serveur
5) Concepts GWT avancés
6) Implémenter une politique de tests
7) Considérations architecturales
8) L'écosystème GWT
Bordeaux
12 déc. 2016
Grenoble
12 déc. 2016
Lille
12 déc. 2016
Lyon
12 déc. 2016
Montpellier
12 déc. 2016
Nantes
12 déc. 2016
Rennes
12 déc. 2016
Sophia-antipolis
12 déc. 2016
Strasbourg
12 déc. 2016
Toulouse
12 déc. 2016
1) Présentation
- Présentation du Web 2.0 et des technologies Ajax.
- Mécanismes de Google Web Toolkit.
- Utilisation sur Chrome du Super Dev Mode.
Travaux pratiques
Créer un projet GWT sous Eclipse.
2) La bibliothèque de composants graphiques
- Utilisation de l'API et des composants de base.
- Construction d'écrans à l'aide des panels de placement.
- Nouveau système de positionnement par CSS.
- Construction d'interfaces par déclaration (UiBinder).
- Mise en œuvre du modèle événementiel.
- Utilisation des composants CellTable, DataGrid...
- Construction de composants personnalisées.
- Data-binding entre les données et les formulaires.
Travaux pratiques
Conception d'écrans avec composants GWT. CSS personnalisés.
3) JavaScript Native Interface et composants personnalisés
- Interactions entre JavaScript et GWT.
- Utiliser les types JavaScript en GWT.
- Intégrer une librairie JavaScript avec GWT.
Démonstration
Intégration jQuery/GWT.
4) Accès au serveur
- Architecture de type Ajax.
- Communication asynchrone via RPC.
- Gérer la sérialisation, les exceptions.
- Formats d'échange JSON et XML.
- Invocation d'un service de type REST.
Travaux pratiques
Ecrire un service GWT.
5) Concepts GWT avancés
- Gérer la session et la navigation.
- Internationalisation.
- Organisation par modules GWT.
- Le modèle MVP.
- Construire un projet Maven GWT.
- Code splitting, ClientBundle.
- Analyse des performances avec Speed Tracer.
page 128
- Paramétrage du compilateur GWT.
Travaux pratiques
Utilisation de Speed Tracer. Impact du code splitting sur le chargement d'une application.
6) Implémenter une politique de tests
- Mise en place de JUnit avec GWTTestCase.
- Intégration de l'outil HTMLUnit.
Travaux pratiques
Tester une application GWT.
7) Considérations architecturales
- Position de GWT au sein d'une architecture JavaEE.
- Modèles d'architectures : MVC/MVP, Portail, SOA...
- Intégration avec d'autres technologies : EJB3, JSF...
Démonstration
Intégrer GWT dans une architecture JEE.
8) L'écosystème GWT
- Librairies Sencha-GXT, Smart GWT, Vaadin.
- Librairies GWT-DnD, GWD Chart.
Démonstration
Manipulation de GXT, GWT-DnD et Chart.
page 129
Réf : JAD
Participants
Web en utilisant
conjointement JSF 2.O et
Dojo.
Pré-requis
du langage Java et du
développement Web en
Java. Expérience requise
en programmation Java.
Connaissance des langages
XML et HTML.
Mixer JSF, Ajax et Dojo pour développer des applications
Web
OBJECTIFS
Vous apprendrez à développer des interfaces web ergonomiques et réactives basées sur Ajax. Vous
découvrirez le Framework Dojo pour simplifier l'usage du JavaScript et exploiterez la richesse de ses
composants et de ses animations. Vous découvrirez également le modèle de programmation orienté
composants graphiques du Framework JSF nouvellement intégré à Java EE 6.
1) Rappels sur JavaScript, DOM et AJAX
2) Présentation de Dojo
3) Utilisation de Dojo
4) Présentation de JSF 2.0 (JSR 314)
5) Concepts de base JSF
6) La gestion des événements en JSF 2.0
7) Conversion et validation
8) Intégration de Dojo à JSF
Travaux pratiques
Mise en place de diverses applications basées sur JSF 2.0 et Dojo.
1) Rappels sur JavaScript, DOM et AJAX
- Le langage JavaScript. Principes de bases, forces et faiblesses.
- Qu'est-ce qu'AJAX ?
- HTML, XHTML, DHTML, JavaScript et CSS.
- Les apports d'AJAX à une application Web.
- Les différents frameworks AJAX disponibles.
- Rappels XML.
- Document Object Model (DOM). Utilité dans le cadre d'une application Web.
2) Présentation de Dojo
- Qu'est-ce que Dojo ?
- Navigateurs supportés par Dojo.
- Les différents composants Dojo.
- Un premier exemple d'utilisation de Dojo.
3) Utilisation de Dojo
- Notions de base : le fichier djConfig, les tableaux et objets avec Dojo.
- Accès à l'arbre DOM : dojo.query...
- Gestion d'événements avec Dojo : dojo.connect, dojo.publish...
- AJAX avec Dojo : AJAX / IO, JSON tools.
Travaux pratiques
Développement d'une application Web utilisant Dojo.
4) Présentation de JSF 2.0 (JSR 314)
- Prrincipes.
- Les serveurs compatibles.
- L'intégration de JSF au serveur.
Travaux pratiques
Mise en place de JSF et création d'une première application.
5) Concepts de base JSF
- Cycle de vie d'une requête JSF.
- Les différents événements rencontrés.
- Le modèle, les règles et le système de navigation.
- Les facelets.
- Utilisation des balises dans les facelets.
- Les composants standard de JSF.
- Les librairies core, HTML et ui.
Travaux pratiques
Mise en oeuvre de quelques composants JSF au sein d'une application.
6) La gestion des événements en JSF 2.0
- Le modèle d'événements de JSF.
- Fonctionnement des événements JSF.
- Ecrire ses propres listeners.
page 130
Travaux pratiques
Ajout d'une gestion événementielle.
7) Conversion et validation
- Le système de conversion de JSF.
- Conversion de date.
- La conversion de nombres.
- Le système de validation de JSF.
- Les différents types de validateur.
8) Intégration de Dojo à JSF
- Les différentes approches.
- Association de composants JSF et de widgets Dojo côté client (Deferred binding).
- Conversion d'un composant JSF en widget DOJO par injection côté client (Lazy injection).
- Exemples et bonnes pratiques.
Travaux pratiques
Mise en oeuvre de l'une des approches présentées.
page 131
Réf : MVE
Participants
Développeurs .NET
confirmés.
Pré-requis
C#, HTML et JavaScript.
développement logiciel.
Prix 2017 : 2440€ HT
Dates des sessions
New
Ce cours vous apprendra à développer des applications Web basées sur le framework ASP.NET MVC
6. Vous appliquerez notamment le modèle de programmation MVC, concevrez des interfaces utilisateurs
adaptables et intégrerez jQuery dans vos développements que vous organiserez sous Visual Studio 2015 et
ASP.NET 5.
Comprendre la philosophie MVC 6
Créer une vue MVC 6 et écrire en Razor
Maîtriser le mécanisme de routage et des contrôleurs
Créer et utiliser des modèles avec Entity Framework
Tester une application MVC 6
Paris
9 jan. 2017, 4 avr. 2017
27 juin 2017
Strasbourg
14 nov. 2016
1) Introduction
2) Le modèle et les contrôleurs
3) Les vues
4) Routage des URL et exceptions
5) Ajax et jQuery
6) Validation et sécurité
7) Structurer un projet et injection de
dépendance
8) Cross-platform et déploiement
1) Introduction
- Synthèse des technologies Web du Framework .NET.
- Le Cross-Platform - .Net Core/Full .Net - Windows OS, Linux, Mac.
- Présentation du modèle - vue - contrôleur - MVC 6.
- Projets .NET MVC 6 dans VS 2015.
Travaux pratiques
Création d'une application MVC 6.
- Modéliser son domaine.
- Les vues fortement typées. Liaison de données.
- Utilisation de l'Entity Framework 7 dans MVC 6.
- Implémentation des actions. Gestion des modèles.
- Gestion des filtres. Affichage et édition des données.
Travaux pratiques
Création de modèles et contrôleurs.
3) Les vues
- Moteur de vues Razor.
- Contenu dynamique. Vues partielles.
- Modèles de vues. Application des styles CSS.
Travaux pratiques
Créations de vues et utilisation de BootStrap dans MVC 6.
4) Routage des URL et exceptions
- Pattern URL. Conception du routage.
- Personnalisation du routage, les attributs de routage.
- Mise en place de tests sur les routes.
- Gestion des exceptions.
Travaux pratiques
Scénarios de routages et structures de navigation MVC 6. Tests des routes.
5) Ajax et jQuery
- Ajax Helper et jQuery/jQueryUI.
- Mises à jour partielles. Gestion du cache.
- Autres techniques d'optimisation client.
Travaux pratiques
Création de pages JavaScript et Ajax.
- Validation côté serveur. DataAnnotations, techniques alternatives, validation côté client.
page 132
- Techniques alternatives. Validation côté client. Modes d'authentification.
- Implémentation de l'authentification ASP.Net et gestion des rôles. Audit de la sécurité du code.
- ASP.NET Identity, les filtres d'authentification.
Travaux pratiques
Mise en œuvre de la sécurité.
7) Structurer un projet et injection de dépendance
- Bonnes pratiques de développement.
- Injection de dépendances.
Travaux pratiques
Organisation en couches d'un projet et utilisation de l'injection de dépendance.
8) Cross-platform et déploiement
- Clients Web et Mobile.
- Les différents types de serveurs : Cross-Platform.
- Déploiement vers les différents environnements et Cross-Platform.
Travaux pratiques
Déploiement des applications.
page 133
Réf : AST
Best
Participants
Internet/Intranet en utilisant
les technologies .NET avec
l'environnement Visual Studio.
Ce cours vous apprendra à utiliser les techniques de création d'applications Internet/Intranet ASP.NET Web
Forms dans l'environnement .NET 4.6 avec Visual Studio 2015/2013 Vous apprendrez également à lier vos
applications avec différents types de bases de données. Enfin, ce cours vous présentera un ensemble de
bonnes pratiques en se focalisant sur l'acquisition de l'architecture du Framework ASP.Net Web Forms.
Pré-requis
la programmation C# ou
VB.NET. Connaissances
de base des technologies
Web côté client (HTML,
JavaScript...).
Comprendre le fonctionnement des pages ASP.NET
Acquérir les compétences de développement Web avec ASP.NET
Maitriser la syntaxe du développement Web avec le langage C# (ou VBNet).
Utiliser l'environnement de développement intégré Visual Studio
Savoir définir une gestion de sécurité de base des applications Web
Prix 2017 : 2610€ HT
Dates des sessions
Paris
10 oct. 2016, 21 nov. 2016
12 déc. 2016, 9 jan. 2017
13 mar. 2017, 15 mai 2017
21 aoû. 2017
Aix
5 déc. 2016, 20 fév. 2017
29 mai 2017
Bordeaux
19 déc. 2016, 23 jan. 2017
20 mar. 2017, 15 mai 2017
Bruxelles
5 déc. 2016, 10 avr. 2017
12 juin 2017
Geneve
5 déc. 2016, 10 avr. 2017
12 juin 2017
Grenoble
5 déc. 2016, 23 jan. 2017
20 mar. 2017, 15 mai 2017
Lille
5 déc. 2016, 20 fév. 2017
29 mai 2017
Luxembourg
5 déc. 2016, 10 avr. 2017
12 juin 2017
Lyon
5 déc. 2016, 23 jan. 2017
20 mar. 2017, 15 mai 2017
Montpellier
19 déc. 2016, 20 fév. 2017
29 mai 2017
Nantes
19 déc. 2016, 20 fév. 2017
29 mai 2017
Rennes
19 déc. 2016, 20 fév. 2017
29 mai 2017
Sophia-antipolis
5 déc. 2016, 20 fév. 2017
29 mai 2017
Strasbourg
5 déc. 2016, 20 fév. 2017
29 mai 2017
Toulouse
19 déc. 2016, 23 jan. 2017
20 mar. 2017, 15 mai 2017
1) Introduction et rappels
2) Fonctionnement des pages ASP.NET
3) Contrôles serveur
4) Conception de la structure d'un site Web
6) Gestion de la sécurité
7) Configuration et déploiement
8) Utilisation des services Web
Travaux pratiques
Les participants apprendront à maîtriser l'infrastructure ASP.NET. Ils utiliseront l'environnement .NET/
Visual Studio pour mettre en œuvre les techniques nécessaires aux applications Web professionnelles. Les
exercices sont effectués en C# ou VB.Net suivant le choix des participants.
1) Introduction et rappels
- Rappels des concepts liés à l'Internet/Intranet et technologies .NET.
- L'architecture d'une application Internet/Intranet, rappel des méthodes HTTP.
- Les Technologies .NET. Application Web en .NET.
- Les outils intégrés à Visual Studio.
Travaux pratiques
Utilisation de Visual Studio pour la création d'un site, création d'un formulaire d'entrée de données.
2) Fonctionnement des pages ASP.NET
- Principe des pages ASP.NET, cycle de vie.
- Utilisation des contrôles serveur WebForms. Intégration dans les pages ASPX avec Visual Studio.
- Persistance de l'état des contrôles serveur avec le ViewState.
- Gestion de la persistance des données applicatives : Session, Cache, Application, Cookies.
- Membres caractéristiques des classes Page, HttpRequest, HttpResponse et HttpServerUtility.
- Utilisation et limitations du QueryString.
- Mise en œuvre du CrossPagePostBack.
- Gestion des événements dans les pages ASP.NET et cycle de vie : Load, UnLoad, PreRender...
- Gestion des événements de l'application : fichier global.asax, événements importants, utilisation.
- Structuration d'une application Web avec VS (séparation données/code/présentation, dossiers spéciaux,
ressources, etc.)
Travaux pratiques
Ecriture des premières pages ASP.NET basées sur des contrôles serveur standard (listes, boutons, etc.)
et gérant des événements. Mise en œuvre des mécanismes nécessaires aux applications professionnelles
(session, cookie, etc.).
3) Contrôles serveur
- Utilité des contrôles serveur pour la création de pages actives côté client et serveur.
- Intégration des contrôles serveur HTML (HtmlInputText, HtmlTable...) avec les scripts clients JavaScript/
jQuery.
- Contrôles conteneur : Panel, MultiView, Wizard...
- Contrôles riches : Calendar, AdRotator, FileUpload...
- Contrôles de validation et groupe de validation.
Travaux pratiques
Utilisation des contrôles serveur afin de rendre une page dynamique, du côté client et du côté serveur. Mise
en œuvre des contrôles de validation côté client et côté serveur avec les contrôles Wizard. Exemple du
contrôle FileUpload... Mise en œuvre de l'Ajax simplement, avec UpdatePanel.
4) Conception de la structure d'un site Web
- Contrôles utilisateur pour la structuration des pages.
page 134
- Mise en forme d'un site à l'aide des MasterPages.
- Rôles des dossiers spéciaux (App_Code, App_Data, App_Themes, etc.).
- Utilisation des feuilles de style CSS et des thèmes.
- Le gestionnaire de packages NuGet.
- Mise en place d'un système de navigation avec SiteMap et SiteMapPath, TreeView et Menu.
Travaux pratiques
Exemple de réalisation d'une application de e-commerce, réalisation d'un contrôle utilisateur et utilisation de
pages maîtres.
- Tour des différents moyens d'accès aux données avec ASP.Net Web Forms : Entity Framework, ADO.NET
et TableAdapters.
- Mécanismes d'accès à une BD : connexion, instruction SQL, procédure stockée, lecture.
- Mécanisme de DataBinding.
- Utilisation des contrôles liés à une source de données : XmlDataSource, GridView (tri et pagination).
- Afficher une vue Maître/Détail entre un contrôle GridView et les contrôles DetailsView, FormView.
- Principes des modèles (Templates).
Travaux pratiques
Utilisation des contrôles DataSource (SqlDataSource, EntityDataSource, ...), des GridView, ListView et
DetailsView pour présenter les données.
6) Gestion de la sécurité
- Les types d'attaques (SQL injection, spoofing, répudiation...).
- Les moyens de prévenir des attaques.
- Contrôle applicatif des accès et des droits.
- Gestion de la sécurité par le système.
- Gestion de la sécurité par l'application.
Travaux pratiques
Mise en place de restrictions d'accès sur un site.
7) Configuration et déploiement
- Gestion des exceptions.
- Rôle et format du fichier Web.config.
- Sauvegarde des paramètres de l'application.
- Configuration de la gestion des sessions.
- Le mode Release.
- La publication de l'application.
Travaux pratiques
Publication d'une application.
8) Utilisation des services Web
- Les principes des services Web.
- Architecture, communication XML/SOAP/JSON, méta-données WSDL.
- Appel d'un service Web à partir d'une requête HTTP et d'un proxy.
Travaux pratiques
Démonstration d'un Web Service simple (recherche dans une base de données) et interrogation via
ASP.NET et un proxy.
page 135
Réf : NEA
Participants
Développeurs ASP.NET.
Pré-requis
de la programmation Web
en .NET ou connaissances
équivalentes à celles
apportées par le stage
"ASP.NET, niveau 1" (réf.
AST). Expérience requise.
Prix 2017 : 2610€ HT
Ce cours permettra aux participants d'appréhender les aspects avancés du développement Web avec
ASP.NET, comme, entre autres, l'utilisation du cache de IIS et d'ASP.NET, la sécurité et les profils
utilisateurs, les fonctionnalités Ajax et les sources de données de types variés (Entity Framework, objets
métier...).
Entrez ici un objectif pédagogique
1) Architecture des applications ASP.NET
2) Accès aux données avancées
3) Contrôles personnalisés
4) Sécurité et authentification
5) Services Web
6) Ajax
7) Compléments
Dates des sessions
Paris
12 déc. 2016, 20 mar. 2017
19 juin 2017
Travaux pratiques
Les exercices sont effectués en C# ou VB.NET suivant le choix des participants.
1) Architecture des applications ASP.NET
- Architecture, composants et cycle de vie des pages ASP.NET WebForms.
- Gestion du cache ASP.Net et IIS.
2) Accès aux données avancées
- Object DataSource comme adaptateur d'accès aux DAL propriétaires.
- Entity Framework 6. TableAdapters et dataset typés.
- Contrôles basés sur des templates.
Travaux pratiques
Création de la couche d'accès aux données et optimisations.
3) Contrôles personnalisés
- Génération dynamique de contrôles.
- Contrôles utilisateur de type ASCX.
- Contrôles utilisateur distribuables et composites.
- Intégration au designer.
Travaux pratiques
Réalisation des 3 types de contrôles utilisateur et interaction avec JavaScript.
4) Sécurité et authentification
- Authentification, autorisation et personnification. Types d'attaques et défenses.
- Identité système et usurpation d'identité du client.
- Membership providers ou identification applicative personnalisée.
- Gestion des rôles et profils.
Travaux pratiques
Créer une application Web sécurisée gérant des rôles et profils.
5) Services Web
- Architecture, sécurité, header SOAP personnalisés.
- Proxies, invocations synchrones et asynchrones.
- Communications asynchrones dans le cycle de vie des pages ASP.Net.
Travaux pratiques
Écriture et utilisation de services asynchrones et sécurisés.
6) Ajax
- Microsoft Ajax Library, templates MSAjax avec la classe JavaScript DataView.
- PageMethods, services Web et WCF.
- Updatepanels.
- Architecture AngularJS.
- Consommation de services Web JSON avec MS Ajax ou Angular $http.
Travaux pratiques
Utilisation de services JSON. UpdatePanels pour optimiser un service de discussion en ligne.
page 136
7) Compléments
- Internationalisation. API de globalisation et utilisation de ressources.
- Génération de rendus non-HTML avec les handlers HTTP.
- Utiliser l'API de réflexion.
- ASP.Net Dynamic Data.
- Bundling et minification, unobtrusive validation, données liées typées, validation par la décoration.
page 137
Réf : SLV
Participants
développeurs ASP.NET
qui souhaitent découvrir la
philosophie de Silverlight et
les techniques associées
afin de concevoir des pages
Web interactives, avec Visual
Studio.
Pré-requis
framework .NET 2.0 ou plus,
de XML, du Visual Studio
2008/2010 et pratique du
langage C# ou VB.NET.
Silverlight 5, mise en œuvre
OBJECTIFS
Silverlight sert à enrichir l'expérience utilisateur avec des pages Web constituées d'éléments visuels riches,
redimensionnables et interactifs. Cette formation vous permettra de vous familiariser avec les différentes
techniques de mise en oeuvre de Silverlight 4/5, au travers d'ateliers réalisés en C# ou en VB .NET.
1) Introduction
2) Concepts fondamentaux et conception
d'interfaces utilisateurs
3) Composants de l'application Silverlight
4) Manipulations de données
1) Introduction
- Panorama des outils de développement (Visual Studio, SDK, MS Blend, MS Encoder, Deep Zoom et outils
tiers).
- Structure d'une application Silverlight (XAML, code-behind, cycle d'exécution).
- Intégration et interaction avec une page Web avec HTML Bridge, déploiement et mises à jour.
Travaux pratiques
Créer une première application simple et exemples de HTML Bridge.
2) Concepts fondamentaux et conception d'interfaces utilisateurs
- Introduction au langage XAML avec équivalences dans le code.
- Hiérarchie des classes et familles d'éléments.
- Rôle des propriétés de dépendance.
- Gestion des événements routés et couplage avec le code-behind.
- Techniques de positionnement avec les éléments Panels, Canvas et Grid.
- Gestion des ressources (physiques et logiques) et des cultures.
- Système de transformations et d'animations.
- Personnalisation : styles et modèles de contrôles.
Travaux pratiques
Créer, personnaliser et programmer les éléments courants (TextBox, TextBlock, listes, Menu, TabControl,
Treeview).
3) Composants de l'application Silverlight
- Système de navigation avec les contrôles Frame et Page.
- Utilisation et gestion du stockage isolé.
- Créer et déployer une application hors navigateur (OOB).
- Utilisation des boîtes de dialogue OpenFileDialog, SaveFileDialog et PrintDocument.
- Exploitation des ressources accessibles par l'élévation des privilèges.
- Techniques d'optimisation (objets Dispatcher et BackgroundWorker).
Travaux pratiques
Création d'une application de type Business, avec exemples d'utilisation du stockage isolé et des boîtes de
dialogue.
4) Manipulations de données
- Présentation et configuration du DataBinding : liaison entre éléments et sur des collections d'objets métiers.
- Techniques de conversions et de validations.
- Gestion des listes et des contrôles de données (ListBox, DataTemplate, DataForm, etc.).
- Faire des échanges de fichiers sur un serveur avec la classe WebClient.
- Manipuler des informations avec un service WCF ou un service de données.
- Interagir avec des données distantes via RIA Services.
- Principe de l'architecture MVVM avec utilisation de commandes.
Travaux pratiques
Création d'une interface d'édition d'une collection d'objets métiers.
page 138
Réf : ASA
Participants
Développeurs .NET confirmés
désirant acquérir les
techniques et les réflexes
pour développer tous types
d'applications Web avec
ASP.NET MVC5
Best
OBJECTIFS
Vous apprendrez dans ce cours à développer des applications Web basées sur le Framework ASP.NET
MVC5. Vous appliquerez notamment le modèle de programmation MVC, concevrez des interfaces utilisateurs
adaptables et intégrerez jQuery dans vos développements que vous organiserez sous Visual Studio
2015/2013 et One ASP.NET.
Pré-requis
C#, HTML et JavaScript.
développement logiciel.
1) Introduction
3) Les vues
4) Routage des URL
5) Ajax et jQuery
7) API Web et déploiement
Prix 2017 : 2440€ HT
Dates des sessions
1) Introduction
Paris
- Synthèse des technologies Web du framework .NET.
- Présentation du modèle MVC5.
- Projets .NET MVC5 dans VS2015 ou 2013.
7 nov. 2016, 19 déc. 2016
7 fév. 2017, 11 avr. 2017
27 juin 2017
Aix
13 déc. 2016, 14 fév. 2017
16 mai 2017
Travaux pratiques
Création d'une application MVC5.
Bordeaux
6 déc. 2016, 30 mai 2017
Bruxelles
13 déc. 2016, 14 mar. 2017
13 juin 2017
Geneve
13 déc. 2016, 14 mar. 2017
13 juin 2017
Grenoble
13 déc. 2016, 30 mai 2017
Lille
13 déc. 2016, 14 fév. 2017
16 mai 2017
Luxembourg
13 déc. 2016, 14 mar. 2017
13 juin 2017
Lyon
- Modéliser son domaine.
- Utilisation de vues fortement typées. Liaison de données.
- Utilisation de l'Entity Framework 6 dans MVC5.
- Implémentation des actions. Gestion des modèles.
- Gestion des filtres. Affichage et édition des données.
Travaux pratiques
Développement de modèles MVC5. Création de contrôleurs MVC5.
3) Les vues
- Moteur de vues Razor. Contenu dynamique.
- Modèles de vues. Application des styles CSS.
Travaux pratiques
Créations de Vues MVC5, utilisation de Bootstrap dans MVC5.
4) Routage des URL
Montpellier
- Pattern URL. Conception du routage.
- Personnalisation du Routage, les attributs de Routage dans MVC5.
6 déc. 2016, 14 fév. 2017
16 mai 2017
Travaux pratiques
Scénarios de routages et structures de navigation MVC5.
13 déc. 2016, 30 mai 2017
Nantes
6 déc. 2016, 14 fév. 2017
16 mai 2017
Rennes
6 déc. 2016, 14 fév. 2017
16 mai 2017
Sophia-antipolis
13 déc. 2016, 14 fév. 2017
16 mai 2017
Strasbourg
13 déc. 2016, 14 fév. 2017
16 mai 2017
Toulouse
6 déc. 2016, 30 mai 2017
5) Ajax et jQuery
- Ajax Helper et jQuery/jQueryUI.
- Mises à jour partielles. Gestion du cache.
- Autres techniques d'optimisation client.
Travaux pratiques
Création de pages JavaScript et Ajax MVC5.
- Validation côté serveur. DataAnnotations, techniques alternatives, validation côté client.
- Techniques alternatives. Validation côté client. Modes d'authentification.
- Implémentation de l'authentification ASP.Net et gestion des rôles. Audit de la sécurité du code.
- ASP.NET Identity dans MVC 5, les filtres d'Authentification.
Travaux pratiques
Mise en œuvre de la sécurité dans une application MVC5.
7) API Web et déploiement
- Implémentation d'une API Web. Gestion des requêtes REST. Clients Web et Mobile.
- Modules HTTP et gestionnaires HTTP. Tests unitaires et gestion des exceptions.
- Déploiement vers un serveur de test. Déploiement vers Azur. Types de déploiement via VSTO.
page 139
Travaux pratiques
Gestion du déploiement des applications.
page 140
Réf : PHH
Participants
Développeurs et webmasters.
Pré-requis
du langage HTML et d'au
moins un langage de
programmation.
Prix 2017 : 2440€ HT
Dates des sessions
PHP 7 et 5, développer un site Web dynamique
Best
Ce cours vous permettra de maîtriser d'une manière opérationnelle le langage PHP dans le contexte de
développement de sites Internet dynamiques. Il vous permettra aussi d'aborder les aspects connexes à ce
type de développement : bases de données, langage SQL, manipulation de fichiers graphiques...
Maîtriser la syntaxe PHP en vue de développer de sites web dynamiques
Traiter des formulaires web
Gérer des sessions utilisateurs
Accéder aux données d'une base de données MySQL
Créer dynamiquement des images et des graphismes
Paris
4 oct. 2016, 15 nov. 2016
5 déc. 2016, 31 jan. 2017
21 fév. 2017, 21 mar. 2017
18 avr. 2017, 16 mai 2017
13 juin 2017, 18 juil. 2017
22 aoû. 2017
1) Introduction
2) Automatisation d'une page Web
3) Les formulaires simples
4) Les variables complexes : tableaux
5) Gestion des sessions utilisateurs
6) Utilisation d'une base de données MySQL
7) Les formulaires complexes
8) Le graphisme en PHP
Aix
Travaux pratiques
13 déc. 2016, 7 mar. 2017
13 juin 2017
Des machines sous Windows ou Linux équipées du serveur Web Apache avec le module PHP et un serveur
MySQL seront mis à la disposition des participants. Les participants vont créer un site complet de vente en
ligne.
Bordeaux
13 déc. 2016, 7 fév. 2017
30 mai 2017
Bruxelles
29 nov. 2016, 14 mar. 2017
13 juin 2017
Geneve
29 nov. 2016, 14 mar. 2017
13 juin 2017
Grenoble
13 déc. 2016, 7 fév. 2017
30 mai 2017
Lille
13 déc. 2016, 7 mar. 2017
13 juin 2017
Luxembourg
29 nov. 2016, 14 mar. 2017
13 juin 2017
Lyon
13 déc. 2016, 7 fév. 2017
30 mai 2017
Montpellier
13 déc. 2016, 7 mar. 2017
13 juin 2017
Nantes
13 déc. 2016, 7 mar. 2017
13 juin 2017
Rennes
13 déc. 2016, 7 mar. 2017
13 juin 2017
Sophia-antipolis
13 déc. 2016, 7 mar. 2017
13 juin 2017
Strasbourg
4 oct. 2016, 13 déc. 2016
7 mar. 2017, 13 juin 2017
Toulouse
13 déc. 2016, 7 fév. 2017
30 mai 2017
1) Introduction
- L'architecture du Web : HTTP, CGI, interactivité : script client ou script serveur.
- Qu'est-ce que PHP ?
- Historique de PHP.
- Les différences entre PHP 4, PHP 5 et PHP 7.
- Notions d'architecture multicouche. Introduction aux principes MVC.
- Présentation de l'exemple utilisé durant la formation : le site de vente en ligne.
Travaux pratiques
Revue des balises principales HTML et des commandes de style. Introduction à la feuille de style de
l'application exemple.
2) Automatisation d'une page Web
- Les principes du client-serveur.
- Premiers éléments du langage.
- Intégration de PHP dans une page HTML.
- Variables et fonctions.
- Librairies.
- Fonctions de base, variables serveur et variable PHP.
- Variables serveur et variable PHP.
- Contrôles de flux et boucles.
Travaux pratiques
Réalisation de fonctions personnalisées. Réalisation d'une librairie de fonctions.
3) Les formulaires simples
- Passage et transmission de variables.
- Lecture/écriture de fichier.
- Vérification de Login/mot de passe.
- Redirection.
4) Les variables complexes : tableaux
- Constructeur Array.
- Fonctions associées aux tableaux.
- Fonctions d'extraction.
- Fonctions de navigation dans un tableau.
Travaux pratiques
Réalisation d'une fonction de création de liste déroulante.
5) Gestion des sessions utilisateurs
- Variables persistantes : Cookies et Session.
page 141
- Avantages et inconvénients des Cookies et Sessions.
- Limitations et précautions.
- Les variables de session.
- Fonctions liées aux variables de session.
- Les Cookies.
- Sérialisation des variables complexes.
- Utilisation.
Travaux pratiques
Réalisation d'un panier d'achat simple, version Cookie et Session. Gestion des quantités commandées.
6) Utilisation d'une base de données MySQL
- Présentation de MySQL.
- Concepts fondamentaux : bases, tables, champs, enregistrements.
- Bases MySQL.
- Tables MySQL.
- Champs MySQL.
- Enregistrements MySQL.
- Fonctions PHP MySQL.
- Introduction au langage SQL (sélection, modification, suppression).
- Traitement des résultats des requêtes.
Travaux pratiques
Création d'une base MySQL. Remplissage de la base à partir d'une base texte. Création de fiches produit à
la volée par extraction des données de la base.
7) Les formulaires complexes
- Moteur de recherche : formulaire en relation avec une base de données.
- Fonctions avancées de sélection : recherches et tris.
Travaux pratiques
Réalisation d'un moteur de recherche : la sélection sur auteur, titre et héros donne une liste de liens sur les
fiches produit correspondantes. Implémentation multicouche.
8) Le graphisme en PHP
- Présentation de la librairie GD2.
- Création d'image, réutilisation.
- Gestion des polices et de l'écriture en mode image.
- Superposition de texte pour protection de droits.
- Intégration au site.
- Réalisation de graphiques statistiques.
Travaux pratiques
Intégration des différents modules réalisés. Affichage des images avec mention de Copyright.
page 142
Réf : PYM
Participants
Développeurs PHP et chefs
de projets.
Pré-requis
PHP. Connaissances de base
de la Programmation Orientée
Objet.
Prix 2017 : 1880€ HT
Dates des sessions
PHP, technique avancée de développement pour le Web
Best
Vous apprendrez dans ce cours à développer des applications Web PHP avec les Frameworks les plus
populaires du marché. Vous verrez comment installer un framework, créer des formulaires et des templates,
organiser vos applications via une architecture MVC, manipuler des données persistantes et sécuriser les
accès.
Installer et configurer un le Framework
Appréhender les composants d'un Framework pour concevoir des applications web MVC
Manipuler des données via l'ORM Doctrine
Concevoir des formulaires et contrôler la validation des données
Créer et utiliser des services Web REST et SOAP
Paris
17 oct. 2016, 28 nov. 2016
23 jan. 2017, 27 mar. 2017
26 juin 2017
Aix
6 fév. 2017, 2 mai 2017
Bordeaux
1) Introduction aux Frameworks
2) Démarrer avec un Framework
3) La "couche contrôleur" et la gestion des URL
4) La "couche vue" et le moteur de template
Twig
5) La couche Modèle
6) Les formulaires et leur validation
7) Aller plus loin avec les Frameworks
6 mar. 2017, 22 mai 2017
Bruxelles
14 nov. 2016, 6 mar. 2017
6 juin 2017
Geneve
14 nov. 2016, 6 mar. 2017
6 juin 2017
Grenoble
6 mar. 2017, 22 mai 2017
Lille
6 fév. 2017, 2 mai 2017
Luxembourg
14 nov. 2016, 6 mar. 2017
6 juin 2017
Lyon
6 mar. 2017, 22 mai 2017
Montpellier
6 fév. 2017, 2 mai 2017
Nantes
6 fév. 2017, 2 mai 2017
Rennes
6 fév. 2017, 2 mai 2017
Sophia-antipolis
6 fév. 2017, 2 mai 2017
Strasbourg
6 fév. 2017, 2 mai 2017
Toulouse
2 nov. 2016, 6 mar. 2017
22 mai 2017
1) Introduction aux Frameworks
- Rappels de concepts liés à la programmation orientée objet.
- Présentation globale d'un Framework : avantages / inconvénients.
- Concepts principaux, architecture MVC.
- Installation d'un Framework Web PHP.
- Architecture d'un projet : application, bundles...
Travaux pratiques
Installation d'un Framework Web PHP.
2) Démarrer avec un Framework
- Configuration de l'application et surcharge.
- Outils de ligne de commande.
- Outils de débogage du code : Web Debug Toolbar...
- Autoloading des classes.
Travaux pratiques
Prise en main de l'environnement. Description de l'application Web qui servira de fil rouge.
3) La "couche contrôleur" et la gestion des URL
- Définition d'un "contrôleur" et de ses "actions".
- Mappage des contrôleurs au système de routage.
- Accéder aux informations de la requête http.
- Redirection vers une autre page, affichage d'une page d'erreur 404.
- Mécanisme du routage et gestion des URL.
- Injection de Dépendance et conteneurs de service.
Travaux pratiques
Mise en place du contrôleur de l'application. Manipulation des informations de requête et de session. Mise en
œuvre de la redirection.
4) La "couche vue" et le moteur de template Twig
- Utilisation des templates. Moteur de template Twig.
- Héritage de templates. Inclusions dans les templates.
- Templates modulaires. Helpers.
Travaux pratiques
Création et utilisation de templates. Mise en place de la couche Vue de l'application.
5) La couche Modèle
- Définition du modèle et de la base de données.
- Présentation de Doctrine 2 (DBAL et ORM).
- Gestion des objets persistants.
- Requêtage objet, accesseurs, relation et association.
- Remaniement de code et objets métiers.
Travaux pratiques
page 143
Mise en place de la couche Modèle de l'application.
6) Les formulaires et leur validation
- Création d'un formulaire simple.
- Affichage d'un formulaire dans des templates.
- Sécurité renforcée avec les tokens (CSRF).
- Validation des formulaires.
Travaux pratiques
Création de formulaires. Ajout de pages à l'application fil rouge. Mise en place de la validation.
7) Aller plus loin avec les Frameworks
- Sécurité, contrôle d'accès et authentification.
- Tests automatisés avec PHPUnit.
- Solution d'e-mail.
- Services Web (SOAP et Rest).
- Ajouter de nouvelles macros, fonctions à Twig.
Travaux pratiques
Mise en œuvre et tests.
page 144
Réf : FAR
Participants
Développeurs et architectes.
Pré-requis
des concepts objet. Bonnes
connaissances de PHP5 et du
HTML.
Prix 2017 : 2440€ HT
Zend Framework 2 et 3, maîtrise du développement Web
Ce cours vous apportera les meilleures pratiques de développement Web avec le Zend Framework version
2. Après l'avoir installé, vous en découvrirez l'architecture et les concepts. Vous concevrez des modules, des
formulaires, aborderez l'injection de dépendances et utiliserez les principaux composants du framework.
Installer et configurer une application Zend Framework 2 et 3
Maitriser les Design Patterns objets en particulier le MVC
Utiliser les principaux composants de Zend Framework
Automatiser les tests dans Zend Framework
Développer des composants métiers avec Zend\Db et Doctrine
Dates des sessions
Paris
22 nov. 2016, 21 mar. 2017
30 mai 2017
1) Introduction
2) Programmation orientée objet
3) Utilisation du framework
5) Les formulaires
6) Bonnes pratiques avec Zend Framework
7) Autres composants
8) Les nouveautés et changements de Zend
Framework 3
1) Introduction
- Définition d'un framework et de son intérêt.
- Présentation générale du Zend Framework.
- Evolutions successives depuis Zend 1.
- Installation de Zend Framework avec de Composer.
- Architecture MVC. Squelette d'application.
Travaux pratiques
Création d'un projet.
2) Programmation orientée objet
- Rappels : classes, objets, visibilité, encapsulation, accesseurs, constructeur, méthodes magiques...
- Conception objet : références, associations, héritage, classes abstraites, interfaces.
- Design patterns : Factory, Model View Controller, Data Mapper, Table Gateway, Front Controller, Two Step
View...
- Normes PSR (0/1/2) et autochargement de classes.
Travaux pratiques
Conception d'un modèle Objet.
3) Utilisation du framework
- Type de code pour le Modèle, le Contrôleur, la Vue ?
- Utilisation du Layout, ViewModel, aides de vues disponibles et personnalisées.
- Gestion des erreurs, plug-ins de Contrôleurs.
Travaux pratiques
Développement d'un carnet d'adresses sous Zend Framework.
- Les bases de données simplifiées avec Zend\Db.
- L'ORM Doctrine et le module Doctrine Module.
Travaux pratiques
Manipulation de données via l'ORM Doctrine.
5) Les formulaires
- Zend\Form : gestion des formulaires.
- Filtrage et validation : Zend\Filter, Zend\Validate, Zend\InputFilter.
- Conversions objets/tableaux avec les Hydrateurs.
6) Bonnes pratiques avec Zend Framework
- Injection de dépendances : Zend\Di et Zend\ServiceManager.
- Ecriture de tests unitaires avec PHPUnit. Injection de Mocks via le ServiceManager.
- Création de modules, utilisation de modules Zend Framework populaires : ZfcUser, ZendDeveloperTools,
BjyProfiler...
- Débogage et profilage avec XDebug.
page 145
7) Autres composants
- Authentification et gestion des droits.
- Mails, Logs, Session, Config.
- Internationalisation avec Zend\ I18n.
- Zend\EventManager.
8) Les nouveautés et changements de Zend Framework 3
- PSR-7, zend-diactoros et zend-expressive.
- Le nouveau ServiceManager.
- Le nouvel EventManager.
- Migrer une application Zend Framework 2 vers Zend Framework 3.
page 146
Réf : NEC
Participants
Développeurs.
Pré-requis
en programmation.
concepts Objet. Expérience
requise en développement
logiciel avec un langage de
type C/C++ ou Java.
Prix 2017 : 2770€ HT
Dates des sessions
Paris
12&19 déc. 2016, 13 fév.
2017
10 avr. 2017, 12 juin 2017
Programmation en C# (70-483)
New
Ce stage vous permettra d'avoir de solides bases pour développer des applications en C#, apprendre à
utiliser le Framework .NET ainsi que la mise en œuvre de la Programmation Orienté Objet (POO). Ce stage
couvre tous les sujets nécessaires pour préparer l'examen Microsoft 70-483.
Comprendre l'architecture.NET Framework avec C#
Apprendre la programmation orientée objet avec C#
Acquérir les connaissances nécessaires pour exploiter des données avec LINQ
1) La syntaxe du langage C#
2) Méthodes, exceptions et applications
graphiques
3) Les classes, hiérarchie et héritage
4) Données locales et base de données
5) Données distantes et interface utilisateur
6) Performances des applications
7) Code non managé et types réutilisables
Certification
partenaire de Microsoft, Pearson Vue.
1) La syntaxe du langage C#
- L'architecture.NET Framework.
- Présentation du langage C#.
- Types de données, opérateurs et expressions.
- Les structures de programmation.
Travaux pratiques
Utilisation de l'environnement de développement Visual Studio.NET.
2) Méthodes, exceptions et applications graphiques
- Comment créer et appeler des méthodes ?
- Les méthodes surchargées.
- Les exceptions.
- Les structures et les énumérations.
- Les collections.
- La gestion d'évènements.
Travaux pratiques
Exemples de méthodes et gestion des exceptions. Collections et gestion des évènements.
3) Les classes, hiérarchie et héritage
- Présentation des classes.
- Définition et implémentation d'interfaces.
- Les collections à typage sûr.
- La hiérarchie et l'héritage des classes.
Travaux pratiques
Exemples de classes, de collections à typage sûr. Créer une hiérarchie de classe.
4) Données locales et base de données
- Lire et écrire des données vers et à partir du système de fichiers.
- Comment sérialiser et désérialiser des données ?
- Les entrées/sorties par les flux.
- Création et utilisation d'un modèle de données Entité.
- Interrogation de données par LINQ.
Travaux pratiques
Sérialiser les données au format XML. Utilisation de LINQ pour travailler avec les données.
5) Données distantes et interface utilisateur
- Comment accéder à des données via le Web ?
- Accéder aux données dans le Cloud.
- Créer une interface utilisateur avec XAML.
page 147
Travaux pratiques
Accéder à des données à distance. Personnaliser l'apparence d'une interface utilisateur.
6) Performances des applications
- Améliorer les performances d'une application.
- Le multitâche en utilisant tâches et expressions Lambda.
- Les opérations asynchrones.
Travaux pratiques
Amélioration des performances d'une application. Réaliser des opérations asynchrones.
7) Code non managé et types réutilisables
- Les objets dynamiques.
- Durée de vie des objets et contrôle des ressources non managées.
- Comment créer et utiliser des attributs personnalisés ?
- Le versioning. Le déploiement d'assemblies.
- Le cryptage symétrique et asymétrique.
Travaux pratiques
Créer des objets dynamiques. Créer des attributs personnalisés.
page 148
Réf : AWA
Participants
Développeurs web.
Pré-requis
Bonne expérience en
développement d'applications
ASP .Net.
Développement d'applications Web ASP.NET MVC
(70-486)
New
Cette formation vous apprendra à concevoir et développer des applications avec ASP.NET MVC en utilisant
les technologies et les outils du .NET Framework 4.5. Ce stage couvre tous les sujets nécessaires pour
préparer l'examen Microsoft 70-486.
Prix 2017 : 2770€ HT
Dates des sessions
Paris
12 déc. 2016, 6 fév. 2017
3 avr. 2017, 19 juin 2017
Apprendre à développer des applications ASP .Net MVC en .NET Framework 4.5
Etre capable de tester et déboguer des applications Web ASP.NET MVC4
Implémenter Ajax avec ASP.NET MVC4
1) conception d'applications ASP.NET MVC
2) Modelés, contrôleurs et vues ASP.NET MVC
3) Les tests et le débogage d'applications
4) Structurer une application et appliquer des
styles
5) Pages réactives et JavaScript
6) La sécurité des applications
7) Services Web
8) Traitement des demandes et déploiement
Certification
1) conception d'applications ASP.NET MVC
- Panorama des technologies Microsoft Web.
- Présentation de ASP.NET 4.5 et ASP.NET MVC 4.
- La phase de conception du projet.
- Les modèles, les contrôleurs et les vues.
Travaux pratiques
Création d'une application MVC.
2) Modelés, contrôleurs et vues ASP.NET MVC
- Comment créer des modèles MVC ?
- Propriétés et méthodes des modèles MVC.
- Les contrôleurs et les actions.
- Les filtres d'action d'écriture.
- Les vues avec la syntaxe Razor. Le HTML Helper.
Travaux pratiques
Création d'un projet MVC et ajout d'un modèle. Ajouter un contrôleur MVC et des actions d'écriture. Ajout
d'une vue.
3) Les tests et le débogage d'applications
- Comment effectuer des tests unitaires sur des composants MVC ?
- La gestion des exceptions.
Travaux pratiques
Exécuter des tests unitaires. Exemples de gestion des exceptions.
4) Structurer une application et appliquer des styles
- Analyse de l'information.
- Les URL et les contrôles de navigation.
- Les routes et le moteur de routage ASP.NET.
- Le CSS dans une application MVC.
Travaux pratiques
Appliquer une apparence cohérente à une application MVC.
5) Pages réactives et JavaScript
- Utiliser AJAX.
- Mises à jour de pages partielles.
- Mise en cache pour réduire la bande passante.
- Implémenter le code JavaScript.
page 149
- La bibliothèque jQuery et jQueryUI.
Travaux pratiques
Configurer le cache ASP.NET. Exemple d'utilisation de jQuery.
6) La sécurité des applications
- Le contrôle d'accès aux applications.
- L'authentification et l'autorisation. Les rôles.
- Stabilité, fiabilité et sécurité des applications.
- Les informations d'état.
Travaux pratiques
Sécuriser une application.
7) Services Web
- Présentation de Windows Azure.
- Comment écrire un service web de Windows Azure ?
- Apprendre à développer une API Web.
- Appel d'une API Web depuis des applications mobiles et Web.
Travaux pratiques
Exemple d'utilisation d'un service Web.
8) Traitement des demandes et déploiement
- Les modules et les gestionnaires HTTP.
- Utilisation des Web Sockets.
- Savoir déployer des applications Web et MVC.
page 150
Réf : APW
Participants
Développeurs.
Les fondamentaux du développement d'applications
Windows Store en utilisant C# (70-484)
New
Pré-requis
Visual Studio 2010 ou 2012,
du langage C# et de .Net
Framework 4.5.
Ce cours vous apprendra à développer des applications Windows Store en C#. Vous verrez comment créer
des interfaces utilisateurs en utilisant XAML, présenter les données ainsi que mettre en œuvre la navigation
dans les applications. Ce stage couvre tous les sujets nécessaires pour préparer l'examen Microsoft 70-484.
Prix 2017 : 2770€ HT
Dates des sessions
Apprendre à développer des applications Windows Store en C#
Savoir créer des interfaces utilisateurs en utilisant XAML
Apprendre à mettre en place la navigation dans les applications Windows Store
Paris
19 déc. 2016, 20 mar. 2017
29 mai 2017
1) La plate-forme de développement
2) Les interfaces utilisateur
3) Les contrôles intégrés Windows 8.1
4) La gestion des fichiers et des processus
5) Styles et navigation dans les applications
6) Les contrats Windows 8.1
7) Accès aux données et déploiement
Certification
1) La plate-forme de développement
- Windows 8.1 et Windows Store Apps.
- L'interface utilisateur.
- Le système WinRT et les différents langages.
2) Les interfaces utilisateur
- Les interfaces utilisateurs en XAML.
- Les bases de XAML.
- Le code-behind et le XAML avancé.
- Comment présenter des données ?
- Les contrôles de présentation de données.
Travaux pratiques
Création d'une interface utilisateur avec XAML. Présenter des données dans le contrôle GridView.
3) Les contrôles intégrés Windows 8.1
- Que sont les contrôles intégrés de Windows 8.1 ?
- Les contrôles WinRT et AppBar.
- Les modes de fenêtrage
Travaux pratiques
Réaliser une mise en page en utilisant les contrôles intégrés dans Windows 8.1.
- Les fichiers dans Windows Store Apps.
- Les flux dans les applications Windows Store.
- Les composants graphiques pour les fichiers.
- Gérer le cycle de vie des applications.
- Activer les applications. Les tâches d'arrière-plan.
Travaux pratiques
Exemple de cycle de vie d'une application.
5) Styles et navigation dans les applications
- Les modèles, les styles et les ressources.
- Les ressources partagées.
- Comment créer des styles et des modèles ?
- La navigation dans les applications Windows Store.
- Le zoom sémantique.
Travaux pratiques
page 151
Exemple de création d'un modèle et d'un style. Ajouter la navigation dans une application. Mise en œuvre du
Zoom sémantique.
- Les concepts des charmes et des contrats.
- Le contrat de recherche et le contrôle "SearchBox".
- Le contrat de partage.
- Les paramètres des applications.
Travaux pratiques
Implémenter un contrat de recherche. Exemple d'utilisation du contrôle SearchBox.
- Politique d'accès aux données.
- Évaluer les stratégies d'accès aux données.
- Les données à distance.
- Les événements de pointeur et les mouvements.
- Déployer les Apps dans le Windows Store.
- Le manifeste d'une application.
- Certifier une application Windows Store.
Travaux pratiques
Exemple de mise en œuvre d'événements de la souris et de mouvement.
page 152
Réf : AAV
Participants
Développeurs d'applications.
Pré-requis
programmation C#. Avoir une
expérience sur Visual Studio
2013 et avoir déjà travaillé
sur des applications Windows
Store.
Prix 2017 : 2770€ HT
Dates des sessions
Développement d'applications avancées Windows Store
en utilisant C# (70-485)
New
Cette formation vous apprendra à concevoir et à développer des applications Windows Store avec C#
en utilisant des fonctionnalités avancées. Vous verrez aussi la gestion du stockage et la mise en cache
d'informations de l'application. Ce stage couvre tous les sujets nécessaires pour préparer l'examen Microsoft
70-485.
Développer des applications Windows Store
Implémenter des fonctionnalités avancées
Apprendre à interagir avec les différents types de périphérique disponibles (capteurs...)
Paris
12 déc. 2016, 13 mar. 2017
15 mai 2017
1) Introduction aux applications Windows Store
2) Animations et globalisation
3) Stratégie de marque et interface utilisateur
4) Stockage de données avancé
5) Composants et contrôles réutilisables
6) Scénarios de contrat avancés et WSN
7) Capteurs et périphériques
8) Sécurisation et traçage d'applications
Windows Store
Certification
- Architecture et fonctionnalités de la plateforme.
- Processus de création d'interfaces utilisateur avec XAML.
- Le nouveau modèle de l'API WinRT.
- Comment ajouter des animations à vos applications ?
- Les transitions et les transformations.
- La classe VisualStateManager.
- Les fichiers de ressources pour la localisation.
- Comment effectuer la mise en forme spécifique à la culture ?
Travaux pratiques
Créer des animations et des transitions. Créer des fichiers de ressources pour la localisation.
- Stratégie de marque pour votre application.
- L'écran de démarrage personnalisé.
- L'interface et l'expérience utilisateur.
Travaux pratiques
Créer un écran de démarrage pour une application Windows Store.
- Bien utiliser le stockage de fichier.
- Utiliser la mise en cache.
- Extensions de fichier et associations à une application.
- Compression des fichiers.
Travaux pratiques
Exemple de mise en cache de donnée.
- Savoir personnaliser les contrôles.
- Créer des nouveaux composants.
- Réutiliser les composants.
Travaux pratiques
Création d'un contrôle personnalisé.
page 153
- Les contrats de lecture et d'impression.
- Les contacts et les calendriers.
- Fichiers PDF et des captures d'écran.
- Le service de notifications Windows Push (WNS).
- La communication avec le service WSN.
Travaux pratiques
Exemple d'ajout du support PDF.
- La capture des images, vidéos et sons.
- Création de tâches en arrière-plan.
- Version d'évaluation et publicité dans l'application.
Travaux pratiques
Exemple de capture d'image. Créer une version d'évaluation.
8) Sécurisation et traçage d'applications Windows Store
- L'authentification Windows et l'authentification Web.
- Crypter une application Windows Store.
- Analyse et traçage d'une application.
Travaux pratiques
Exemple de cryptage d'une application Windows Store.
page 154
Réf : AWH
Participants
Pré-requis
Connaissance de base du
langage HTML5, CSS 3
et du langage JavaScript.
développement Web avec
Visual Studio 2010 ou 2012.
Prix 2017 : 2770€ HT
Dates des sessions
Les fondamentaux du développement d'applications
Windows Store en utilisant HTML5 et JavaScript (70-481)
New
Ce cours vous apprendra à développer des applications Windows Store avec HTML5 et JavaScript. Vous
verrez comment créer des interfaces utilisateurs, présenter les données ainsi que mettre en œuvre la
navigation dans les applications. Ce stage couvre tous les sujets nécessaires pour préparer l'examen
Microsoft 70-481.
Apprendre à développer des applications Windows Store avec HTML5 et JavaScript
Savoir créer des interfaces utilisateurs
Apprendre à mettre en œuvre la navigation dans les applications
Paris
12 déc. 2016, 13 fév. 2017
10 avr. 2017, 12 juin 2017
1) La plateforme de développement
2) Conception d'applications
3) La mise en page
4) Les notifications utilisateurs
6) La navigation dans les applications
Certification
1) La plateforme de développement
- Windows 8.1 et Windows Store Apps.
- L'interface utilisateur.
- Le système WinRT et les différents langages.
2) Conception d'applications
- Les motifs de conception MVVM.
- Les applications à page unique.
- Le modèle de conception MVVM.
- La bibliothèque WinJS.
- Les APIs WinJS.
Travaux pratiques
Exemple d'utilisation de la bibliothéque WinJS.
3) La mise en page
- Mettre en page les applications.
- Les contrôles de mise en page.
- Implémentation des modèles et contrôles WinJS.
- Le contrôle AppBar.
- Comment présenter les données ?
- Les contrôles de présentation de données.
- Le contrôle ListView.
Travaux pratiques
Exemple de mise en page d'une application. Utilisation des contrôles de présentation des données.
4) Les notifications utilisateurs
- Les outils pour notifier les utilisateurs.
- Le "tile", les "live tiles".
- Les "tiles" secondaires et les notifications de "tiles".
- Que sont les notifications "toast" ?
Travaux pratiques
Exemple de mise en place les notifications utilisateurs.
- Les fichiers dans Windows Store Apps.
- Les flux dans les applications Windows Store.
- Les composants graphiques pour les fichiers.
- Gérer le cycle de vie des applications.
page 155
- Activer les applications. Les tâches d'arrière-plan.
Travaux pratiques
Exemple de cycle de vie d'une application.
6) La navigation dans les applications
- Concevoir la navigation dans les applications Windows Store.
- Comment implémenter la navigation dans les applications ?
- Utilisation du "Semantic Zoom".
Travaux pratiques
Mettre en œuvre la "Semantic Zoom".
- Les concepts des charmes et des contrats.
- Le contrat de recherche et de partage.
- Les paramètres des applications.
Travaux pratiques
Implémenter un contrat de recherche.
- Politique d'accès aux données.
- Évaluer les stratégies d'accès aux données.
- Les données à distance.
- Les évènements de pointeur et les mouvements.
- Déployer les Apps dans le Windows Store.
- Le manifeste d'une application.
- Certifier une application Windows Store.
Travaux pratiques
Exemple de mise en œuvre d'événements de la souris et de mouvement.
page 156
Réf : AAW
Participants
Pré-requis
la programmation HTML5,
du langage JavaScript, de
l'utilisation Visual Studio 2013
et avoir déjà travaillé sur des
applications Windows Store.
Prix 2017 : 2770€ HT
Dates des sessions
Paris
19 déc. 2016, 20 mar. 2017
15 mai 2017
Développement d'applications avancées Windows Store
en utilisant HTML5 et JavaScript (70-482)
New
Cette formation vous apprendra à concevoir et développer en utilisant des fonctionnalités avancées, des
applications Windows Store avec les langages HTML5 et JavaScript. Ce stage couvre tous les sujets
nécessaires pour préparer l'examen Microsoft 70-482.
Apprendre à développer des applications Windows Store en utilisant HTML5 et JavaScript
Savoir gérer le stockage et la mise en cache d'informations de l'application
Ajouter des animations et des transitions à une application Windows Store
8) Sécurisation et traçage d'applications
Windows Store
Certification
- Architecture et fonctionnalités de la plateforme.
- Processus de création d'interfaces utilisateur avec HTML.
- Le nouveau modèle de l'API WinRT.
- Comment ajouter des animations à vos applications ?
- Les transitions et les transformations.
- Les fichiers de ressources pour la localisation.
- Comment effectuer la mise en forme spécifique à la culture ?
Travaux pratiques
Créer des animations et des transitions. Créer des fichiers de ressources pour la localisation.
- Stratégie de marque pour votre application.
- L'écran de démarrage personnalisé.
- L'interface et l'expérience utilisateur.
Travaux pratiques
Créer un écran de démarrage pour une application Windows Store.
- Bien utiliser le stockage de fichier.
- Utiliser la mise en cache.
- Extensions de fichier et associations à une application.
- Compression des fichiers.
Travaux pratiques
Exemple de mise en cache de donnée.
- Savoir personnaliser les contrôles.
- Créer des nouveaux composants.
- Réutiliser les composants.
Travaux pratiques
Création d'un contrôle personnalisé.
- Les contrats de lecture et d'impression.
page 157
- Les contacts et les calendriers.
- Fichiers PDF et des captures d'écran.
- Le service de notifications Windows Push (WNS).
- La communication avec le service WSN.
Travaux pratiques
Exemple d'ajout du support PDF.
- La capture des images, vidéos et sons.
- Utilisation de CameraCaptureUI et de MediaCapture.
- Création de tâches en arrière-plan.
- Version d'évaluation et publicité dans l'application.
Travaux pratiques
Exemple de capture d'image. Créer une version d'évaluation.
8) Sécurisation et traçage d'applications Windows Store
- L'authentification Windows et l'authentification Web.
- Crypter une application Windows Store.
- Analyse et traçage d'une application.
Travaux pratiques
Exemple de cryptage d'une application Windows Store.
page 158
Réf : DSW
Participants
projets Web.
Pré-requis
architectures techniques.
Prix 2017 : 2440€ HT
Dates des sessions
Paris
15 nov. 2016, 12 déc. 2016
10 jan. 2017, 21 fév. 2017
14 mar. 2017, 18 avr. 2017
16 mai 2017, 13 juin 2017
18 juil. 2017, 29 aoû. 2017
Aix
13 déc. 2016, 14 fév. 2017
16 mai 2017
Best
Ce cours, très pratique, vous présentera l'ensemble des technologies Internet. Il vous expliquera le
fonctionnement des services Web et des différents langages associés (HTML, CSS, JavaScript...) ainsi
que les techniques graphiques, l'interrogation des bases de données et l'administration. Les exercices vous
permettront d'appréhender d'une manière très concrète toutes les phases de la réalisation d'un site Web.
Réaliser un site web ergonomique, accessible et bien référencé
Administrer un site Web
4) Les formulaires
6) Ergonomie et accessibilité d'une application
Web
7) Pages dynamiques
Bordeaux
13 déc. 2016, 28 fév. 2017
6 juin 2017
Bruxelles
Geneve
- Les serveurs Web (Apache, IIS). Wampserver.
- Comprendre le fonctionnement de base des protocoles TCP/IP, HTTP, FTP. Les URL. Les services réseaux
complémentaires (DNS, DHCP, ...).
- Achat et gestion du nom de domaine. Choisir un hébergeur. Architecture technique. Organisation.
15 nov. 2016, 21 mar. 2017
27 juin 2017
15 nov. 2016, 21 mar. 2017
27 juin 2017
Grenoble
13 déc. 2016, 28 fév. 2017
6 juin 2017
Lille
13 déc. 2016, 14 fév. 2017
16 mai 2017
Luxembourg
15 nov. 2016, 21 mar. 2017
27 juin 2017
Lyon
13 déc. 2016, 28 fév. 2017
6 juin 2017
Montpellier
13 déc. 2016, 14 fév. 2017
16 mai 2017
Nantes
13 déc. 2016, 14 fév. 2017
16 mai 2017
Rennes
13 déc. 2016, 14 fév. 2017
16 mai 2017
Sophia-antipolis
13 déc. 2016, 14 fév. 2017
16 mai 2017
Strasbourg
13 déc. 2016, 14 fév. 2017
16 mai 2017
Toulouse
13 déc. 2016, 28 fév. 2017
6 juin 2017
- Mise en oeuvre de l'ensemble des opérations d'administration effectuées par le webmaster.
- Gestion des noms de domaine, transfert ftp.
- Création de messages d'erreur personnalisés, gestion des fichiers journaux.
- Suivi et analyse des statistiques.
- Présentation des langages HTML, XHTML, HTML5. Différences entre les navigateurs.
- Structure, liens, hypertexte.
- Les images, les cadres. Les formats vectoriels.
- La mise en page. Les feuilles de styles. Le langage CSS.
- Tableaux et calques.
- Techniques pour réussir son référencement sur les moteurs de recherche. Les méta-tags.
- Définition et intégration de composants Plug-ins. Flash, Silverlight, Java, ActiveX.
Travaux pratiques
Réalisation de pages complexes HTML avec Dreamweaver. Création de feuilles de style, préparation de la
page au référencement.
4) Les formulaires
- Contraintes et avantages. Syntaxe, structure, champs de saisie, boutons, cases à cocher, listes, zones de
texte, sélections de fichier.
Travaux pratiques
Réalisation d'un formulaire avec envoi des données vers la messagerie et une base de données.
- Créer une charte graphique. Intégrer une charte graphique.
- Mise en oeuvre d'outils graphiques pour concevoir une interface évoluée.
- Développement d'animations avec Flash.
- Les ressources graphiques GIF, JPEG, PNG. Utiliser Photoshop ou Gimp.
Travaux pratiques
Conception d'un modèle de page HTML avec Fireworks, composant Flash. Intégration de plug-ins
multimédias pour visualiser des composants Flash, Shockwave.
6) Ergonomie et accessibilité d'une application Web
- Charte graphique. Règles d'usability. Ecueils graphiques à éviter pour faire un site efficace (navigation, mise
en page, contraintes techniques). Modèles de pages.
page 159
- Accessibilité. Norme. Impact sur le développement. Mettre en conformité un site Web. Outils de test et de
validation en ligne.
Travaux pratiques
Définir le cahier des charges de la charte graphique. Mise en oeuvre d'outils de test et audit pour
l'accessibilité.
7) Pages dynamiques
- Différence entre serveur web et serveur d'application.
- Mode de fonctionnement, sécurité. Les méthodes GET et POST. Les variables serveur.
- Les serveurs web du marché.
- Les langages de scripts serveur et leurs plateformes de développement : ASP, ASPX, JSP, PHP.
- Appel de services Web.
- Intégration de requêtes SQL dans la page pour insérer, supprimer, modifier des données de la base.
Travaux pratiques
Développer des pages dynamiques, interrogation d'une base de données, de services web.
- Les technologies d'interfaces graphiques : HTML5, XAML, Flex.
- Présentation et mise en oeuvre de solutions Rich internet Application (RIA) et Rich Desktop Application
(RDA).
- Présentation des solutions Adobe AIR, Microsoft SilverLight, Framework Google.
Travaux pratiques
Démonstration et mise en oeuvre de ces multiples technologies.
- Syntaxe du langage. Contrôles de saisie d'un formulaire.
- DOM et Ajax.
- Présentation Ecmascript et émergence du langage Actionscript.
- Présentation des offres du marché à base de Javascript (Google API, Widgets...).
- Récupérer, savoir débuguer vos programmes.
Travaux pratiques
Utilisation du JavaScript pour ajouter des effets DHTML et des contrôles sur formulaire, gestion
d'événements en JavaScript Intégration de scripts existants.
page 160
Réf : ITF
Participants
Développeurs de sites
Web, Web designers,
acteurs du marketing ou de
l'informatique.
Pré-requis
Aucune connaissance
particulière.
Prix 2017 : 1410€ HT
Design d'un site Web, comment faire un site attractif et
efficace
Ce stage vous apprendra à concevoir un site attractif et efficace répondant à la stratégie de votre entreprise.
Il vous montrera les points à prendre en compte : positionnement, design, ergonomie, accessibilité, écriture,
gestion du contenu, organisation, techniques d'animation, syndication et conduite de projets.
Connaître les principales règles d'usabilité et d'accessibilité d'un site web
Gérer et optimiser le contenu de marque diffusé sur le site web
Maîtriser les techniques d'animation d'un site web
Optimiser son référencement et accroître le trafic
Dates des sessions
Paris
17 nov. 2016, 20 mar. 2017
18 mai 2017, 10 juil. 2017
Aix
3) Accessibilité
7 nov. 2016
Bordeaux
8 déc. 2016
Grenoble
7 nov. 2016
Lille
7 nov. 2016
Lyon
7 nov. 2016
Montpellier
8 déc. 2016
Nantes
8 déc. 2016
Rennes
8 déc. 2016
Sophia-antipolis
7 nov. 2016
Strasbourg
7 nov. 2016
Toulouse
8 déc. 2016
- Impacts de la stratégie de l'entreprise sur la conception.
- Analyse selon le type de site et l'objectif.
- Forces et faiblesses de l'environnement dans la conception (SWOT).
- Quel positionnement pour atteindre sa cible ?
Travaux pratiques
Positionner un site exemple.
- Comportement des utilisateurs. Définition de l'usability. Règles de base de l'ossature du site.
- Standards et contraintes des terminaux Web. Tests de conception. Adaptation du design aux terminaux
mobiles.
- Impact du design sur les choix Flash, HTML5, Web 2.0...
Travaux pratiques
Définir une mise en forme adaptée à un site et écrire des textes orientés Web.
3) Accessibilité
- Législation. Référentiels d'accessibilité. Le W3C, le WCAG, BrailleNet...
- L'accessibilité et le développement HTML et CSS.
Travaux pratiques
Création d'une page valide et accessible. Correction des erreurs d'accessibilité. Tests sur les sites existants.
- Lier le design Web, la stratégie et la communication.
- Valoriser une marque. Brief et stratégie créative. Charte graphique.
Travaux pratiques
Définir une charte graphique et utiliser un outil de maquettage fonctionnel.
- Création de rubriques : la méthode Mind Mapping.
- Organisation du contenu, publication. Outillage.
- Gérer un contenu collaboratif. Droits d'auteur. Référencement.
Travaux pratiques
Utiliser un logiciel de publication Web.
- Concevoir un site Web 2.0 : animation, ergonomie...
- Jeux-concours, quiz, blogs, couponing, forums, mail...
- Comment faire un bon référencement ? Adaptation du design aux réseaux sociaux.
Travaux pratiques
Découvrir les techniques d'animation de différents sites.
page 161
- Suivi et analyse de trafic. Analyse de référencement et positionnement. Techniques pour accroître le trafic.
Travaux pratiques
Création, analyse et positionnement de référencement. Analyse statistique et approches des SEO.
- Audit juridique du site : les risques. Conduite de projet : maquettage, développement...
page 162
Réf : OPS
Participants
Chef de projet, Webmestre,
développeur, designer,
toute personne liée au
développement et à la
promotion d'un site Web.
Pré-requis
concepts et technologies
Web.
Prix 2017 : 1410€ HT
Cette formation vous permettra de maîtriser les différentes techniques pour améliorer le référencement et
promouvoir votre site. Elle vous montrera également comment mettre en oeuvre et utiliser les outils d'analyse
et de mesure associés.
Comprendre le fonctionnement des moteurs de recherche
Mesure l'audience de son site
Maîtriser les techniques d'optimisation de son référencement naturel
Accroître la notoriété de son site avec le référencement payant
6) Accroître la popularité du site, campagne de
publicité Web
Dates des sessions
Paris
12 déc. 2016, 9 mar. 2017
6 juin 2017
- Les serveurs Web (Apache, IIS). Protocole HTTP.
- HTML, XHTML. Tests de validation, enjeux sur le référencement. Accessibilité.
Travaux pratiques
Création et audit de métatags, audit de conformité XHTML.
- Popularité. Classification des réponses. Langage de recherche. Principes de positionnement.
- Comprendre la recherche. Mots-clés.
- Les mises à jour d'algorythme Google Mayday, Panda, Penguin et Colibri.
- Google+ et le référencement : authorrank et author ship.
Travaux pratiques
Référencement sur des moteurs, annuaires, zones dédiées.
- Tableau de bord de suivi. Audit par mots-clés.
- Les outils de Google Adwords : affiner les mots-clés.
- Le pageRank et le TrustRank : la mesure de popularité et de confiance du site.
- Définir un plan d'action. Budget. Les partenaires.
Travaux pratiques
Mise en oeuvre d'un audit.
- Soumission, indexation, positionnement. Fréquence.
- Utilisation des balises : titres, images, liens, URL...
- Les SEO : Search Engine Optimizer. Les outils de référencement automatique : limites, coûts.
- Paiement au clic. Liens sponsorisés. Mesurer le taux de transformation d'une campagne.
- L'offre des sites Google et Bing. Achat de mots-clés.
- Le référencement et les réseaux sociaux (facebook, google+, partage de vidéos).
Travaux pratiques
Mise en oeuvre des techniques. Réécriture de contenu.
- Intégration de multimédia, Flash, JavaScript, Frames.
- Optimisation : MetaTag, Tag (url, alt, title... ).
- Impact des technologies riches (Ajax, Flash, SilverLight) et Web 2.0 sur le référencement.
Travaux pratiques
Mise en oeuvre et analyse sur des sites existants.
6) Accroître la popularité du site, campagne de publicité Web
- Référencement dans les stores.
- Principes de promotion dans l'Appstore et Google Play.
- Présentation des offres Adwords et AdSense.
- Budget. Création et optimisation de la campagne.
- Utilisation des gadgets, des offres cartographiques (maps) et Local Business.
- Usage des espaces vidéo, newsletters, forums, jeux, ...
page 163
Travaux pratiques
Mise en place d'une campagne Google AdWords. Définition d'un plan d'animation.
page 164
Réf : KCX
Participants
Candidats à la certification
FFP "Concepteur de sites
Web".
Pré-requis
Avoir suivi l'intégralité des
stages du cycle certifiant
"Concepteur de sites Web".
Certification Concepteur de sites Web
OBJECTIFS
Cette journée est destinée à valider les connaissances acquises au cours du cycle certifiant " Concepteur de
sites Web". Les compétences validées portent sur l'ensemble des technologies nécessaires à la réalisation
du site (HTML, XML, Web 2.0, ...), sur leur design et ergonomie ainsi que leur référencement.
1) Présentation des épreuves
2) Questionnaire à choix multiple
3) Travaux pratiques
4) Entretien individuel avec l'examinateur
Prix 2017 : 550€ HT
Certification
Dates des sessions
Dans le cadre de cette journée, les participants auront à répondre à un QCM, à réaliser des travaux pratiques
et passer un entretien individuel avec l'examinateur.
Paris
21 nov. 2016, 13 mar. 2017
9 juin 2017
Composition du
cycle
- Dreamweaver CS6,
- Présentation du déroulé des épreuves (timing, documents autorisés, etc ...).
- Questions de la salle.
- Questions ouvertes et fermées sur les connaissances essentielles des technologies web.
- JavaScript, HTML
dynamique
- Exercices sur la création d'un mini-site et le respect des règles apprises.
client
- Lever les éventuelles ambiguïtés liées au QCM pour récupérer des points perdus faute de temps ou
d'attention.
- Explication des choix faits concernant le TP.
Web côté client
dynamiques
- JavaScript,
perfectionnement
Google
adaptables
de développement
page 165
Réf : HTX
Participants
à tous les informaticiens
développer un site Web et de
construire une interface Web
interactive et dynamique.
Pré-requis
des composants d'une
architecture Web.
OBJECTIFS
Dreamweaver est l'atelier de conception de pages Web le plus répandu sur le marché. En découvrant ses
fonctionnalités, vous apprendrez à maîtriser l'éditeur de pages XHTML/HTML, la mise en forme graphique au
moyen des feuilles de style CSS, tout en prenant en compte l'accessibilité des sites Web.
1) Rappels Web
6) JavaScript
Prix 2017 : 2440€ HT
1) Rappels Web
- Les protocoles d'un site web : HTTP, FTP, SMTP, POP3.
- Fonctionnement d'un site Web. HTML, URL.
Dates des sessions
Travaux pratiques
Paramétrage du navigateur, du serveur Web, création d'un environnement de développement.
Paris
15 nov. 2016, 14 mar. 2017
27 juin 2017
- Présentation de la suite Adobe CS6.
- Prise en main de Dreamweaver. L'interface.
- Les différents types d'affichage.
- Conception graphique HTML.
- Interface de gestion de projets (PhoneGap, jQuery Mobile, transfert FTP).
Travaux pratiques
Découverte de l'éditeur, construction de pages. Développement de pages XHTML.
- Les feuilles de style CSS. L'assistant de codage CSS.
- Création de formulaires. Contrôles de saisie.
- Définition de zones de contenus à l'aide des boîtes.
- Découverte des templates mobiles, Grid System.
- Découverte du Responsive Web Design avec l'assistant Dreamweaver CS6 (mise en forme de grilles
fluides) .
Exercice
Création de CSS, de tableaux. Import de pages. Création d'un formulaire et appel de serveur.
- Construction de la charte graphique.
- Création d'un modèle de page avec Fireworks ou Photoshop.
- Accessibilité, la priorité 2 du WAC/W3C.
Exercice
Test de compatibilité XHTML et d'accessibilité. Mettre en oeuvre une charte graphique.
- Intégration de composants graphiques. Le Rollover.
- Utilisation de l'inspecteur de tags.
- Les propriétés CSS3 et l'assistance Dreamweaver CS6.
Exercice
Création de contrôles en JavaScript, intégration de multiples composants multimédias.
6) JavaScript
- Syntaxe JavaScript. Les objets Script.
- Création dynamique de code JavaScript et association aux événements. Débogage de code.
Travaux pratiques
Contrôles sur les formulaires, ouverture de pop-up, traitement sur les div.
- Paramétrage de la connexion ODBC.
- Gestion dynamique des bases de données.
- Interrogation SQL sur une table.
page 166
- Génération des tableaux dynamiques de résultats. Utilisation des tables pour générer des formulaires.
- Définir un site administré par CMS dans Dreamweaver.
- Création graphique d'un appel Ajax avec SPRY Dataset.
- Gestion des formulaires de login.
Travaux pratiques
Connexion à une base. Création d'une table d'utilisateurs, génération de pages de login.
page 167
Réf : DHL
Participants
projets Web.
Best
HTML. Connaissances de
base en programmation.
Le langage JavaScript est devenu incontournable dans le développement de sites Web, tant pour sa
relation forte à l'interface graphique que pour le traitement client/serveur. Ce stage vous apportera toute
la connaissance pour interfacer le langage avec les éléments graphiques des pages Web et ainsi pouvoir
réaliser des menus déroulants, des animations, modifier dynamiquement les styles de présentation ou encore
réagir aux actions de l'utilisateur... Il vous apprendra également à lancer des requêtes au serveur (Ajax) et à
manipuler des données XML.
Prix 2017 : 2440€ HT
Pré-requis
Dates des sessions
Paris
11 oct. 2016, 15 nov. 2016
20 déc. 2016, 17 jan. 2017
14 fév. 2017, 14 mar. 2017
11 avr. 2017, 9 mai 2017
13 juin 2017, 18 juil. 2017
22 aoû. 2017
Aix
6 déc. 2016, 21 fév. 2017
30 mai 2017
Maîtriser la syntaxe du langage JavaScript
Manipuler la structure DOM d'une page HTML
Gérer la programmation événementielle
Interagir avec les feuilles de style CSS
Gérer des échanges asynchrones AJAX
5) Interaction avec les feuilles de style en
cascade
7) Ajax
Bordeaux
Travaux pratiques
20 déc. 2016, 28 fév. 2017
16 mai 2017
Programmation JavaScript, manipulation du DOM, gestion de l'interactivité.
Bruxelles
22 nov. 2016, 7 mar. 2017
6 juin 2017
Lille
- Présentation des types de navigateurs. Impact sur la portabilité des programmes JavaScript. Versions de
JavaScript.
- Les composants Web : HTML, XHTML, CSS, JavaScript, Flash, Java... Les protocoles HTTP, HTTPS.
- Impact de JavaScript sur l'accessibilité et le référencement.
- Importance de JavaScript sur les sites Web 2.0. Impact de la conformité XHTML sur l'utilisation dynamique
de JavaScript.
- Les outils de développement (éditeur, débogueur...).
6 déc. 2016, 21 fév. 2017
30 mai 2017
Geneve
22 nov. 2016, 7 mar. 2017
6 juin 2017
Grenoble
8 déc. 2016, 28 fév. 2017
16 mai 2017
Luxembourg
22 nov. 2016, 7 mar. 2017
6 juin 2017
Lyon
6 déc. 2016, 28 fév. 2017
16 mai 2017
Montpellier
11 oct. 2016, 20 déc. 2016
21 fév. 2017, 30 mai 2017
Nantes
11 oct. 2016, 20 déc. 2016
21 fév. 2017, 30 mai 2017
Rennes
20 déc. 2016, 21 fév. 2017
30 mai 2017
Sophia-antipolis
- Déclaration et portée des variables.
- Types de données (Number, Boolean, Date, Math, String, Array). Conversion de type. Détection de type
avec typeof.
- Gestion des tableaux. Opérateurs logiques et arithmétiques. Boucles (for, while...).
- Création de fonctions et paramétrage variable.
- Faire un codage sécurisé avec la gestion d'erreur et les exceptions.
- Rappels sur les concepts objets. Développement Objet en JavaScript : création de classes (méthodes,
propriétés).
- Constructeur. Surcharge. Mots réservés prototype, this. Création d'instance. Usage d'Object sur les classes
dynamiques.
- Utilisation du format JSON pour la création de classes.
- Les objets prédéfinis du langage (Array, Date, String, Regexp...) et leur utilisation. Extension des objets
prédéfinis.
Exercice
Mise en oeuvre des différentes fonctionnalités JavaScript à travers de multiples travaux pratiques.
6 déc. 2016, 21 fév. 2017
30 mai 2017
Strasbourg
- Organisation des événements. Impact des événements sur les types de navigateurs et versions de DOM.
- Positionner des écouteurs sur des événements par programme et paramétrage de balises HTML.
- Règles pour faire un codage multinavigateur.
- Créer, détruire des écouteurs.
- Les traitements événementiels JavaScript : gestionnaire clavier, souris, formulaires, rollover, menus
dynamiques.
- L'objet Event et son utilisation.
- Les objets du DOM (window, document...) et leur manipulation.
- Manipulation des URL (redirections http ...).
- Gestion des cookies (lecture et écriture).
8 déc. 2016, 21 fév. 2017
30 mai 2017
Toulouse
11 oct. 2016, 20 déc. 2016
28 fév. 2017, 16 mai 2017
Exercice
Programmation d'événements multiples sur les éléments formulaire, souris, clavier...
page 168
- Manipulation de contenu de formulaires.
- Accès et modification dynamique des composants du formulaire : zone de saisie, cases à cocher, cases
d'options...
- Fonctions de validation de formulaire.
- Evénements liés aux éléments de formulaire : changement, initialisation, clic...
Exercice
Conception de fonctions personnalisées contrôlant les activités de l'utilisateur.
5) Interaction avec les feuilles de style en cascade
- Rappel sur les feuilles de style en cascade (CSS-1, CSS-2). Les outils pour les manipuler.
- Implémentation des CSS en tant que propriétés des objets du DOM.
- Modification directe des propriétés CSS des objets du DOM.
- Modification de l'objet CSS stylesheets.
- Rendre la page dynamique via le changement des propriétés de style.
Exercice
Réalisation de pages simples afin de se familiariser à l'utilisation de feuilles de style et à leur manipulation à
travers JavaScript.
- Présentation du langage XML (éléments attributs).
- Implémentation des parseurs XML chez Microsoft IE et les autres : variantes entre les navigateurs,
maintenance...
- Manipulation des objets du DOM (lecture, ajout, suppression, modification de noeuds).
Exercice
Familiarisation à la construction d'un chemin d'accès à un élément du DOM.
7) Ajax
- Présentation de Asynchronous JavaScript And Xml.
- Enjeux, solutions et alternatives.
- Les bibliothèques du marché.
- HTTP et Ajax : échanges HTTP et l'objet XMLHttpRequest.
Exercice
Récupération de données XML et affichage des données. Interrogation d'une base de données. Création d'un
formulaire de connexion.
page 169
Réf : PAJ
Participants
Web, informaticiens.
Pré-requis
Javascript et en technologies
Web côté client.
Prix 2017 : 1960€ HT
Dates des sessions
Paris
28 nov. 2016, 6 fév. 2017
2 mai 2017
OBJECTIFS
Ajax est devenu une technologie incontournable du développement d'applications riches Web 2.0. Durant ce
cours, vous apprendrez la manipulation de ses composants, le CSS, le DOM, ainsi qu'à établir des échanges
client-serveur.
1) Ajax
6) XMLHttpRequest
8) Compléments
1) Ajax
- Les objectifs d'Ajax. Principes de fonctionnement.
- Choisir entre Ajax et Flash, Applet, Html. Application.
- La structure XML. Les namespaces.
- Les moyens de validation XML : DTD et XSD.
- Limite du XPath. Mise en oeuvre XSLT en Ajax.
- La programmation Objet. Types. Variables. Tableaux.
- Ecmascript. Emergence d'ActionScript.
Travaux pratiques
Création d'une structure XML bien formée et valide. Manipulation de classes et d'objets.
- Avantages et inconvénients dans les échanges.
- Objets, Arrays, syntaxe et parseur JSON.
- JSON, avantages et inconvénients.
- Sérialisation entre client et serveur.
- Importance du langage XHTML. Composants DHTML.
- Le rôle du DOM dans la programmation XML.
- Gestion dynamique de CSS.
Travaux pratiques
Modification dynamique du DOM d'une page HTML.
- Présentation XSLT. Langage Xpath. Format RSS.
Travaux pratiques
Traitement XSLT. Usage de flux RSS.
6) XMLHttpRequest
- Créer et utiliser un objet XMLHttpRequest.
- Outils de débogage (IE Toolbar, Firebug).
- Modification des en-têtes HTTP.
- Encodage et décodage des données.
- Gestion des erreurs. Gestion du cache.
Travaux pratiques
Gérer une table produit, un formulaire de login en Ajax. Remplir dynamiquement un menu déroulant.
- Threads. Usage d'iFrame pour les appels client/serveur.
- Traitements asynchrones, synchrones.
- Problématiques de sécurité et performance : cryptage, compression, débogage, offuscation.
- Mise en place de proxy crossDomain.
Travaux pratiques
Mise en oeuvre de requêtes asynchrones et multithreads. Développement Ajax en jQuery.
page 170
8) Compléments
- Framework Ajax, Java, .NET. Ajax et XUL.
- Présentation de la programmation Ajax avec HTML5.
- Ajax et les API Google : Google Search et Google Maps.
Travaux pratiques
Développer en Javascript un exemple de cartographie. Développement Ajax sous HTML5.
page 171
Réf : KEX
Participants
FFP "Développeur Web côté
client".
Certification Développeur Web côté client
Cette journée est destinée à valider les connaissances acquises au cours du cycle certifiant "Développeur
Web côté client". Les compétences validées portent sur l'ensemble des technologies nécessaires à la
réalisation du site (HTML, XML, Web 2.0, ...), sur leur design et ergonomie ainsi que leur référencement.
Pré-requis
"Développeur Web côté
client".
Entrez ici un objectif pédagogique
Prix 2017 : 550€ HT
Certification
Dates des sessions
Paris
12 déc. 2016, 10 fév. 2017
5 mai 2017
Composition du
cycle
- Présentation du déroulé des épreuves (timing, documents autorisés, etc ...).
dynamiques
- JavaScript,
perfectionnement
- Exercices sur la création d'un mini-site et le respect des règles apprises.
Google
- Questions ouvertes et fermées sur les connaissances essentielles des technologies web.
d'attention.
adaptables
de développement
page 172
Réf : HCS
Participants
projets Web.
Pré-requis
HTML et CSS.
HTML5, CSS3, orienter votre conception vers des sites
Web modernes et dynamiques
Best
Cette formation vous apprendra à créer des pages et des applications Web en utilisant HTML5 et CSS3.
Vous découvrirez les avancées proposées par le HTML5 notamment en termes d'interfaces Web riches/RIA,
de multimédia et de moyens de communication permettant la mise en œuvre d'applications client/serveur
attractives.
Prix 2017 : 1440€ HT
Dates des sessions
Concevoir et développer des applications Web en HTML 5 et CSS 3
Mettre en place et valider la structure HTML 5 des pages Web
Habiller des pages Web en CSS 3 afin de les rendre plus attractives
Rendre responsive design les pages Web d'un site
Intégrer des animations et du contenu multimédia
Paris
6 oct. 2016, 3 nov. 2016
1 déc. 2016, 12 jan. 2017
9 fév. 2017, 2 mar. 2017
6 avr. 2017, 2 mai 2017
1 juin 2017, 6 juil. 2017
31 aoû. 2017
Aix
8 déc. 2016, 23 fév. 2017
23 mai 2017
1) Rappels
Bordeaux
15 déc. 2016, 2 fév. 2017
4 mai 2017
1) Rappels
Bruxelles
- Rappels sur les versions HTML (HTML 4, XHTML 1.x, XHTML 2).
- Les DTD : strict, transitional, frameset.
- Les différents composants d'un document HTML : titres, paragraphes, liens, tableaux, formulaires...
- Les commentaires.
- La structure composite d'un document HTML : images, feuilles de style CSS, JavaScript, Flash...
- Position des navigateurs face aux technologies HTML.
15 déc. 2016, 16 fév. 2017
23 mai 2017
Geneve
15 déc. 2016, 16 fév. 2017
23 mai 2017
Grenoble
8 déc. 2016, 2 fév. 2017
4 mai 2017
Lille
8 déc. 2016, 23 fév. 2017
23 mai 2017
Luxembourg
- Les objectifs de HTML 5.
- Le WhatWG versus W3C.
- Les principaux concepts et apports.
- Les différents composants : balises, formulaires, audio, vidéo, API, etc.
- Outils de développement HTML 5.
- Test de compatibilité, méthode de détection HTML 5.
13 oct. 2016, 15 déc. 2016
16 fév. 2017, 23 mai 2017
Lyon
6 oct. 2016, 8 déc. 2016
2 fév. 2017, 4 mai 2017
Montpellier
15 déc. 2016, 23 fév. 2017
23 mai 2017
Nantes
15 déc. 2016, 23 fév. 2017
23 mai 2017
Rennes
15 déc. 2016, 23 fév. 2017
23 mai 2017
Sophia-antipolis
8 déc. 2016, 23 fév. 2017
23 mai 2017
Strasbourg
8 déc. 2016, 23 fév. 2017
23 mai 2017
Toulouse
15 déc. 2016, 2 fév. 2017
4 mai 2017
Travaux pratiques
Démonstrations. Découvertes des possibilités et du champ d'action.
- Les éléments traditionnels structurant un document HTML 5 (doctype, html, head, body, meta ...).
- L'élément <nav> et la mise en place d'informations de navigation internes au site.
- L'élément <section> et la mise en place de blocs de contenus.
- L'élément <article> et la mise en place de contenus indépendants du document.
- L'élément <aside> et la mise en place de blocs d'informations complétant un contenu principal.
- Les éléments <header> et <footer> et la mise en place de sections d'introduction et de conclusion d'un bloc.
- Les autres balises de structure.
- Les nouvelles catégories de contenus : Metadata content, Flow content, Sectioning content, Heading
content.
- Les nouvelles catégories de contenus : Phrasing content, Embedded content, Interactive content.
- La validation des pages avec le valideur officiel du W3C.
- Intérêt de ses nouvelles balises de structure.
- Imbrication et type de contenu.
Travaux pratiques
Mise en place et validation de la structure d'un document HTML 5.
- Les balises et attributs obsolètes.
page 173
- Différence Canvas vs SVG.
- Les nouvelles balises : <mark>, <meter>, <time>, <figure>, <picture>...
- Les extensions de balises HTML existantes.
- Les nouveaux attributs : a, fieldset, iframe, area, button...
- Les microformats. Présentation et avantages sur le référencement. Attributs itemprop='nationality'...
- Les formulaires. Les nouveaux types de la balise <input> (email, date, week...).
- Les nouveaux champs de formulaires : range, autofocus, placeholder, menu...
- Le contrôle et la validation de formulaires.
- Les formats multimédias. Codecs et API Multimédia.
- Gestion vidéo et audio avec les nouvelles balises <audio> et <video> HTML 5.
Travaux pratiques
Création de templates HTML 5. Positionnement d'éléments en absolu. Nombreux TP sur la mise en œuvre
des balises HTML 5 (formulaires, conception...). Réalisation d'un lecteur multimédia.
- Sélecteurs de répétition nth-child(even).
- Sélecteurs de cible target.
- Sélecteurs frère antérieur ~.
- Sélecteurs d'enfant unique only-child.
Travaux pratiques
Intégration de CSS 3 aux applications Web. Sélection d'éléments d'une page HTML 5.
- Rappel sur les déclarations rgb et rgba.
- Les modèles hsl et hsla.
- La propriété opacity.
- Support des polices distantes @font-face.
- Mise en forme du texte.
- Gestion des débordements par text-overflow.
- Gestion des enchaînements par wrap-option, white-space-treatment...
- Effets de couleur et d'ombre sur texte text-fill-color, text-shadow...
Travaux pratiques
Application de couleurs. Mise en forme de textes. Gestion multicolonne.
- Les ombres avec box-shadow.
- Les coins arrondis avec border-radius...
- Les fonds multiples.
- Les gradients de fond (-webkit-gradient).
- Les fonds ajustés aux conteneurs.
Travaux pratiques
Appliquer des ombres et des arrondis.
- Les transformations : translations, rotations, homothéties (-webkit-transform).
- Les animations : les animations, les transitions (#webkit-transition).
Travaux pratiques
Animations et effets de transition.
page 174
Réf : JPG
Participants
projet Web.
Pré-requis
en JavaScript et HTML.
XML.
Prix 2017 : 2440€ HT
Le langage JavaScript est devenu incontournable pour le développement d'applications client riches. Ce
cours vous donnera tout le savoir-faire technologique pour mettre en oeuvre de véritables applications Web à
partir de concepts avancés JavaScript ES5, tout en vous préparant à l'utilisation de ES2015.
Découvrir les concepts avancés JavaScript ES5
Mettre en pratique la Programmation Orientée Objet
Maîtriser l'environnement de débogage
Mettre en œuvre le Framework JavaScript jQuery
Manipuler les API JavaScript HTML5
Appréhender la notion de JavaScript côté serveur avec Node.js
Dates des sessions
Paris
24 oct. 2016, 15 nov. 2016
14 fév. 2017, 9 mai 2017
1) Rappels JavaScript : ES5, DOM, événement,
manipulation
2) Framework jQuery
1) Rappels JavaScript : ES5, DOM, événement, manipulation
- Les méthodes de création dynamique d'objets.
- Phases des événements capture, capturing, bubble.
- La gestion des événements. Les objets de type Event.
- Structure de données XML et JSON
- Les méthodes avancées en ES5.
Exercice
Echange de données JSON. Création d'événements.
2) Framework jQuery
- Fonctionnement et intégration.
- Gestion et délégation des événements.
Travaux pratiques
Créer un plugin jQuery.
- Les nouveautés principales.
- ES6 en production.
Travaux pratiques
Mise en production de code ES2015 avec TypeScript et Node.js.
- Rappels sur l'objet. Propriétés.
- La chaîne de portée. La chaîne de prototype.
- Design Pattern Clés en JavaScript.
- Closure function. Singleton et Modules.
Exercice
Mise en pratique de la POO. Développer un micro Framework de gestion du DOM.
- Bien utiliser l'objet RegExp.
- Validation asynchrone.
Travaux pratiques
Contrôle de dates, email.
- Chrome Devtools, Firefox Developper, Node-debug
- Gérer les messages d'erreur client en production.
- Tests multinavigateurs. Stockage des tests.
page 175
- Tests de performance.
Travaux pratiques
Recherche de bugs et optimisation des performances avec les ChromeDevtools.
- Compenser les latences de communication.
- JSON Web Token, sécuriser les échanges.
- Ajax et XMLHttpRequest, consommation de services distants.
- Serveur JavaScript Node.js.
Travaux pratiques
Appel de services Web. Utiliser une base embarquée, échanges avec la base distante.
- Nouveaux événements.
- Gestion des API multimédia.
- Modes de communication client/serveur.
- Utilisation des Web Worker.
- Le développement mobile "offline first".
- Technique d'optimisation des communications client/serveur.
Travaux pratiques
Manipulation des API JavaScript sous HTML5.
page 176
Réf : FAN
Participants
Pré-requis
JavaScript.
Prix 2017 : 1960€ HT
Dates des sessions
Paris
10 oct. 2016, 14 nov. 2016
12 déc. 2016, 23 jan. 2017
20 fév. 2017, 20 mar. 2017
18 avr. 2017, 15 mai 2017
26 juin 2017, 17 juil. 2017
21 aoû. 2017
Aix
28 nov. 2016, 19 déc. 2016
27 fév. 2017, 24 avr. 2017
26 juin 2017
Best
Développé par Google, AngularJS est un framework structurant et simplifiant le développement des
applications riches côté client. Cette formation vous apportera la maîtrise des fonctionnalités clés du
framework : filtres, contrôleurs, templates... Vous verrez également son intégration dans une architecture
REST.
Maîtriser les fonctionnalités clés du Framework (filtres, contrôleurs, routes, templates...)
Intégrer AngularJS dans une architecture orientée REST
Intégrer des tests automatisés
Travaux pratiques
Angers
Vous transformerez une maquette HTML en "Single Page Application" utilisant les fonctionnalités du
framework AngularJS.
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Bordeaux
14 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Bruxelles
21 nov. 2016, 10 avr. 2017
12 juin 2017
Dijon
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Geneve
21 nov. 2016, 10 avr. 2017
12 juin 2017
Grenoble
21 nov. 2016, 19 déc. 2016
20 fév. 2017, 18 avr. 2017
19 juin 2017, 28 aoû. 2017
Lille
21 nov. 2016, 19 déc. 2016
27 fév. 2017, 24 avr. 2017
26 juin 2017
Luxembourg
21 nov. 2016, 10 avr. 2017
12 juin 2017
Lyon
21 nov. 2016, 19 déc. 2016
20 fév. 2017, 18 avr. 2017
19 juin 2017, 28 aoû. 2017
Montpellier
14 nov. 2016, 27 fév. 2017
24 avr. 2017, 26 juin 2017
Nancy
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
- Composants d'une application Web. HTML5 et CSS3.
- Outils de développement Web/JavaScript.
- Moteurs de rendu HTML et JavaScript. DOM, BOM.
- JavaScript rappels : prototypes, closures et callbacks.
- Rappels sur les concepts objet en JavaScript.
- Application Ajax orientée REST.
Exercice
Configuration de l'environnement.
- AngularJS, positionnement : jQuery, ExtJS...
- Intégration. Compatibilité, versions, documentation.
Exercice
Préparation d'une maquette HTML pour développer avec AngularJS.
- Création et utilisation des contrôleurs.
- Gestion du contexte, la variable $scope.
- Traitement et validation des formulaires.
Exercice
Intégration des contrôleurs.
- Fonctionnalités de l'objet angular.
- Découper son application.
Nantes
Exercice
Modularisation de l'application.
14 nov. 2016, 27 fév. 2017
24 avr. 2017, 26 juin 2017
page 177
Orleans
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Rennes
14 nov. 2016, 27 fév. 2017
24 avr. 2017, 26 juin 2017
Rouen
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Sophia-antipolis
21 nov. 2016, 19 déc. 2016
27 fév. 2017, 24 avr. 2017
26 juin 2017
- Routing. API ($routeProvider). Le "deep linking".
- Historique et accès aux paramètres de l'URL.
- Utilisation de $location et $routeParams. Modes Hashbang et HTML5.
- Prétraitement des vues. Utilisation des "fragments".
Exercice
Création d'une "Single Page Application".
- API ($provide, $injector). Création de provider.
- Les méthodes : Service, Factory, Provider, Value.
- Requête Ajax avec le service $http. Intégration REST avec le service $resource. WebSockets. API Promise.
- Intégration avec Node.js.
Exercice
Intégration REST avec Node.js.
Strasbourg
21 nov. 2016, 19 déc. 2016
27 fév. 2017, 24 avr. 2017
26 juin 2017
Toulouse
14 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
Exercice
Création des tests unitaires.
Tours
21 nov. 2016, 20 fév. 2017
18 avr. 2017, 19 juin 2017
28 aoû. 2017
- Yeoman, optimisation du développement.
- Internationalisation (I18N), mise en oeuvre.
Démonstration
Mise en oeuvre.
page 178
Réf : RPO
Participants
Développeurs, designers,
chefs de projets et
webmasters.
Pré-requis
HTML et CSS.
Prix 2017 : 1410€ HT
Dates des sessions
Responsive Web Design, créer des interfaces Web
adaptables
Best
Les concepteurs de sites Web doivent dorénavant revoir leur approche pour que leurs interfaces s'adaptent
à la diversité des terminaux. Cette formation apporte des réponses pratiques aux problématiques de
conception ergonomique et de gestion des contraintes liées au Responsive Design.
Concevoir et développer des interfaces Web pour tous types de terminaux
Adopter une approche de conception ergonomique Mobile First
Découvrir les composants graphiques, les Frameworks et les librairies Responsives
Optimiser les performances d'affichage des pages sur mobiles et ordinateurs
Paris
9 nov. 2016, 9 fév. 2017
20 avr. 2017, 8 juin 2017
Aix
15 déc. 2016, 16 mar. 2017
6 juin 2017
1) Les terminaux
3) MediaQueries
Bordeaux
8 déc. 2016, 23 mar. 2017
15 juin 2017
Bruxelles
15 déc. 2016, 9 fév. 2017
18 mai 2017
Geneve
15 déc. 2016, 9 fév. 2017
18 mai 2017
Grenoble
15 déc. 2016, 23 mar. 2017
15 juin 2017
1) Les terminaux
- Types de terminaux (mobile, tablette, tv, liseuse...) et leur résolution. Périphériques, OS, navigateurs.
- Le marché mobile et parts de marché.
- Standards HTML, HTML5, CSS3 (API, sélecteurs...).
Travaux pratiques
Détection du type de terminal en PHP JavaScript.
Luxembourg
- Concept de Marcotte, Mobile First.
- Séparation contenu/contenant.
- Approche portrait/paysage, tactile, impact sur l'ergonomie.
- Créer un plan de tests.
- Différence entre design Web et design Mobile.
15 déc. 2016, 9 fév. 2017
18 mai 2017
3) MediaQueries
Lille
15 déc. 2016, 16 mar. 2017
6 juin 2017
Lyon
15 déc. 2016, 23 mar. 2017
15 juin 2017
Montpellier
8 déc. 2016, 16 mar. 2017
6 juin 2017
- Adaptation des CSS aux caractéristiques du terminal.
- Règles conditionnelles (orientation, device-width...).
- JavaScript et les anciens navigateurs.
- Réglage complémentaire de rendu visuel (Viewport).
Nantes
Travaux pratiques
Construction de CSS selon les modes portrait/paysage, résolution du terminal.
8 déc. 2016, 16 mar. 2017
6 juin 2017
Rennes
- Conception classique vs conception selon une grille.
- Importance des blocs, approche contenu/contenant.
- Unités de mesure (% em px), mode Retina.
- Eviter les débordements. Points de rupture.
- Principe des box, layout avec CSS3.
8 déc. 2016, 16 mar. 2017
6 juin 2017
Sophia-antipolis
15 déc. 2016, 16 mar. 2017
6 juin 2017
Strasbourg
15 déc. 2016, 16 mar. 2017
6 juin 2017
Travaux pratiques
Construire une ergonomie basée sur une grille flexible.
Toulouse
8 déc. 2016, 23 mar. 2017
15 juin 2017
- Images flexibles : images de fond, adaptation HTML5, adaptation de la qualité graphique selon le terminal.
- Contenu responsive : rupture texte, multicolonnes. Césure et découpe.
- Polices fluides : format des polices, taille.
- Marges et espaces flexibles.
- Menus adaptables, carrousel adaptatif.
- Créer des images et des vidéos adaptées.
Travaux pratiques
Mise en oeuvre de solutions.
page 179
- Détecter les ressources avec "Modernizr".
- Librairies de substitution (less, css3pie...).
- Frameworks CSS 960 grid, HTML5 BoilerPlate, Bootstrap, Foundation, Skeleton, 320...
Travaux pratiques
Utilisation de frameworks.
- Mesurer la performance de chargement, optimisation de bande passante. Répartition Client/Serveur.
- Optimisation des ressources graphiques.
- Gestion du cache.
Travaux pratiques
Audit de pages Web, corrections conceptuelles et techniques.
page 180
Réf : JVS
Participants
Cette formation s'adresse
à tout développeur, chef de
projet ou intégrateur Web
souhaitant optimiser les
temps de développement
par la maîtrise des utilitaires
modernes.
Pré-requis
JavaScript.
Prix 2017 : 1910€ HT
Dates des sessions
Industrialisation Front-End, maîtriser vos pratiques de
développement
Best
Depuis quelque temps, le langage JavaScript, en plein essor, a modifié l'environnement du développeur
Front-End. Ce stage vous présentera les outils modernes qui vous permettront de créer un Workflow efficace,
automatiser les tâches redondantes et produire des applications modulaires.
Maîtriser les "SuperSet" HTML CSS JavaScript
Automatiser les tâches de développement
Organiser son workflow
Intégrer efficacement les contributions
Paris
7 nov. 2016, 27 fév. 2017
15 mai 2017
Développement, présentation et mise en oeuvre d'applications existantes.
Travaux pratiques
Vous configurerez pour chaque étape de vos développements les outils d'optimisation afin de pouvoir au final
générer vos profils de projets.
- Structurer un projet d'application Web.
- HTML5, les frameworks (bootstrap, foundation...).
- CSS3, automatisation avec LESS ou SASS.
- JavaScript, normaliser le code en modules (API CommonJS et AMD).
- "SuperSet JavaScript" : simplifier le développement avec TypeScript.
- Organiser le développement JavaScript.
- Optimiser l'empreinte des ressources.
Travaux pratiques
Migrer une application Web en utilisant le développement modulaire JavaScript. Développer un Framework
CSS avec SASS.
- Offre du marché (SublimeText, Eclipse...).
- Choisir et configuer son IDE (extensions...).
- Quelles fonctionnalités attendre, "live Template", "code snippet".
- Les solutions pour développer en ligne (Cloud 9...).
- Les environnements pré-intégrés (PrePros).
Travaux pratiques
Découverte des différentes plates-formes. Personnaliser l'IDE SublimeText.
- Gestion de source : centralisée vs distribuée.
- Concepts de base, initialiser un repository.
- Organiser les branches de développement.
Travaux pratiques
Mise en place d'un processus de développement en branches.
- Présentation de Node.js. Le Node Package Manager
- Les modules indispensables pour le développeur.
- Npm et Bower, objectifs et confusion.
- Gestion des dépendances. Créer un package npm.
Travaux pratiques
Créer un module pour configurer les dépendances du projet.
page 181
- Présentation : automatisation des tâches.
- Définition des types de tâches : créer une commande.
- Structure d'un fichier gulptfile.js.
- Les contributions indispensables.
- Créer un "Build" efficace avec Gulp.
Travaux pratiques
Configurer et utiliser Gulp.
- Utilitaires de test : Jasmine, Mocha...
- Recommandation pour l'écriture des tests unitaires.
- Karma : présentation et configuration.
- Générer les rapports de test et de couverture du code.
Travaux pratiques
Tests unitaires avec Jasmine. Automatisation avec Karma et Istanbul.
- Présentation, avantage et inconvénient du scaffolding.
- Quels utilitaires : Yeoman, Lineman ?
- Les générateurs de Yo. Création de générateur.
page 182
Réf : KYF
Participants
"Développeur d'applications
Front-End".
Pré-requis
"Développeur d'applications
Front-End".
Prix 2017 : 550€ HT
Certification Développeur d'applications Front-End
journée de contrôle des connaissances
OBJECTIFS
Cette journée est destinée à valider les connaissances acquises au cours du cycle certifiant "Développeur
d'applications Front-End". Les compétences validées portent sur les technologies HTML 5, CSS 3 et
JavaScript nécessaires au développement de sites Responsive, la mise en œuvre d'AngularJS et les outils
du Front.
2) Questionnaire à choix multiples
Certification
Dates des sessions
Paris
3 mar. 2017, 19 mai 2017
- Présentation du déroulé des épreuves (timing, documents autorisés, etc.).
2) Questionnaire à choix multiples
- Questions ouvertes et fermées sur les connaissances essentielles des technologies et outils du Web.
- Développement d'une application Front-End dans le respect des techniques et des règles apprises.
d'attention.
page 183

Technologies Web, Conception et développement Web

Transcription

Documents pareils

Philippe CHARRIER

BESTELBON zomer jonge 2016 FRANS.cdr

ALLER A LA RENCONTRE DE JOAO DE DEUS A ABADIANIA, AU

formulaire actors studio - La Maison du Cinéma à Toulouse

Imprimer - Gîtes de France Charente

Ouverture des ventes Hiver

Gîte n°G14 - Le Relais Bossois

Télécharger le programme 2016 / 2017

Modèle de document générique

Keen`V - Macon Evenements