Technologies Web, Conception et développement Web

Transcription

1 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. Séminaires Architectures et technologies du Web : synthèse et évolutions... Best ( p8 ) Web 2.0 et réseaux sociaux en entreprise : synthèse... ( p14 ) Portails et gestion de contenu, synthèse... ( p27 ) Cours de synthèse Conception d'architecture Web... ( p10 ) JavaScript au cœur des architectures Web, état de l art... ( p12 ) Stages pratiques Cycle certifiant Concepteur de sites Web... ( p4 ) Cycle certifiant Développeur Web côté client... ( p6 ) Réaliser un site Web, pour non-informaticiens... Best ( p15 ) Développer un site Web, synthèse pratique... Best ( p17 ) HTML, initiation pratique... ( p19 ) CSS, donner du style à vos pages Web... ( p21 ) Dreamweaver CS6, prise en main... ( p23 ) Dreamweaver CS6, développer un site Web... ( p25 ) JavaScript, HTML dynamique... Best ( p28 ) Ajax, programmation côté client... ( p30 ) JavaScript, perfectionnement pour le Web Best ( p32 ) Flex et ActionScript 3.0, programmation d'interfaces Web... ( p34 ) Technologies XML, conception, mise en œuvre... Best ( p36 ) PHP 5, développer un site Web dynamique... Best ( p38 ) ASP.NET 4.5, niveau 1, développement Web... Best ( p40 ) Java, développement de servlets et JSP pour JEE 5... Best ( p42 ) Struts 2, développer des applications Web MVC... ( p44 ) HTML5, CSS 3, créer des sites Web modernes et dynamiques... Best ( p46 ) Canvas, créer des animations dynamiques en HTML5... ( p48 ) Google Web Designer, créer des contenus riches pour le Web... ( p50 ) SVG, créer des graphiques vectoriels interactifs pour le Web... ( p52 ) Développer avec XSL-T et XSL-FO... ( p54 ) Développer des applications Web ( p56 ) Ecmascript 6, mettre en oeuvre le nouveau JavaScript... Nouveau ( p58 ) ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 1

2 HTML5, maîtriser les API JavaScript... ( p60 ) Développer des applications Web Full JavaScript... ( p61 ) Industrialisation Front-End, maîtriser vos pratiques de développement... ( p63 ) AngularJS, maîtriser le Framework JavaScript de Google... Best ( p65 ) AngularJS, développement avancé... ( p67 ) JQuery, développer des applications Web Best ( p68 ) Node.js, programmation JavaScript côté serveur... ( p70 ) Sencha Ext-JS 5, développer des applications multiplateformes en JavaScript... Nouveau ( p72 ) BootStrap, développer des pages Web Responsive... Nouveau ( p74 ) Sass, Compass et Less, simplifier la création et la maintenance de vos CSS... Nouveau ( p76 ) ReactJS, maîtriser le Framework JavaScript de Facebook... Nouveau ( p78 ) BackBone.js, maîtriser le Framework de développement Web... ( p80 ) Facebook et Twitter, développer vos propres applications Web 'sociales'... ( p82 ) Réussir votre projet Web... ( p84 ) Webmaster, le métier, les techniques... ( p85 ) Optimiser le référencement de votre site Web... ( p86 ) Google Adwords, optimiser vos campagnes... ( p87 ) Google Analytics, analyser les statistiques de vos sites... ( p88 ) Design d'un site Web, comment faire un site attractif et efficace... ( p89 ) Créer un site Web, de la maquette Photoshop à l'intégration HTML/CSS... ( p91 ) Responsive Web Design, créer des interfaces Web adaptables... Best ( p93 ) Réaliser vos newsletters en HTML/CSS et gérer les envois... ( p95 ) Photoshop CC/CS6, prise en main... Best ( p96 ) Ergonomie des IHM mobiles pour tablettes et Smartphones... ( p98 ) Créer des applications multiplateformes pour mobiles... Best ( p99 ) Cordova, développer des applications mobiles multiplateformes... Nouveau ( p101 ) Concevoir des applications mobiles performantes... ( p103 ) PhoneGap, développer des applications mobiles multiplateformes... ( p105 ) JQuery Mobile Framework, développer des applications pour mobiles... ( p107 ) Sencha Touch 2, développer des applications mobiles multiplateformes... ( p109 ) Edge Animate, créer des animations interactives pour le Web... Nouveau ( p111 ) Java EE 7, conception et développement d'applications Web... Best ( p113 ) Java, développement de Servlets et JSP pour JEE 6... ( p115 ) Framework JSF 2, développer des applications Web... ( p117 ) Développer une application Web 2.0/GWT... Best ( p119 ) Mixer JSF, Ajax et Dojo pour développer des applications Web... ( p121 ) ASP.NET 4.5, niveau 2, développement Web... ( p123 ) Silverlight 5, mise en œuvre... ( p125 ) ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 2

3 ASP.NET MVC 5, développement d'applications Web... Best ( p126 ) PHP 5, développement Web avec Symfony 2... Best ( p128 ) Zend Framework 2, maîtrise du développement Web... ( p130 ) Programmation en C# (70-483)... Nouveau ( p132 ) Programmation en HTML5 avec JavaScript et CSS3 (70-480)... Nouveau ( p134 ) Développement d'applications Web ASP.NET MVC (70-486)... Nouveau ( p136 ) Les fondamentaux du développement d'applications Windows Store en utilisant C# (70-484)... Nouveau ( p138 ) Développement d'applications avancées Windows Store en utilisant C# (70-485)... Nouveau ( p140 ) Les fondamentaux du développement d'applications Windows Store en utilisant HTML5 et JavaScript (70-481)... Nouveau ( p142 ) Développement d'applications avancées Windows Store en utilisant HTML5 et JavaScript (70-482)... Nouveau ( p144 ) Django, développement Web avec Python... ( p146 ) Webdev, développement Web... ( p148 ) RUBY On Rails 4, développement Web... ( p150 ) ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 3

4 Stage pratique de 9 jour(s) Réf : KCS Développeurs de sites Web, Web designer, chef de projet, Webmaster souhaitant concevoir des sites Web de type Intranet/Internet et les promouvoir. La connaissance des bases du Web. Prix 2016 : 3660 HT Dates des sessions Paris 12 jan. 2016, 23 fév mar. 2016, 19 avr mai 2016, 14 juin juil. 2016, 20 sep Composition du cycle - Développer un site Web, synthèse pratique Réf : DSW, Durée : 4 j - Design d'un site Web, comment faire un site attractif et efficace Réf : ITF, Durée : 2 j - Optimiser le référencement de votre site Web Réf : OPS, Durée : 2 j - Certification Concepteur de sites Web Réf : KCX, Durée : 1 j - 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 Dates d'examen 07 mars juin août 16 Cycle certifiant Concepteur de sites Web certificat professionnel FFP OBJECTIFS Ce cycle vous montrera comment concevoir un site attractif et efficace 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 du site : les langages HTML, XML, le Web 2.0, les techniques graphiques, 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. 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 1) Introduction aux technologies et serveurs 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 - 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. 2) La création de pages Web - 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. 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. 3) La mise en œuvre de sites dynamiques - 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. 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. 4) Le positionnement du site Web - Intranet, Internet, Extranet. Stratégie de l'entreprise et conception du site. Techniques SWOT. - Quel design en fonction des terminaux mobiles? - Optimiser ses chances d'atteindre sa cible. 5) Le design et l'accessibilité de son site - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 4

5 - 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 5

6 Stage pratique de 12 jour(s) Réf : KWC 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. 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 2016 : 4690 HT Dates des sessions Paris 26 jan. 2016, 15 mar juin 2016, 20 sep Composition du cycle - Développer un site Web, synthèse pratique Réf : DSW, Durée : 4 j - Design d'un site Web, comment faire un site attractif et efficace Réf : ITF, Durée : 2 j - Optimiser le référencement de votre site Web Réf : OPS, Durée : 2 j - Certification Concepteur de sites Web Réf : KCX, Durée : 1 j - 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 Dates d'examen 01 avril septembre 16 Cycle certifiant Développeur Web côté client certificat professionnel FFP OBJECTIFS 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. 1) Les technologies du Web 2) La création de pages et de sites Web 3) Le HTML dynamique et le JavaScript 1) Les technologies du Web - 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 4) La programmation Ajax 5) Les frameworks Ajax - 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. 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. - 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 6

7 - Force du mix technologique Ajax/REST/Web 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...). 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 7

8 Séminaire de 3 jour(s) Réf : IRT Chefs de projets, décideurs informatiques, développeurs, responsables informatiques, Webmasters. Aucune connaissance particulière. Prix 2016 : 2680 HT Dates des sessions Paris 5 avr. 2016, 14 juin oct. 2016, 6 déc Bruxelles 4 avr. 2016, 20 juin 2016 Geneve 4 avr. 2016, 20 juin 2016 Luxembourg 4 avr. 2016, 20 juin 2016 Architectures et technologies du Web : synthèse et évolutions 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é. OBJECTIFS PEDAGOGIQUES 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é 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 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 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, H 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...). ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 8

9 - Les spécificités des terminaux mobiles et des tablettes : taille écran, capacité mémoire, OS... - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 9

10 Cours de synthèse de 3 jour(s) Réf : ACS Tout public de chefs de projets, décideurs informatiques, développeurs, responsables informatiques. Bonnes connaissances conceptuelles des archictures applicatives. Prix 2016 : 2190 HT Dates des sessions Paris 29 mar. 2016, 7 juin sep. 2016, 28 nov Conception d'architecture Web technologies, usages et impacts sur le SI OBJECTIFS Ce séminaire aborde l'état de l'art des technologies Xnet 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. 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 1) L'architecture des applications Web, état de l'art 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 - 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. 2) Applications et composants côté client - Les scripts Javascript... Les composants Java, JavaFX, SilverLight, ActiveX, plug-in. - Quelles limites pour le déploiement? - HTML, XHTML. Les limites du modèle HTML. Offre vectorielle (Flash, flex SVG). - Les formats Widgets, Gadgets, MicroFormats. - La mode Ajax et les frameworks de développement (Rialto, GWT, Yahoo, ASP.NET Ajax...). - Quelle frontière entre les composants Desktop (RDA) et Internet (RIA)? 3) Rôle d'xml dans l'architecture applicative - Présentation. Les moteurs de transformation XSLT et les parseurs XML. - Les services Web, leur connexion avec les applications existantes. - Les protocoles XML (SOAP, Oasis, XHTML, BPML...). - 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, ASP. Les approches orientées composant (EJB de Sun, Microsoft.Net). - Les "Web services", standards (SOAP, WSDL...), développements (Microsoft.NET, Sun/ONE, IBM...). - Les offres de serveurs d'applications : WebSphere,.NET Enterprise Server, Oracle 9iAS, JBoss, Tomcat... - L'architecture.NET de Microsoft. - Mode de fonctionnement et implémentation (Framework, ASP.NET, Common Language Runtime...). - La plate-forme JEE. Le concept d'indépendance des plates-formes matérielles d'exécution. - Les frameworks Java en vogue (Spring, Hibernate, Struts). 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 (SPIP, Alfresco, Joomla...). - Importance des nouvelles versions d'outils bureautiques orientées XML (Office 2007/OpenXML, Open Office/OPenDocument). - L'offre : Documentum, SharePoint, Autonomy... 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, Yahoo, Skype). - Perspective en matière de gestion d'agenda partagé. Utilisation des messageries SMS et du Push Mail. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 10

11 - 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 : IBM, Documentum, Vignette, MediApps. L'open source : PHPnuke, SPIP, Jahia... - L'engouement pour la SOA et l'offre du marché. Tibco, Microsoft, BEA Systems, IBM, Web Methods... - 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. - 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, PostgreSQL. - Interfaçage avec le Web. Evolution. Les bases de données XML natives (Tamino...). - Stockage multidimensionnel (M-OLAP, R-OLAP, H-OLAP). - Les familles d'outils client : requêteurs relationnels, EIS, Data Mining. - Comment gérer la volumétrie importante? - Les techniques de modélisation spécifiques. 10) Conception et démarche de mise en œuvre - L'ergonomie des applications. - L'accessibilité devient une obligation légale! - Les règles d'accessibilité, le label Accessiweb. - La charte d'ergonomie : rôle, contenu technique... - La charte graphique et l'utilisabilité. - Rôle de la maquette, comment la réaliser : 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"? ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 11

12 Cours de synthèse de 1 jour(s) Réf : JET Développeurs, chefs de projets et architectes. Aucune connaissance particulière. Prix 2016 : 900 HT JavaScript au cœur des architectures Web, état de l art 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. OBJECTIFS PEDAGOGIQUES 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. Dates des sessions Paris 8 avr. 2016, 17 juin ) Evolution du JavaScript 2) Les outils du Front-End 3) Frameworks JavaScript et API HTML 5 4) JavaScript au service du Responsive 5) Traitements multithread 6) Protocoles de communication 7) Mode déconnecté 8) Sécurité 1) Evolution du JavaScript - 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. - Renforcement dans les OS (Windows 8...) et les navigateurs (Chrome...). 2) Les outils du Front-End - 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...). 3) Frameworks JavaScript et API HTML 5 - Frameworks de composants graphiques. - Frameworks de composants 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...). 4) JavaScript au service du Responsive - Importance de JavaScript dans le Responsive. - Gestion des images retina. - Contrôle des ressources disponibles et chargement dynamique. - Quel rôle attribuer au JavaScript et au design (HTML CSS)? Répartition des rôles. - Impact du Responsive sur la performance, solutions. 5) Traitements multithread - Les Webworkers, impact sur l'organisation logiciel et la construction de Framework. - Programmation asynchrone, solutions, organisation. 6) Protocoles de communication - 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... 7) Mode déconnecté - Mise en place d'une solution embarquée. - Gestion des chargements du cache (manifest et ses API). - Stockage de données : LocalStorage, SessionStorage, EmbededDB... ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 12

13 8) Sécurité - Sécurisation des codes JavaScript. - Protection XSS, CRSF. - Encodage et pratique de modification du DOM. - Stockage de données. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 13

14 Séminaire de 2 jour(s) Réf : WRS Responsable de projets Web / intranet, responsable RH, responsable communication, manager. Connaissances de base sur l'usage des outils collaboratifs (messagerie, GED, intranet...). Prix 2016 : 1950 HT Dates des sessions Paris 7 avr. 2016, 9 juin sep. 2016, 15 déc 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 1) Définition du Web Concepts novateurs par rapport au Web Doit-on réellement parler de rupture technologique? 2) Socle applicatif du Web 2.0 4) Impacts sur les projets Web 5) Réseaux sociaux en entreprise - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 14

15 Stage pratique de 3 jour(s) Réf : NIW Toute personne désirant réaliser un site Web avec les technologies actuelles ou souhaitant disposer d'une culture Web concrète. Avoir une bonne connaissance de l'utilisation de son ordinateur. Savoir naviguer sur Internet et traiter des s. Prix 2016 : 1480 HT Dates des sessions Paris 1 fév. 2016, 4 avr juin 2016, 5 sep nov Aix 5 avr. 2016, 20 juin sep. 2016, 5 déc Bordeaux 25 avr. 2016, 27 juin sep. 2016, 12 déc Bruxelles 15 fév. 2016, 20 juin 2016 Geneve 15 fév. 2016, 20 juin 2016 Grenoble 5 avr. 2016, 20 juin sep. 2016, 5 déc Lille 5 avr. 2016, 20 juin sep. 2016, 5 déc Luxembourg 15 fév. 2016, 20 juin 2016 Lyon 5 avr. 2016, 20 juin sep. 2016, 5 déc Montpellier 25 avr. 2016, 27 juin sep. 2016, 12 déc Nantes 25 avr. 2016, 27 juin sep. 2016, 12 déc Rennes 25 avr. 2016, 27 juin sep. 2016, 12 déc Sophia-antipolis 5 avr. 2016, 20 juin sep. 2016, 5 déc Strasbourg 5 avr. 2016, 20 juin sep. 2016, 5 déc Toulouse 25 avr. 2016, 27 juin sep. 2016, 12 déc Réaliser un site Web, pour non-informaticiens Best OBJECTIFS 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. 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 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 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? Repérer les différents navigateurs sur son PC, rechercher des adresses IP ou des noms de domaines. 2) Le dialogue entre le client et le serveur - La notion de protocole. - Le protocole HTTP. - Déposer des fichiers sur un serveur distant avec FTP. - Mettre à jour un fichier avec FTP. 3) L'hébergement et le nom de domaine - 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). 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 15

16 - 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...). 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). 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. 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. 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? Intégration de scripts dans une page. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 16

17 Stage pratique de 4 jour(s) Réf : DSW Cette formation pratique s'adresse aux informaticiens qui souhaitent concevoir une application client intranet/ Internet. Connaissances de base en architectures techniques. Prix 2016 : 2390 HT Dates des sessions Paris 23 fév. 2016, 15 mar avr. 2016, 24 mai juin 2016, 26 juil aoû. 2016, 6&20 sep oct. 2016, 15 nov déc Aix 1 mar. 2016, 7 juin sep. 2016, 15 déc Bordeaux 16 fév. 2016, 21 juin oct. 2016, 13 déc Bruxelles 21 mar. 2016, 28 juin sep Geneve 21 mar. 2016, 28 juin sep Grenoble 1 mar. 2016, 7 juin sep. 2016, 15 déc Lille 1 mar. 2016, 7 juin sep. 2016, 15 déc Luxembourg 21 mar. 2016, 28 juin sep Lyon 1 mar. 2016, 7 juin sep. 2016, 15 déc Montpellier 16 fév. 2016, 21 juin oct. 2016, 13 déc Nantes 16 fév. 2016, 21 juin oct. 2016, 13 déc Rennes 16 fév. 2016, 21 juin oct. 2016, 13 déc Sophia-antipolis 1 mar. 2016, 7 juin sep. 2016, 15 déc Strasbourg 1 mar. 2016, 7 juin sep. 2016, 15 déc Toulouse 16 fév. 2016, 21 juin oct. 2016, 13 déc Développer un site Web, synthèse pratique Best OBJECTIFS 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, XML..., les technologies du Web 2.0, 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. 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 1) Les technologies du site Web 6) Ergonomie et accessibilité d'une application Web 7) Pages dynamiques 8) Les technologies Web 2.0 9) Initiation au langage JavaScript et au DHTML - 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. 2) Administration d'un site Web - 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. 3) Création de pages Web : HTML, XML, XHTML - 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. 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. Réalisation d'un formulaire avec envoi des données vers la messagerie et une base de données. 5) Conception graphique et multimédia - 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. 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. - Accessibilité. Norme. Impact sur le développement. Mettre en conformité un site Web. Outils de test et de validation en ligne. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 17

18 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. Développer des pages dynamiques, interrogation d'une base de données, de services web. 8) Les technologies Web Présentation des technologies Web 2.0 (blogs, rss, wiki...). - Les technologies émergentes d'interfaces graphiques : XAML, Flex, HTML5. - Présentation et mise en oeuvre de solutions Rich internet Application (RIA) et Rich Desktop Application (RDA). - Présentation des solutions émergentes Adobe AIR, Microsoft SilverLight, framework Google. Démonstration et mise en oeuvre de ces multiples technologies. 9) Initiation au langage JavaScript et au DHTML - 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 18

19 Stage pratique de 1 jour(s) Réf : TML Toutes les personnes désirant s'initier aux fondamentaux de la création de pages Web. Pratique courante d'internet. Prix 2016 : 870 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 25 mar. 2016, 24 juin sep. 2016, 25 nov 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. OBJECTIFS PEDAGOGIQUES 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 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 Méthodes pédagogiques 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 ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 19

20 - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 20

21 Stage pratique de 2 jour(s) Réf : CSS 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. Connaissances de base en HTML. Prix 2016 : 1410 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 11 fév. 2016, 26 mai juil. 2016, 15 sep nov Aix 17 mar. 2016, 23 juin sep. 2016, 24 nov Bordeaux 10 mar. 2016, 16 juin sep. 2016, 15 déc Grenoble 17 mar. 2016, 23 juin sep. 2016, 24 nov Lille 17 mar. 2016, 23 juin sep. 2016, 24 nov Lyon 17 mar. 2016, 23 juin sep. 2016, 24 nov Montpellier 10 mar. 2016, 16 juin sep. 2016, 15 déc Nantes 10 mar. 2016, 16 juin sep. 2016, 15 déc Rennes 10 mar. 2016, 16 juin sep. 2016, 15 déc Sophia-antipolis 17 mar. 2016, 23 juin sep. 2016, 24 nov Strasbourg 17 mar. 2016, 23 juin sep. 2016, 24 nov Toulouse 10 mar. 2016, 16 juin sep. 2016, 15 déc 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 1) Rappels - L'architecture client/serveur. Les navigateurs. - Les langages côté client XML, (X)HTML, CSS, JavaScript. - Le web sémantique. L'accessibilité. L'encoding. 2) La base des CSS - 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). 5) Les images 6) Les formulaires 7) Modifications des CSS en JavaScript 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. 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. 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. 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)... Réalisation de formulaires. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 21

22 7) Modifications des CSS en JavaScript - Modification des styles en JavaScript (les interfaces style et classname). - Effets : apparition, cliqué-glissé, menu déroulant... Utilisation conjointe de CSS et de JavaScript (menu glissant, effets dans le formulaire...). ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 22

23 Stage pratique de 2 jour(s) Réf : EAM Ce stage s'adresse à tous les internautes et Webmasters désirant acquérir de bonnes pratiques de création de site. Aucune connaissance particulière. Prix 2016 : 1410 HT Dates des sessions Paris 11 fév. 2016, 26 mai juil. 2016, 1 sep nov Dreamweaver CS6, prise en main OBJECTIFS Vous apprendrez à utiliser l'atelier Dreamweaver CS6 d'adobe, notamment pour préparer des pages HTML et XHTML 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 1) Rappels du Web 4) Accessibilité et Web usability 5) Mise en forme avancée avec CSS 6) Introduction au DHTML - 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. 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 CS6 (démarrage, espace de travail, paramétrage...). 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 et PNG, zones réactives...). - Les hyperliens (URL, cibles, ancres...). - Propriétés de la page (fonds, fonts, liens...). - Mise en forme à l'aide de tableaux. 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 23

24 Test simple de déclenchement JavaScript. Mise en œuvre d'effets Spry sur les pages créées. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 24

25 Stage pratique de 4 jour(s) Réf : HTX Ce stage pratique s'adresse à tous les informaticiens désireux de maîtriser les techniques permettant de développer un site Web et de construire une interface Web interactive et dynamique. Connaissances de base des composants d'une architecture Web. Prix 2016 : 2390 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 15 mar. 2016, 14 juin sep. 2016, 15 nov Dreamweaver CS6, développer un site 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é 1) Rappels Web - Les protocoles d'un site web : HTTP, FTP, SMTP, POP3. - Fonctionnement d'un site Web. HTML, URL. 5) Intégration de composants multimédias 6) JavaScript 7) Accès aux bases de données Paramétrage du navigateur, du serveur Web, création d'un environnement de développement. 2) L'interface Dreamweaver - 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). Découverte de l'éditeur, construction de pages. Développement de pages XHTML. 3) Composition de pages complexes - 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. 4) Design et accessibilité - 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. 5) Intégration de composants multimédias - 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. Contrôles sur les formulaires, ouverture de pop-up, traitement sur les div. 7) Accès aux bases de données - Paramétrage de la connexion ODBC. - Gestion dynamique des bases de données. - Interrogation SQL sur une table. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 25

26 - 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. Connexion à une base. Création d'une table d'utilisateurs, génération de pages de login. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 26

27 Séminaire de 2 jour(s) Réf : PEC Directeurs informatiques, architectes techniques, directeurs de projet maîtrise d'œuvre/maîtrise d'ouvrage. Portails et gestion de contenu, synthèse OBJECTIFS Ce séminaire vous permettra d'appréhender les enjeux d'un portail dans le cadre de la stratégie et du système d'information de l'entreprise, d'identifier les besoins génériques et les spécificités propres à chaque famille de solutions, ainsi que les composants organisationnels liés à la mise en place d'une solution EIP/ WCM. Connaissances de base de ce qui constitue un système d'information (Annuaire, ERP, applications spécifiques ). Prix 2016 : 1950 HT 1) Les besoins génériques des entreprises 2) Les enjeux organisationnels 3) Gestion du projet de collecte des contenus 4) Gestion du projet de diffusion des contenus 5) Etude comparative des solutions leaders 6) Acteurs locaux et solutions Open Source 7) Panorama des outils collaboratifs Dates des sessions Paris 17 mar. 2016, 16 juin ) Les besoins génériques des entreprises - Intégration à l'existant. Catégorisation et publication de contenu. Automatisation des processus. Outils de collaboration. Personnalisation. Recherche. 2) Les enjeux organisationnels - La stratégie de l'entreprise doit être la référence constante : que peut/doit faire le portail et/ou la gestion de contenu pour contribuer à la mise en œuvre de cette stratégie? - Comment évaluer cet apport? - Quels sont les points à surveiller quand on associe des solutions d'éditeurs différents? - Peut-on prévoir une intégration complète des produits de gestion de contenu dans les portails? 3) Gestion du projet de collecte des contenus - Comment différencier l'exploitation des contenus : documents natifs (Excel, PDF ), contenus purs Web? - Comment saisir ces contenus? - Comment les documents (granularités, contenus composites, données structurées/non structurées )? - Les circuits de validation à mettre en place (exemples d'organisation à 2, 3, 4 niveaux). Définir les rôles et les responsabilités : rédacteur en chef, chef de rubrique, webmaster Inciter la contribution de tous. 4) Gestion du projet de diffusion des contenus - Les mécanismes des templates. - L'analyse des cibles d'utilisateurs et des canaux de diffusion. - Les besoins de personnalisation. - Gérer les problématiques complexes : multilingue, multisite, sites en marque blanche. 5) Etude comparative des solutions leaders - La cartographie du marché et des tendances. - Une harmonisation des données en XML est-elle réaliste? - Le positionnement des éditeurs. - Evaluation des principales offres : InStranet, Mediapps, Vignette, Open Text, Hummingbird, Tridion, Plumtree, Interwoven, Divine, Documentum, IBM, Novell, Oracle, BEA, MOSS. 6) Acteurs locaux et solutions Open Source - Quel avenir pour les acteurs locaux? - Les spécificités des solutions Open Source. - Panorama : JBoss, Liferay, Jetspeed, uportal, Alfresco, Noheto, Jalios, Jahia, KPortal, CPS, ez publish, Drupal, Typo3, Plone, SPIP, Midgard... 7) Panorama des outils collaboratifs - L'évolution du collaboratif dans les entreprises. - Une typologie des applications collaboratives. - Les standards émergents : JSR 170, Webdav, ical... - Les nouveaux outils de collaboration (Wiki, Blog, Social Networking...). ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 27

28 Stage pratique de 4 jour(s) Réf : DHL Ce stage pratique s'adresse à tous les concepteurs de sites Web et informaticiens désireux d'exploiter Javascript et les technologies HTML dynamique pour leurs projets. Bonnes connaissances du HTML. Connaissances de base en programmation. Prix 2016 : 2390 HT Dates des sessions Paris 1 mar. 2016, 9 mai juin 2016, 5 juil aoû. 2016, 13 sep oct. 2016, 15 nov déc Aix 1 mar. 2016, 17 mai sep. 2016, 8 déc Bordeaux 23 fév. 2016, 31 mai oct. 2016, 20 déc Bruxelles 8 mar. 2016, 7 juin 2016 Geneve 8 mar. 2016, 7 juin 2016 Grenoble 1 mar. 2016, 17 mai sep. 2016, 8 déc Lille 1 mar. 2016, 17 mai sep. 2016, 8 déc Luxembourg 8 mar. 2016, 7 juin 2016 Lyon 1 mar. 2016, 17 mai sep. 2016, 8 déc Montpellier 23 fév. 2016, 31 mai oct. 2016, 20 déc Nantes 23 fév. 2016, 31 mai oct. 2016, 20 déc Rennes 23 fév. 2016, 31 mai oct. 2016, 20 déc Sophia-antipolis 1 mar. 2016, 17 mai sep. 2016, 8 déc Strasbourg 1 mar. 2016, 17 mai sep. 2016, 8 déc Toulouse 23 fév. 2016, 31 mai oct. 2016, 20 déc JavaScript, HTML dynamique Best OBJECTIFS 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. 1) Les technologies du Web 2) Le langage JavaScript 3) Evénements et données 4) Gestion de formulaires HTML Programmation Javascript, manipulation du DOM, gestion de l'interactivité. 1) Les technologies du Web 5) Interaction avec les feuilles de style en cascade 6) Manipulation du DOM XML 7) Ajax - 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...). - Positionnement et illustration des technologies DHTML. 2) Le langage JavaScript - 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. 3) Evénements et données - 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). Exercice Programmation d'événements multiples sur les éléments formulaire, souris, clavier... 4) Gestion de formulaires HTML - Manipulation de contenu de formulaires. - Accès et modification dynamique des composants du formulaire : zone de saisie, cases à cocher, cases d'options... ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 28

29 - 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. 6) Manipulation du DOM XML - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 29

30 Stage pratique de 3 jour(s) Réf : PAJ Ce cours s'adresse aux Webmasters, développeurs Web, informaticiens. Ajax, programmation côté client 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. Bonnes connaissances en Javascript et en technologies Web côté client. Prix 2016 : 1920 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 8 fév. 2016, 2 mai sep. 2016, 28 nov ) Ajax 2) Rappels XML et Javascript 3) Javascript Object Notation (JSON) 4) Programmation du DOM 1) Ajax - Les objectifs d'ajax. Principes de fonctionnement. - Force du mix technologique Ajax/REST/Web Choisir entre Ajax et Flash, Applet, Html. Application. 2) Rappels XML et Javascript - 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. 5) Traitements XML en Javascript 6) XMLHttpRequest 7) Les patterns Ajax 8) Compléments Création d'une structure XML bien formée et valide. Manipulation de classes et d'objets. 3) Javascript Object Notation (JSON) - Avantages et inconvénients dans les échanges. - Objets, Arrays, syntaxe et parseur JSON. - JSON, avantages et inconvénients. - Sérialisation entre client et serveur. 4) Programmation du DOM - Importance du langage XHTML. Composants DHTML. - Le rôle du DOM dans la programmation XML. - Gestion dynamique de CSS. Modification dynamique du DOM d'une page HTML. 5) Traitements XML en Javascript - Présentation XSLT. Langage Xpath. Format RSS. 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. Gérer une table produit, un formulaire de login en Ajax. Remplir dynamiquement un menu déroulant. 7) Les patterns Ajax - Threads. Usage d'iframe pour les appels client/serveur. - Traitements asynchrones, synchrones. - Sécuriser des échanges Ajax (cryptage, sessions...). - Problématiques de sécurité et performance : cryptage, compression, débogage, offuscation. - Mise en place de proxy crossdomain. - Présentation et mise en oeuvre du framework jquery. Mise en oeuvre de requêtes asynchrones et multithreads. Développement Ajax en jquery. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 30

31 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. Développer en Javascript un exemple de cartographie. Développement Ajax sous HTML5. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 31

32 Stage pratique de 4 jour(s) Réf : JPG Ce stage pratique s'adresse à tous les concepteurs de sites Web et informaticiens désireux d'exploiter Javascript et les technologies HTML dynamique pour leurs projets. Bonnes connaissances en Javascript et HTML. Connaissances de base de XML. Prix 2016 : 2390 HT Dates des sessions Paris 9 fév. 2016, 10 mai juil. 2016, 13 sep nov JavaScript, perfectionnement pour le Web 2.0 Best OBJECTIFS 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 2.0 à partir de concepts avancés Javascript. 1) Rappels JavaScript : DOM, événement, manipulation, parsing 2) Programmation Orientée Objet 3) Framework jquery 4) Expressions régulières 5) Environnement de débogage 6) Echange de données, interactions 7) Programmation Javascript sous HTML5 8) Google API : Maps, Search et Charts 1) Rappels JavaScript : DOM, événement, manipulation, parsing - Structure XML et JSON. Les parseurs XML. Lecture d'un fichier JSON. - 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. Création et diffusion d'événements. Exercice Parcours d'une structure XML via un flux Ajax. Mise en place d'objets JSON pour des échanges de données. Création d'un gestionnaire d'événements. 2) Programmation Orientée Objet - Rappels sur l'objet. Propriétés. - La chaîne de portée. Closure function. La chaîne de prototype. - Méthodes. Héritage. Portée des données privées et publiques. Mapping et sérialisation. Exercice Mise en pratique de la Programmation Orientée Objet. 3) Framework jquery - Fonctionnement et intégration de jquery. - Gestion des événements. - Mise en oeuvre de jquery pour des échanges Ajax. 4) Expressions régulières - Structure et syntaxe d'une expression régulière. - L'objet RegExp. Contrôle de dates, . 5) Environnement de débogage - Introduction, solutions dédiées aux navigateurs. - Messages d'erreur. Tests de performance. Points d'arrêt. Tests multinavigateurs. Stockage des tests. Mise en oeuvre d'outils de débogage. 6) Echange de données, interactions - Cookies. - Base embarquée dans le navigateur Sqlite. - Base distante via Ajax et HttpRequest. - Interfaçage avec une application Flash. - Serveur Javascript NodeJS. Appel de services Web. Utiliser une base embarquée, échanges avec la base distante. 7) Programmation Javascript sous HTML5 - Nouveaux événements. Gestion multimédia. - Modes de communication client/serveur. Manipulation de quelques API JavaScript sous HTML5. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 32

33 8) Google API : Maps, Search et Charts - Création d'une Map. Systèmes de coordonnées. Géocoder pour la recherche d'adresse. - Création de markers. Gestion d'événements Event. - DirectionsService pour l'identification de trajectoires. - Format KML d'enregistrement de cartes. - Intégration de Google Search dans les pages. - Génération de graphiques avec Google Charts. Créer une Map et des graphiques. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 33

34 Stage pratique de 4 jour(s) Réf : FLX Cette formation pratique s'adresse aux développeurs de sites, informaticiens, designers. Connaissances de base en programmation et en développement Web. Prix 2016 : 2390 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 15 mar. 2016, 24 mai juil. 2016, 20 sep nov 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 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. Création d'un projet et mise en oeuvre du débogueur. 2) Le langage Actionscript 3.0 5) Les formulaires 6) Styles 7) Accès aux données 8) Graphiques - 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. Prise en main Actionscript ) Langage MXML - Structure d'une application Flex : blocs script, Model... - La gestion des événements : propagation, trois phases. 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... 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. 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. Mise en pratique de multiples effets. 7) Accès aux données - Accès aux Web services. Echanges RPC et Soap. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 34

35 - Le gestionnaire de données sous Flex4. 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. Création de graphiques. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 35

36 Stage pratique de 4 jour(s) Réf : PXM Concepteurs et développeurs d'applications, architectes logiciels, chefs de projets. Connaissances de base en développement, bases de données, architectures Internet/Web. Prix 2016 : 2390 HT Dates des sessions Paris 23 fév. 2016, 19 avr juin 2016, 13 sep oct. 2016, 15 nov déc Aix 29 mar. 2016, 14 juin sep. 2016, 13 déc Bordeaux 1 mar. 2016, 7 juin oct. 2016, 20 déc Grenoble 29 mar. 2016, 14 juin sep. 2016, 13 déc Lille 29 mar. 2016, 14 juin sep. 2016, 13 déc Lyon 29 mar. 2016, 14 juin sep. 2016, 13 déc Montpellier 1 mar. 2016, 7 juin oct. 2016, 20 déc Nantes 1 mar. 2016, 7 juin oct. 2016, 20 déc Rennes 1 mar. 2016, 7 juin oct. 2016, 20 déc Sophia-antipolis 29 mar. 2016, 14 juin sep. 2016, 13 déc Strasbourg 29 mar. 2016, 14 juin sep. 2016, 13 déc Toulouse 1 mar. 2016, 7 juin oct. 2016, 20 déc Technologies XML, conception, mise en œuvre Best OBJECTIFS 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é. 1) Industrie XML 2) Les parseurs XML 3) Validation de documents 4) Transformation XSL-T 5) Publication de documents 1) Industrie XML 6) Message et échanges XML 7) XML et les bases de données 8) Sécurité des échanges XML 9) Technologies graphiques 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. Création de documents de différents formats : XML, CSV et JSON. 2) Les parseurs XML - 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. 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. 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. - Le langage de transformation XSL-T 1.0, 2.0 et 3.0 : construction d'arbres, restructuration. - Génération multiformat : XHTML, SVG, PDF. Génération d'un document via une transformation XSL-T. 5) Publication de documents - Visualisation brute d'un document sur les navigateurs. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 36

37 - 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). 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 JEE. - 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). 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). Exemples des différentes technologies présentées. 9) Technologies graphiques XML - Présentation des langages d'interfaces (XAML, XUL, MXML). - 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. Dynamisation d'un graphique avec SVG et XSL. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 37

38 Stage pratique de 4 jour(s) Réf : PHH Développeurs, webmasters ayant déjà une bonne connaissance d'un langage de programmation client (javascript ou vbscript). Connaissances de base du langage HTML et d'au moins un langage de programmation. Prix 2016 : 2390 HT Dates des sessions Paris 2 fév. 2016, 1 mar avr. 2016, 10 mai juin 2016, 5 juil aoû. 2016, 20 sep oct. 2016, 15 nov déc Aix 9 fév. 2016, 31 mai oct. 2016, 13 déc Bordeaux 8 mar. 2016, 14 juin oct. 2016, 13 déc Bruxelles 15 mar. 2016, 14 juin 2016 Geneve 15 mar. 2016, 14 juin 2016 Grenoble 9 fév. 2016, 31 mai oct. 2016, 13 déc Lille 9 fév. 2016, 31 mai oct. 2016, 13 déc Luxembourg 15 mar. 2016, 14 juin 2016 Lyon 9 fév. 2016, 31 mai oct. 2016, 13 déc Montpellier 8 mar. 2016, 14 juin oct. 2016, 13 déc Nantes 8 mar. 2016, 14 juin oct. 2016, 13 déc Rennes 8 mar. 2016, 14 juin oct. 2016, 13 déc Sophia-antipolis 9 fév. 2016, 31 mai oct. 2016, 13 déc Strasbourg 9 fév. 2016, 31 mai oct. 2016, 13 déc Toulouse 8 mar. 2016, 14 juin oct. 2016, 13 déc PHP 5, développer un site Web dynamique Best OBJECTIFS 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... 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 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. 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 et PHP 5. - Notions d'architecture multicouche. Introduction aux principes MVC. - Présentation de l'exemple utilisé durant la formation : le site de vente en ligne. 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. 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. Réalisation d'une fonction de création de liste déroulante. 5) Gestion des sessions utilisateurs - Variables persistantes : Cookies et Session. - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 38

39 - Utilisation. 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. 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. 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 GD. - 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. Intégration des différents modules réalisés. Affichage des images avec mention de Copyright. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 39

40 Stage pratique de 5 jour(s) Réf : AST Informaticiens souhaitant développer des applications Internet/Intranet en utilisant les technologies.net (ASP.NET et ADO.NET) dans le cadre de l'environnement Visual Studio. Bonnes connaissances de la programmation C# ou VB.NET. Connaissances de base des technologies Web côté client (HTML, JavaScript...). Prix 2016 : 2560 HT Dates des sessions Paris 22 fév. 2016, 14 mar avr. 2016, 9 mai juin 2016, 4 juil aoû. 2016, 5&12 sep oct. 2016, 14 nov déc Aix 21 mar. 2016, 9 mai sep. 2016, 5 déc Bordeaux 22 fév. 2016, 30 mai sep. 2016, 19 déc Grenoble 21 mar. 2016, 9 mai sep. 2016, 5 déc Lille 21 mar. 2016, 9 mai sep. 2016, 5 déc Lyon 25 jan. 2016, 21 mar mai 2016, 5 sep déc Montpellier 22 fév. 2016, 30 mai sep. 2016, 19 déc Nantes 22 fév. 2016, 30 mai sep. 2016, 19 déc Rennes 22 fév. 2016, 30 mai sep. 2016, 19 déc Sophia-antipolis 21 mar. 2016, 9 mai sep. 2016, 5 déc Strasbourg 21 mar. 2016, 9 mai sep. 2016, 5 déc Toulouse 22 fév. 2016, 30 mai sep. 2016, 19 déc ASP.NET 4.5, niveau 1, développement Web Best OBJECTIFS Ce cours vous apprendra à utiliser les techniques de création d'applications Internet/Intranet ASP.NET Web Forms dans l'environnement.net 4.5 avec Visual Studio 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. 1) Introduction et rappels 2) Fonctionnement des pages ASP.NET 3) Contrôles serveur 4) Conception de la structure d'un site Web 5) Accès aux données 6) Gestion de la sécurité 7) Configuration et déploiement 8) Utilisation des services Web 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. 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.) 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. 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. - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 40

41 Exemple de réalisation d'une application de e-commerce, réalisation d'un contrôle utilisateur et utilisation de pages maîtres. 5) Accès aux données - 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). 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. 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. 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. Démonstration d'un Web Service simple (recherche dans une base de données) et interrogation via ASP.NET et un proxy. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 41

42 Stage pratique de 5 jour(s) Réf : JSP Informaticiens souhaitant développer des applications Web avec les technologies Java/JEE. Bonnes connaissances du langage Java et des technologies Web. Expérience requise en programmation Java. Prix 2016 : 2560 HT Dates des sessions Paris 15 fév. 2016, 11 avr juin 2016, 5&19 sep oct. 2016, 21 nov déc Aix 1 fév. 2016, 18 avr juin 2016, 5 sep déc Bordeaux 22 fév. 2016, 18 avr juin 2016, 12 sep déc Bruxelles 14 mar. 2016, 13 juin 2016 Geneve 14 mar. 2016, 13 juin 2016 Grenoble 1 fév. 2016, 18 avr juin 2016, 5 sep déc Lille 1 fév. 2016, 18 avr juin 2016, 5 sep déc Luxembourg 14 mar. 2016, 13 juin 2016 Lyon 1 fév. 2016, 18 avr juin 2016, 5 sep déc Montpellier 22 fév. 2016, 18 avr juin 2016, 12 sep déc Nantes 22 fév. 2016, 18 avr juin 2016, 12 sep déc Rennes 22 fév. 2016, 18 avr juin 2016, 12 sep déc Sophia-antipolis 1 fév. 2016, 18 avr juin 2016, 5 sep déc Strasbourg 1 fév. 2016, 18 avr juin 2016, 5 sep déc Toulouse Java, développement de servlets et JSP pour JEE 5 Best OBJECTIFS Ce cours vous permettra de mener à bien un projet Web d'entreprise basé sur la plateforme Java. Vous découvrirez les architectures MVC afin de construire des solutions robustes et facilement extensibles, avec entre autres une introduction au développement à l'aide de l'environnement Apache Struts. Les connaissances acquises par la pratique sur Tomcat, ainsi que sur des outils de développement comme Eclipse vous permettront de construire vos solutions sur les différents serveurs d'applications Java comme WebLogic, WebSphere, JBoss ou Jonas. 1) Rappel sur le contexte des applications Web d'entreprise 2) Développement Web en Java 3) Applications Web et servlets 4) Présentation des Java Server Pages 5) Les librairies de balises 6) Accès aux bases de données 7) Introduction à Struts 8) Sécurisation de l'application Développement d'une application Web en Java. Utilisation du conteneur de servlet/jsp, Tomcat. Environnement de développement Eclipse. 1) Rappel sur le contexte des applications Web d'entreprise - Serveur et client Web. - Protocoles applicatifs (HTTP). - Scripts CGI et gestion des sessions. - Accès aux ressources de l'entreprise : SGBDR, base documentaire et XML, annuaire, application héritée. - HTML-XML, applets Java. La plateforme JEE. Architecture multitiers. 2) Développement Web en Java - Composants nécessaires à l'utilisation de Java côté serveur. Serveur Web. Moteur de servlet. Java Virtual Machine. - Outils de développement et de débogage : NetBeans et Eclipse. - Architecture du conteneur Web Tomcat d'apache. Déploiement des servlets et pages JSP. - Développement d'une première servlet. Génération de contenu dynamique. Mise en place de l'environnement. Développement d'une servlet. 3) Applications Web et servlets - Le conteneur de servlets. Le cycle de vie d'une servlet. Initialiser une servlet. Ecrire les méthodes de services. - Gestion des formulaires HTML. Le traitement de la réponse, l'envoi d'information, la génération de HTML. - Filtrage des requêtes/réponses. Programmation des filtres. - La récupération d'information : du serveur Web, du client et de l'environnement. Invocation d'autres ressources Web. - Inclusion et transfert du contrôle. - Gestion des erreurs d'exécution. Gestion et emploi des exceptions Java. - Envoi d'erreurs http. Journalisation des événements. - Les différentes méthodes de suivi de session. Obtention, consultation et abandon de session. Contexte de session. Développement d'une application à base de servlets exploitant l'environnement du conteneur Web. 4) Présentation des Java Server Pages - Présentation des objectifs et de l'architecture. Mécanisme de fonctionnement. Exemples de pages JSP. - Les scriplets. Intégration dans la page Web. Directives, déclarations, expressions et actions JSP. - Inclusion statique vs dynamique. Versions du langage, syntaxe XML. - Utilisation de JavaBeans à partir de page JSP. Définition, création, déploiement et utilisation. - Accès et modification à partir d'une page JSP. - Développement d'application à l'aide de JSP. Combinaison JSP et servlets. - Inclusion d'applets. - Accès aux ressources de l'entreprise. Développement d'une application Web mettant en oeuvre servlets et JSP. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 42

43 22 fév. 2016, 18 avr juin 2016, 12 sep déc ) Les librairies de balises - Principe des librairies et extensions de balises. Fonctionnement. Exemple. - Développement d'extension de balises. Balises simples, avec attributs, avec corps. Déployer et exploiter une librairie. - Présentation de JSTL (Java Standard Tag Library). Concevoir des JSP avec JSTL. Exemples. - Les bibliothèques : core, XML, i18n, SQL, fonctions. Développement de librairies de balises. Intégration de JSTL aux applications développées. 6) Accès aux bases de données - Mise en place de la base de données relationnelles et de l'interface JDBC. - Connexion à la base, récupération d'information, mise à jour de données. - Transaction. Pool de connexions. Les DataSources. - Correspondance BDR/Modèles objet. Objectifs. Approches et outils Java. - Présentation de JPA et les différentes solutions du marché (Hibernate...). Développement d'une application Web présentant des données d'un SGBDR. 7) Introduction à Struts - Présentation du framework MVC Struts. Architecture. Composants du framework. - Configuration de l'application. - Gestion des événements. - Extension et librairies de balises. Adaptation de l'application au modèle MVC avec Struts. 8) Sécurisation de l'application - La sécurité dans un contexte Web. Notions de users, realms, rôles. - Authentification et autorisation. - Sécurité et programmation de servlets. - Installer et configurer SSL. Certificats numériques. Java Authentication and Authorization Service. - Configuration de Tomcat. Ajout de la sécurisation d'accès au site construit. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 43

44 Stage pratique de 4 jour(s) Réf : SRB Développeurs Java impliqués dans le développement d'une couche de présentation Web. Il est nécessaire que les participants aient déjà une expérience de la programmation de Servlet/ Jsp. Prix 2016 : 2390 HT Dates des sessions Paris 15 mar. 2016, 7 juin sep. 2016, 15 nov Struts 2, développer des applications Web MVC OBJECTIFS 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. 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 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. 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. 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. 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. 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. 7) L'approche "Model Driven" - Implémentation du modèle CRUD en Struts 2. 8) Compléments ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 44

45 - 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. Externaliser les libellés des actions et des JSP dans des fichiers de propriétés. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 45

46 Stage pratique de 2 jour(s) Réf : HCS Développeurs Web. Chefs de projet Web. Connaissances de base de HTML et CSS. Prix 2016 : 1410 HT Dates des sessions Paris 11 fév. 2016, 3 mar avr. 2016, 3 mai juin 2016, 7&28 juil sep. 2016, 6 oct nov. 2016, 1 déc Aix 4 fév. 2016, 3 mai oct. 2016, 8 déc Bordeaux 25 fév. 2016, 26 mai sep. 2016, 15 déc Bruxelles 18 fév. 2016, 26 mai 2016 Geneve 18 fév. 2016, 26 mai 2016 Grenoble 4 fév. 2016, 3 mai oct. 2016, 8 déc Lille 4 fév. 2016, 3 mai oct. 2016, 8 déc Luxembourg 18 fév. 2016, 26 mai 2016 Lyon 4 fév. 2016, 3 mai oct. 2016, 8 déc Montpellier 25 fév. 2016, 26 mai sep. 2016, 15 déc Nantes 25 fév. 2016, 26 mai sep. 2016, 15 déc Rennes 25 fév. 2016, 26 mai sep. 2016, 15 déc Sophia-antipolis 4 fév. 2016, 3 mai oct. 2016, 8 déc Strasbourg 4 fév. 2016, 3 mai oct. 2016, 8 déc Toulouse 25 fév. 2016, 26 mai sep. 2016, 15 déc HTML5, CSS 3, créer des sites Web modernes et dynamiques Best OBJECTIFS 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. 1) Rappels 2) Introduction au HTML 5 3) Nouvelle structuration 4) Les nouvelles balises HTML 1) Rappels 5) Les sélecteurs CSS 3 6) Les couleurs et la mise en forme du texte 7) La mise en forme des boîtes et des fonds 8) Les transformations - 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... - Le modèle de document (DOM). - Le protocole HTTP. - Interaction client/serveur HTTP. - Interprétation du HTML par le navigateur. - Position des navigateurs face aux technologies HTML. 2) Introduction au HTML 5 - 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. Démonstrations. Découvertes des possibilités et du champ d'action. 3) Nouvelle structuration - 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. Mise en place et validation de la structure d'un document HTML 5. 4) Les nouvelles balises HTML - Les balises et attributs obsolètes. - Les images SVG pour le dessin vectoriel. - Les canevas pour le dessin "bitmap". - 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> ( , date, week...). ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 46

47 - 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. 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. 5) Les sélecteurs CSS 3 - Rappel sur la syntaxe : les sélecteurs, les règles. - 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. - Media Queries pour le chargement conditionnel des CSS selon la résolution ou l'orientation du terminal. - Création de layout avec flexbox (organisation des éléments en fonction d'une grille). Intégration de CSS 3 aux applications Web. Sélection d'éléments d'une page HTML 5. 6) Les couleurs et la mise en forme du texte - Rappel sur les déclarations rgb et rgba. - Les modèles hsl et hsla. - La propriété opacity. - Support des polices - 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... - Les modes multicolonnes avec column-count, column-width... Application de couleurs. Mise en forme de textes. Gestion multicolonne. 7) La mise en forme des boîtes et des fonds - 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. Appliquer des ombres et des arrondis. 8) Les transformations - Les transformations : translations, rotations, homothéties (-webkit-transform). - Les animations : les animations, les transitions (#webkit-transition). Animations et effets de transition. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 47

48 Stage pratique de 2 jour(s) Réf : NYD Développeurs de contenus Web riches, toutes les personnes souhaitant découvrir ou opérer une migration vers HTML 5. Bonnes connaissances du HTML et des technologies du Web. Connaissance du langage de programmation JavaScript. Prix 2016 : 1410 HT Dates des sessions Paris 3 mar. 2016, 19 mai sep. 2016, 3 nov Canvas, créer des animations dynamiques en HTML5 HTML 5 apporte des solutions puissantes et indépendantes pour la création de contenus riches. Au cours de cette formation, vous apprendrez à développer des jeux et des éléments Rich Media en HTML 5 avec JavaScript. Vous découvrirez également les possibilités d'animation 2D et 3D. OBJECTIFS PEDAGOGIQUES Dessiner, animer, créer des graphiques et des images Créer des bannières interactives et des jeux Créer des animations 3D 1) HTML 5 rappels 2) L'API Canvas avec JavaScript 3) Création d'un concept Rich Media Méthodes pédagogiques Développement, présentation et mise en oeuvre d'applications existantes. 4) Faciliter la création avec les frameworks 5) 3D avec Three.js En alternant programmation, pratique et théorie, vous apprendrez à concevoir et réaliser des contenus riches et connectés en HTML5. 1) HTML 5 rappels - Composants d'une application Web. - Tour d'horizon des frameworks HTML 5. - Les nouvelles API orientées médias. - Perspectives et conséquences pour les développeurs. - Le langage JavaScript : mise à niveau. Programmation autour des nouvelles API JavaScript. 2) L'API Canvas avec JavaScript - L'élément Canvas. Présentation de L'API. - Dessiner : gestion du remplissage. - Création des formes. - Importer, utiliser des images et manipuler les pixels. - Gestion du texte. Création des effets (ombres...). - Première animation et principes pratiques. - Optimiser le canvas. Révision et programmation JavaScript. Utilisation avec l'élément canvas pour réaliser des graphiques. 3) Création d'un concept Rich Media - Motivation utilisateur : "feedback", "fish bait", émotionnelle... - Gameplay : règles et ergonomie. - Structurer les écrans essentiels : ouverture, interstice, "packshot". - Intégrer un processus de conception partagée. - Intégrer une dimension sociale par les réseaux : Facebook. - Préparation et organisation des ressources. Réflexion collective Création inversée du plan conceptuel à partir d'une étude de cas concrète. Définition d'un concept personnalisé de contenu Rich Media promotionnel selon les ressources fournies. 4) Faciliter la création avec les frameworks - Quelle solution choisir? KineticJS, PaperJS, FabricJS... - KineticJS, présentation et concepts. Tour d'horizon de l'api. - Organisation des ressources : stage, layers, groups. - Création de tracés et importation de bitmap. - Gestion des événements. - Animation et interpolation. Drag and Drop. Création de bannières interactives et de jeux connectés. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 48

49 5) 3D avec Three.js - 3D en Javascript, présentation et théorie. - Notion de scène : création. - Mise en œuvre des caméras. - Concepts clés du framework. - Gestion des lumières. - Définition et animation d'objets. - Application de textures. Création d'une animation HTML 5 en 3D avec Three.js ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 49

50 Stage pratique de 2 jour(s) Réf : GOD Webmasters, graphistes ou toute personne en charge de la communication publicitaire de sites Internet. Connaissances de base en HTML et CSS Prix 2016 : 1410 HT Dates des sessions Paris 7 mar. 2016, 30 mai sep. 2016, 28 nov 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. OBJECTIFS PEDAGOGIQUES 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 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. 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. 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. 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...). ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 50

51 - Ajouter des événements. - Créer des annonces Generic (Ad Exchange). 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. 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. Réalisation d'un header animé. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 51

52 Stage pratique de 2 jour(s) Réf : SVI Développeurs, graphistes ou responsables de projets. Connaissances de base en programmation ainsi que des langages html ou xml. La connaissance du JavaScript est un plus. Prix 2016 : 1410 HT Dates des sessions Paris 21 mar. 2016, 23 mai 2016 SVG, créer des graphiques vectoriels interactifs pour le Web conception pour navigateurs multiplateformes Format vectoriel standardisé, SVG permet de concevoir des images de qualité qu'elles soient statiques, dynamiques ou interactives. Vous apprendrez dans ce cours à créer des contenus graphiques directement intégrables dans des pages Web compatibles avec l'ensemble des smartphones, tablettes et ordinateurs actuels. OBJECTIFS PEDAGOGIQUES Créer des images vectorielles Réaliser des animations interactives Créer et éditer des graphismes vectoriels avec Inskscape 1) Introduction 2) Le format SVG 3) La définition de chemins 4) Coordonnées 5) Animations 6) Intégration SVG dans des pages Web 7) Production d'images SVG Réalisation d'images SVG, intégration d'animations synchronisées avec des contenus multimédias (HTML5). Réalisation d'une application Web interactive. 1) Introduction - Les formats vectoriels et les formats pixels. - Historique du SVG et du XML. - Support des navigateurs. 2) Le format SVG - Les principales balises : les objets géométriques, le texte, les couleurs, les remplissages et les gradients. - Les groupes (élément <g>). - Les références internes. Réalisation d'images simples. 3) La définition de chemins - Les différents types : les lignes brisées, les courbes de Bézier, les arcs d'ellipse. - La polarité des chemins. - Combiner et dissocier des chemins. - Le style des contours. Création d'une image contenant des chemins de chaque type possible. 4) Coordonnées - Le système de coordonnées : l'attribut viewbox. - Les transformations : rotation, translation, transformation matricielle. - Les combinaisons de transformations. Création d'images contenant les différents types de transformations. 5) Animations - Les balises SMIL : les actions possibles, le contrôle de l'évolution temporelle. - La manipulation du DOM par JavaScript. - Animation par CSS3. - Comment intégrer le CSS et le JavaScript dans le SVG? Intégration d'animations dans les images précédemment réalisées. 6) Intégration SVG dans des pages Web - Intégration par la balise <img> du HTML. - Intégration par mixage des espaces de nommage XML (via l'attribut xmlns). ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 52

53 - Apport de styles externalisés par CSS. - Apport de comportements externalisés par JavaScript. - Lier des comportements entre SVG et HTML. Réalisation d'une page Web HTML5 utilisant une image SVG directement intégrée dans le code xhtml du document racine. Synchronisation des animations sur un contenu multimédia. 7) Production d'images SVG - Prise en main de l'outil de dessin vectoriel Inkscape. - Comment ajouter des effets sur une image produite par Inkscape? - Les pièges des interfaces graphiques à éviter. - Comment corriger un fichier SVG corrompu? Production d'une image par Inkscape, intégration d'animations à partir d'un éditeur de texte puis modification de l'image à partir d'inkscape. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 53

54 Stage pratique de 4 jour(s) Réf : LSX Concepteurs et développeurs d'applications, architectes logiciels, chefs de projets. Connaissances de base en XML et de la syntaxe HTML. Développer avec XSL-T et XSL-FO générer des documents XML, HTML, graphiques et pdf OBJECTIFS 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 2016 : 2390 HT Dates des sessions Paris 9 fév. 2016, 10 mai juil. 2016, 13 sep nov ) 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. 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. 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. - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 54

55 - Dynamisation XSL de documents bureautiques : Microsoft Office (Open XML), Open Office (Open Document). 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. 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 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. 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 55

56 Stage pratique de 4 jour(s) Réf : XAW Webmasters, développeurs Web et informaticiens. Bonnes connaissances du Web, d'html et de CSS. Connaissances de base du JavaScript et du XML. Prix 2016 : 2390 HT 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. OBJECTIFS PEDAGOGIQUES 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 Dates des sessions Paris 22 mar. 2016, 17 mai juil. 2016, 6 sep nov ) 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). Création de documents XML, JSON, lecture de documents XSD. 2) Web Les concepts et les technologies Web Règles de conception. - Navigateurs et terminaux du marché, impact sur la portabilité. - Importance de la sémantique sur le référencement. 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. 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. Développement d'une application de base Responsive, création de widgets. 5) Interaction et formulaires - Formulaires dynamiques dans les interfaces Web Les solutions de contrôle de saisie (autosuggest...). - Raccordement aux bases de données. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 56

57 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. 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 WordPress pour la création et gestion de ses blogs. - Les Wikis. - Les solutions de commerce 2.0 (Prestashop, Magento...). Création d'un blog, d'une boutique en ligne. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 57

58 Stage pratique de 3 jour(s) Réf : SPT Développeurs JavaScript confirmés, architectes et chefs de projets. Bonne connaissance de JavasScript (ES5) est requise. Connaissance de base des composants du web. Prix 2016 : 1920 HT Dates des sessions Ecmascript 6, mettre en oeuvre le nouveau JavaScript anticiper la migration des applications Nouveau 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 OBJECTIFS PEDAGOGIQUES 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 Paris 8 fév. 2016, 4 avr juin 2016, 12 sep nov ) De JavaScript ES5 à ES2015 2) Evolutions syntaxiques fondamentales 3) POO, nouveautés pour la conception objet Méthodes pédagogiques 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. Réalisation d'une application et portage en modules ES6. 1) De JavaScript ES5 à ES 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. 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. Migration du code vers ES ) 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. 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. Développement d'un service de données Ajax utilisant l'api des Promise. 5) Modules JavaScript - Asynchronous Module Definition ou CommonJS. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 58

59 - Système natif de gestion des modules. - Gestion et résolution des dépendances. - Chargement dynamique. 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...). Création et intégration de package dans le développement. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 59

60 Stage pratique de 2 jour(s) Réf : HML Développeurs Web. Chefs de projet Web. 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. Bonnes connaissances du langage HTML et de JavaScript. Prix 2016 : 1410 HT Ce cours fait l'objet d'un accompagnement vidéo 1) Introduction 2) Gestion de la persistance 3) Gestion du cache 1) Introduction 4) Communication Client/Serveur 5) Gestion du glisser/copier 6) Géolocalisation Dates des sessions Paris 10 mar. 2016, 2 juin sep. 2016, 7 nov 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... 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. 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. 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 60

61 Stage pratique de 4 jour(s) Réf : FUJ Développeurs et chefs de projets. Bonnes connaissances des fondamentaux du langage JavaScript (notamment de la notion de callback) ainsi que des notions affirmées de HTML et CSS. Prix 2016 : 2390 HT Dates des sessions Paris 16 fév. 2016, 8 mar avr. 2016, 17 mai juin 2016, 19 juil aoû. 2016, 6&20 sep oct. 2016, 22 nov déc Aix 16 fév. 2016, 7 juin oct. 2016, 20 déc Bordeaux 23 fév. 2016, 14 juin oct. 2016, 13 déc Grenoble 16 fév. 2016, 7 juin oct. 2016, 20 déc Lille 16 fév. 2016, 7 juin oct. 2016, 20 déc Lyon 16 fév. 2016, 7 juin oct. 2016, 20 déc Montpellier 23 fév. 2016, 14 juin oct. 2016, 13 déc Nantes 23 fév. 2016, 14 juin oct. 2016, 13 déc Rennes 23 fév. 2016, 14 juin oct. 2016, 13 déc Sophia-antipolis 16 fév. 2016, 7 juin oct. 2016, 20 déc Strasbourg 16 fév. 2016, 7 juin oct. 2016, 20 déc Toulouse 23 fév. 2016, 14 juin oct. 2016, 13 déc Développer des applications Web Full JavaScript 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. OBJECTIFS PEDAGOGIQUES 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 1) Rappels de fondamentaux 2) Introduction à Node.js 3) La persistance via une approche NoSQL 4) Initiation à Grunt, Bower et Bootstrap Méthodes pédagogiques 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 - Concepts généraux JavaScript et JSON. - La programmation événementielle en JavaScript. - La manipulation du Document Object Model (DOM). 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. 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. 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. - Mise en place d'une API REST. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 61

62 - La gestion des erreurs. 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. 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. Refactoring de l'application construite afin de suivre l'approche MEAN. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 62

63 Stage pratique de 3 jour(s) Réf : JVS 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. Bonnes connaissances du HTML et des technologies du Web. Connaissance du langage de programmation JavaScript. Prix 2016 : 1920 HT Dates des sessions Paris 29 fév. 2016, 23 mai sep. 2016, 7 nov Industrialisation Front-End, maîtriser vos pratiques de développement 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. OBJECTIFS PEDAGOGIQUES 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 Méthodes pédagogiques Développement, présentation et mise en oeuvre d'applications existantes. 5) Automatisation des tâches avec GRUNT 6) Intégration des tests automatisés 7) Créer un template de projet 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. 1) Composants d'une application Web - 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 CoffeeScript et TypeScript. - Organiser le développement JavaScript. - Optimiser l'empreinte des ressources. Migrer une application Web en utilisant LESS et le développement modulaire JavaScript. 2) Choisir l'environnement de développement - 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). Découverte des différentes plates-formes. Personnaliser l'ide SublimeText. 3) "Versionner" avec GIT - Gestion de source : centralisée vs distribuée. - Concepts de base, initialiser un repository. - Organiser les branches de développement. Mise en place d'un processus de développement en branches. 4) Node.js comme utilitaire de développement - 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. Créer un module pour configurer les dépendances du projet. 5) Automatisation des tâches avec GRUNT - Présentation : automatisation des tâches. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 63

64 - Définition des types de tâches : créer une commande. - Structure d'un fichier Gruntfile.js. - Les contributions indispensables. - Créer un "Build" efficace avec Grunt. Configurer et utiliser Grunt. 6) Intégration des tests automatisés - 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. Tests unitaires avec Jasmine. Automatisation avec Karma. 7) Créer un template de projet - Présentation, avantage et inconvénient du scaffolding. - Quels utilitaires : Yeoman, Lineman? - Les générateurs de Yo. Création de générateur. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 64

65 Stage pratique de 3 jour(s) Réf : FAN Architectes, développeurs et chefs de projet Web désireux d'optimiser leur application Web avec JavaScript. Bonnes connaissances du HTML et des technologies du Web. Connaissance du langage de programmation JavaScript. Prix 2016 : 1920 HT Dates des sessions Paris 25 jan. 2016, 22 fév mar. 2016, 18 avr mai 2016, 27 juin juil. 2016, 22 aoû &12 sep. 2016, 10 oct nov. 2016, 12 déc Aix 22 fév. 2016, 18 avr juin 2016, 19 sep nov. 2016, 19 déc Bordeaux 29 fév. 2016, 25 avr juin 2016, 26 sep &28 nov Bruxelles 20 jan Grenoble 22 fév. 2016, 18 avr juin 2016, 19 sep nov. 2016, 19 déc Lille 22 fév. 2016, 18 avr juin 2016, 19 sep nov. 2016, 19 déc Lyon 22 fév. 2016, 18 avr juin 2016, 19 sep nov. 2016, 19 déc Montpellier 29 fév. 2016, 25 avr juin 2016, 26 sep &28 nov Nantes 29 fév. 2016, 25 avr juin 2016, 26 sep &28 nov Rennes 29 fév. 2016, 25 avr juin 2016, 26 sep &28 nov Sophia-antipolis 22 fév. 2016, 18 avr juin 2016, 19 sep nov. 2016, 19 déc Strasbourg 22 fév. 2016, 18 avr juin 2016, 19 sep nov. 2016, 19 déc Toulouse 29 fév. 2016, 25 avr juin 2016, 26 sep &28 nov AngularJS, maîtriser le Framework JavaScript de Google Best OBJECTIFS 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. 1) Rappels JavaScript 2) Présentation du framework AngularJS 3) Contrôleurs et gestion des scopes 4) Module et injection de dépendance Méthodes pédagogiques Développement, présentation d'applications existantes. 5) Définition des routes 6) Fonctionnalité de données, Echange Serveur 7) Intégration des tests automatisés 8) Bonnes pratiques et outils Vous transformerez une maquette HTML en "Single Page Application" utilisant les fonctionnalités du framework AngularJS. 1) Rappels JavaScript - 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. 2) Présentation du framework AngularJS - AngularJS, positionnement : jquery, ExtJS... - Intégration. Compatibilité, versions, documentation. - Fonctionnalités et principes généraux. - Directives AngularsJS, compilateur HTML. - Expressions. Data-Binding bidirectionnel. Filtres. Exercice Préparation d'une maquette HTML pour développer avec AngularJS. 3) Contrôleurs et gestion des scopes - Création et utilisation des contrôleurs. - Gestion du contexte, la variable $scope. - Propagation des événements. API. Dirty Checking. - Traitement et validation des formulaires. Exercice Intégration des contrôleurs. 4) Module et injection de dépendance - Fonctionnalités de l'objet angular. - Principe de l'injection de dépendance. - Notion de module. Configuration. - Découper son application. Exercice Modularisation de l'application. 5) Définition des routes - 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 ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 65

66 Création d'une "Single Page Application". 6) Fonctionnalité de données, Echange Serveur - 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. 7) Intégration des tests automatisés - Utilitaires de test : Jasmine. Angular-scenario. Test : contrôleurs, services... Utilisation avec Karma. - End to End Testing : interface utilisateur. Exercice Création des tests unitaires. 8) Bonnes pratiques et outils - Yeoman, optimisation du développement. - Internationalisation (I18N), mise en oeuvre. Démonstration Mise en oeuvre. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 66

67 Stage pratique de 2 jour(s) Réf : GUL Architectes, développeurs désireux de se spécialiser et d'optimiser leur conception d'application avec d'angularjs. Connaissances pratiques du framework AngularJS et des outils modernes du développement Front- End (Bower, Grunt, Framework CSS...). Bonnes connaissances JavaScript et des Patterns Objets. Prix 2016 : 1410 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 10 mar. 2016, 2 juin oct. 2016, 15 déc 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. OBJECTIFS PEDAGOGIQUES Appréhender AngularJS en profondeur Devancer les besoins conceptuels Savoir développer et gérer des composants métiers Optimiser une application AngularJS 1) "Best Pratices" et rappels 2) Maîtriser les directives et la "compilation" AngularJS Méthodes pédagogiques Développement, présentation d'applications existantes. 3) Utiliser et écrire des composants avancés. 4) AngularJS : optimisation des développements 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. 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 67

68 Stage pratique de 5 jour(s) Réf : ERY Développeurs Web. Informaticiens souhaitant développer des applications Web utilisant jquery. Connaissances de base du langage JavaScript et des technologies Web. Bonnes connaissances du langage HTML. Prix 2016 : 2560 HT Dates des sessions Paris 1 fév. 2016, 21 mar avr. 2016, 9 mai juin 2016, 18 juil aoû. 2016, 12&26 sep oct. 2016, 14 nov déc Aix 15 fév. 2016, 13 juin sep. 2016, 5 déc Bordeaux 1 fév. 2016, 30 mai sep. 2016, 5 déc Grenoble 15 fév. 2016, 13 juin sep. 2016, 5 déc Lille 15 fév. 2016, 13 juin sep. 2016, 5 déc Lyon 15 fév. 2016, 13 juin sep. 2016, 5 déc Montpellier 1 fév. 2016, 30 mai sep. 2016, 5 déc Nantes 1 fév. 2016, 30 mai sep. 2016, 5 déc Rennes 1 fév. 2016, 30 mai sep. 2016, 5 déc Sophia-antipolis 15 fév. 2016, 13 juin sep. 2016, 5 déc Strasbourg 15 fév. 2016, 13 juin sep. 2016, 5 déc Toulouse 1 fév. 2016, 30 mai sep. 2016, 5 déc JQuery, développer des applications Web 2.0 Best OBJECTIFS 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. 1) Présentation de jquery 2) Méthodes utilitaires de jquery 3) Les sélecteurs 4) Accès à l'arbre DOM Mise en place d'applications Web utilisant jquery. 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. 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. 5) La gestion des événements 6) Ajax et jquery 7) Effets visuels et interface riche avec jquery Mise en place d'applications Web avec différents types d'éléments en utilisant jquery. 3) Les sélecteurs - Présentation des sélecteurs jquery. - Rôle des sélecteurs. Les différents types de sélecteurs. - Les pseudo-classes. Les combinateurs. Mise en place d'applications Web utilisant des sélecteurs. 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. Manipulation de l'arbre DOM. 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. - Requêtes Ajax en utilisant $.ajax(). - Traitement de la réponse du serveur. - Transmission de paramètres au serveur. Utilisation d'ajax avec jquery. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 68

69 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. Mise en place d'effets visuels. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 69

70 Stage pratique de 4 jour(s) Réf : NJS Tout développeur connaissant le langage Javascript et souhaitant développer des applications performantes (haute réactivité, volumétries importantes de transactions) et orientées événements. Bonnes connaissances du langage Javascript. Une première approche d'un framework Javascript (côté client) serait un plus. Prix 2016 : 2390 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 12 jan. 2016, 15 mar mai 2016, 13 sep nov 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. OBJECTIFS PEDAGOGIQUES Installer et configurer un serveur Node.js Développer des applications JavaScript côté serveur Mettre en œuvre les concepts de la programmation événementielle et asynchrone Mettre en place un gestionnaire de routes Manipuler l'api de Node.js Gérer la persistance dans une base de données NoSQL 1) Du JavaScript côté serveur 2) Premiers pas en Node.js 3) La programmation asynchrone et orientée événements 4) La gestion de routes Etude de cas 5) Tour d'horizon de l'api Node.js 6) Persistance des données 7) Test d'une application Node.js 8) La boîte à outils du développeur Construction d'une application SPA (Single Page Application) en abordant les thématiques de la programmation asynchrone, l'injection... 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? - Approche non bloquante d'une application. - L'écosystème Node.js (socketstream, expressjs...). 2) Premiers pas en Node.js - Installation du serveur Node.js. - Le gestionnaire d'extensions NPM. - Premier cas concret : Hello World! - Un serveur Web en quelques lignes. - L'injection de fonctions en Javascript. Usage de l'utilitaire NPM. Développer une première application. 3) La programmation asynchrone et orientée événements - Quel intérêt de développer en asynchrone? - La gestion événementielle : réagir plutôt qu'attendre. - Cas concret pour la lecture de flux. - Usage dans les bases de données. Exemple de programmation non bloquante en Node.js, gestion d'un flux XML (Yahoo Météo). 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. Mise en place d'un gestionnaire de routes avec gestion d'un upload de document. 5) Tour d'horizon de l'api Node.js - Les fonctions utilitaires (console, outil...). - La gestion de buffers. Accès aux fichiers. - Utilisation des évents et des timers programmables. - Gestion des requêtes/réponses HTTP. HTTPS. - Création de processus fils, https, sockets TCP et UDP... ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 70

71 Traitements batch de fichiers, recherche en ligne sur Google... 6) Persistance des données - Initiation à une base NoSQL : Redis.io. - Utilisation de Redis.io pour la gestion de session. - Persister dans le Cloud : MongoDB. Gestion d'une persistance dans Redis.io. Démonstration dans le Cloud avec MongoDB. 7) Test d'une application Node.js - Premiers pas en test avec Mocha. - Les assertions et le test synchrone et asynchrone. - Différentes méthodes de tests (inclusifs, exclusifs...). - Le support du navigateur. Tester une application avec Mocha. 8) La boîte à outils du développeur - Les "ceintures d'outils" Javascript : gestion améliorée des tableaux, des itérations... - La bibliothèque async : rendre l'asynchrone séquentiel. - Autres bibliothèques intéressantes. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 71

72 Stage pratique de 3 jour(s) Réf : NCH Développeurs Web, informaticiens. Bonnes connaissances du langage JavaScript et des technologies Web. Bonnes connaissances de la programmation orientée objet. Prix 2016 : 1920 HT Dates des sessions Sencha Ext-JS 5, développer des applications multiplateformes en JavaScript Nouveau Vous apprendrez dans ce cours à concevoir des applications Web interactives et multiplateformes avec la bibliothèque Ext JS 5. 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". OBJECTIFS PEDAGOGIQUES Installer Ext JS et son environnement Créer des applications MVC / MVVM Créer et mettre en œuvre des composants graphiques Gérer des données Elaborer des thèmes Paris 14 mar. 2016, 23 mai sep ) 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 1) Présentation du framework - Environnement : éditeur, Sencha Cmd... - Exécuter et déboguer une application. - Architecture d'une application Ext-JS 5, le modèle MVC versus MVVM. Installation d'ext-js. Création d'un espace de travail. Déboguer une application Ext-JS. 2) Concepts fondamentaux - 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 : Ext.require(). Créer une application avec Sencha Cmd. Créer des composants personnalisés. 3) Composants de base - Les éléments de base : Composants, Conteneurs et Evénements. - Les objets «Panels», «Toolbar» et «Buttons». - Comprendre les "Layouts". Les objets «Windows». - Les méthodes utilitaires. Agencer les composants de l'application. Créer des boutons et des fenêtres. 4) Architecture d'une application - Le modèle MVC / MVVM. Concepts du pattern V VC VM : ViewController, ViewModel, Databinding. - Les dépendances : requires, views, models et stores. - Envoi d'événements personnalisés. Modulariser les classes. Définition et utilisation d'un pattern MVVM et du databinding. 5) Gestion des données - 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". Créer, valider et associer les données. 6) Composants graphiques orientés données - Templating et Vue. Les graphiques. - Les grilles : Stores, Columns, Features... ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 72

73 - Les arbres : nœud racine/enfants, TreeStore... - Les formulaires : l'objet de soumission, les champs, la soumission... Utilisation de templates. Mise en place de grilles, d'arbres, de formulaires... 7) Concepts avancés - Routages des URL de l'application. - Responsive Design. Modifier les CSS et les thèmes avec Sass et Compass. - Build de l'application avec Sencha Cmd. - Internationalisation. Améliorer les performances des applications. - Nouveautés Ext-JS 6 (Modern Toolkit, Sencha Fashion...). Associer une URL à un écran. Rendre une application "responsive design". Mettre à jour le thème à l'exécution. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 73

74 Stage pratique de 2 jour(s) Réf : BOO Webmasters, développeurs et intégrateurs. Connaître HTML et CSS et avoir des notions de JavaScript. Prix 2016 : 1410 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 14 avr. 2016, 16 juin sep. 2016, 17 nov BootStrap, développer des pages Web Responsive Nouveau 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. OBJECTIFS PEDAGOGIQUES 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 1) Présentation du framework 2) Les feuilles de style de Bootstrap 3) Les grilles Méthodes pédagogiques 50% d'exposé, 50% de pratique. 4) Les composants de base 5) Les plug-ins jquery de Bootstrap 6) Analyse des modèles Bootstrap Réalisation d'une interface administrateur back-office avec Bootstrap. Création d'un site Web Responsive depuis un modèle Bootstrap. 1) Présentation du framework - 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. 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 glyphicons pour afficher des icônes sur les pages. - Les CSS pour la mise en page, les blocs de texte. - Personnaliser sa feuille de style. 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 74

75 - La barre de navigation. Les onglets. Les menus déroulants. - Les champs d'auto-complétion. - Intégration de plug-ins externes (Datepicker...). 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. Créer un site depuis un modèle. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 75

76 Stage pratique de 2 jour(s) Réf : SSC Intégrateurs et développeurs front-end souhaitant optimiser leurs méthodes de création de feuilles de style. Bonnes connaissances de CSS. Connaissances de base en HTML. Prix 2016 : 1410 HT Dates des sessions Paris 7 avr. 2016, 16 juin sep Sass, Compass et Less, simplifier la création et la maintenance de vos CSS Nouveau 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. OBJECTIFS PEDAGOGIQUES 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. Installer et configurer Sass. Créer une première page à l'aide de Sass. Convertir une page existante codée en CSS vers Sass. 3) Sass, utilisation avancée - Les mixins et - 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. 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 icon-font. - Les grilles CSS et les helpers de layout. - Les principaux plug-ins et outils associés. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 76

77 - Les règles imbriquées, mixins et fonctions natives. - Outils complémentaires. - Comparaison avec Sass & Compass. 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. Application de la méthodologie SMACCS. Optimiser le code et le temps de chargement/rendu. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 77

78 Stage pratique de 3 jour(s) Réf : TJS Développeurs JavaScript, architectes et chefs de projets web. Bonne connaissance de JavaScript, pratique du développement web. Prix 2016 : 1920 HT ReactJS, maîtriser le Framework JavaScript de Facebook Nouveau 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. OBJECTIFS PEDAGOGIQUES Développer avec ReactJS Concevoir une SPA avec ReactJS et Flux Comprendre le subset JavaScript JSX Optimiser les performances des RIA Dates des sessions Paris 14 mar. 2016, 20 juin sep ) Rappels des composants des RIA 2) Développer avec ReactJS 3) Interactivité des composants Méthodes pédagogiques 4) Application monopage avec ReactJS et Flux 5) Application isomorphique 6) Introduction à React Native Développement guidé. 50% de théorie illustrée par 50% de pratique. 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. 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. 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. Création d'un ensemble structuré de composant UI. 4) Application monopage avec ReactJS et Flux - Flux : présentation. Propagation de données. - Création de vues et contrôleurs. - Rôle du "Dispacther" pour les actions. - "Stores", gestionnaire d'états logique. - Extension pour ReactJS : animation. Data-binding bidirectionnel... ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 78

79 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 79

80 Stage pratique de 3 jour(s) Réf : BAB Chefs de projet web, architectes techniques, développeurs front-end. 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 3) Concepts avancés 4) Concevoir les formulaires 5) Organiser, structurer et enrichir Backbone.js 6) Les extensions de Backbone.js 7) Tester unitairement Backbone.js Méthodes pédagogiques 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). 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. 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. Récupérer des données via un WebService REST et les afficher dans une interface. 3) Concepts avancés - 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. 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. 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. Encapsuler les composants d'application dans un pattern AMD en utilisant les libraires RequireJS. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 80

81 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. 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. Ecriture de tests unitaires à l'aide de Mocha. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 81

82 Stage pratique de 4 jour(s) Réf : DAS Concepteurs, développeurs. Connaissances en HTML et JavaScript Facebook et Twitter, développer vos propres applications Web 'sociales' Les fonctionnalités des réseaux sociaux s'exportent au-delà de leurs propres sites grâce à leurs API. Vous découvrirez dans ce stage les possibilités offertes par deux API majeures du moment, Facebook et Twitter. Vous apprendrez à les maîtriser afin d'enrichir vos applications Web en les connectant à ces plateformes. OBJECTIFS PEDAGOGIQUES Connaître les différentes possibilités d'interaction avec les réseaux sociaux Utiliser les API et SDK des plateformes Facebook et Twitter Maîtriser les outils de développement et de test associés à ces plateformes 1) Introduction 2) Créer une application Facebook 3) Opengraph et les plug-ins sociaux Facebook 4) Utiliser les SDK JavaScript et PHP 5) Login Facebook 6) Maîtriser les API Facebook 7) Les API de Twitter Création d'une application Web enrichie tout au long de la formation. 1) Introduction - Contexte et chiffres clés. Enjeux des réseaux sociaux. - Impact sur le Web : SEO vs SMO. - Principe d'api : le Web des applications. - Fonctionnalités Facebook côté utilisateur. - Fonctionnalités Twitter côté utilisateur. Créer un compte utilisateur sur les plateformes Twitter et Facebook pour tester leurs principales fonctionnalités. 2) Créer une application Facebook - Concepts de base. Les pages fan. - Les applications en onglet. - Les applications Web. Les applications mobiles. - L'interface de gestion d'une application. Créer et administrer une application Facebook. Tester les différentes possibilités de paramétrage. 3) Opengraph et les plug-ins sociaux Facebook - Socialiser un site avec Opengraph. - Comment installer un plug-in social? Les principaux plug-ins : Like, Like-box, Share, Send, Comment. - Les autres plug-ins sociaux. Enrichir l'application avec les tags Opengraph, y intégrer différents plug-ins. 4) Utiliser les SDK JavaScript et PHP - Présentation des SDK disponibles. - Focus sur les SDK JavaScript et PHP. - Comment créer une page utilisant le SDK JavaScript? - Boîtes de dialogue Facebook avec le SDK JavaScript. - Les fonctions des plug-ins sociaux en JavaScript. Dynamiser l'application avec le SDK JavaScript. 5) Login Facebook - Quelles utilisations? Présentation du protocole Oauth. - La mécanique de permissions. Les données disponibles. - Des outils pour tester et déboguer. Récupérer les informations d'un utilisateur avec Facebook Connect. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 82

83 6) Maîtriser les API Facebook - Graph API : comment utiliser l'api REST? - Utilisation avancée : pagination, batch requests, gestion des erreurs. - Realtime updates. Aller plus loin avec FQL. - Les autres API. Les outils de test et de débogage. Intégrer des données issues de Facebook dans l'application avec Graph API. 7) Les API de Twitter - Les étapes de création d'une application. - L'authentification. L'API REST. Streaming API. - Ressources et outils. Récupérer et publier des tweets depuis l'application. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 83

84 Stage pratique de 2 jour(s) Réf : COW Ce cours s'adresse à tous les chefs de projet, web masters, informaticiens, maîtres d'ouvrage... Aucune connaissance particulière. Réussir votre projet Web OBJECTIFS 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. 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. 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. 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. 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. Réaliser le CDC d'une étude de cas. 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. 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). Atelier de pilotage projet. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 84

85 Stage pratique de 3 jour(s) Réf : WEM Ce cours s'adresse à tout Webmaster en devenir, ou à tous ceux en poste qui souhaitent renforcer ou mettre à jour leur connaissance du métier. Connaissances de base en création de sites Web. Prix 2016 : 1920 HT Dates des sessions Paris 29 mar. 2016, 27 juin oct. 2016, 5 déc 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 graphiques, HTML, XML 2) Expression des besoins 3) Gestion de l'hébergement 1) Editeurs graphiques, HTML, XML - Outils pour développer et maintenir les sites Web. - Outils de gestion graphique, Fireworks CS3. - Savoir faire et modifier des animations Flash. - Utiliser Dreamweaver CS3 pour auditer le code. - Savoir débuguer les pages HTML et JavaScript. Mise en œuvre de ces outils pour réaliser des composants HTML, PNG, Flash. 2) Expression des besoins 4) Animer le site Web 5) Suivi de projet Web 6) Technologies émergentes et Web 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. Etude de cas Réaliser un cahier des charges. 3) Gestion de l'hébergement - Comment acheter et raccorder un nom de domaine au site? Choisir le bon type d'hébergement. - Réussir une migration vers un nouvel hébergeur. - Analyser les besoins spécifiques d'un site Web multimédia (streaming, multicanaux...). - Maintenance et administration du serveur Web. Optimisation du trafic. Importance de la sécurité. Définir un choix de sites Web, acquisition de noms de domaine autour de plusieurs études de cas. 4) Animer le site Web - Savoir définir un plan d'animation de site Web. - Règles pour bien référencer le site. - Comment définir l'indice de popularité du site? - Analyse des techniques d'animation : newsletters, forums, blogs, bannières publicitaires, jeux, quiz... Analyse des différentes techniques et définition d'un plan d'animation sur un site donné. 5) Suivi de projet Web - Recherche de prestataires pour le développement d'applications Web. - Règles juridiques et administratives. La CNIL. - Suivre le référencement, actions correctives. - Gestion d'une campagne publicitaire : budget, suivi. Utilisation des outils Google pour Webmasters. - Renforcer le rôle du Webmaster dans l'équipe projet : réunion, organisation, planification. - Tester la qualité du travail de la sous-traitance. Mise en pratique de la conduite de projet. 6) Technologies émergentes et Web Principes. Faire un site en respectant le Web Rôle de XML, utilisation pour l'échange de données. Intégrer Ajax. - Les clients riches : XUL, XAML, MXML, Flex. Mise en œuvre de ces multiples technologies. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 85

86 Stage pratique de 2 jour(s) Réf : OPS Chef de projet, Webmestre, développeur, designer, toute personne liée au développement et à la promotion d'un site Web. Connaissances de base des concepts et technologies Web. Prix 2016 : 1410 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 10 mar. 2016, 9 juin oct. 2016, 12 déc Optimiser le référencement de votre site Web OBJECTIFS 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. 1) Rappel sur le Web 2) Moteurs de recherche 3) Audit de référencement 1) Rappel sur le Web - Les serveurs Web (Apache, IIS). Protocole HTTP. - HTML, XHTML. Tests de validation, enjeux sur le référencement. Accessibilité. Création et audit de métatags, audit de conformité XHTML. 2) Moteurs de recherche 4) Techniques de référencement 5) Optimisation du site Web 6) Accroître la popularité du site, campagne de publicité Web - 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. Référencement sur des moteurs, annuaires, zones dédiées. 3) Audit de référencement - 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. Mise en oeuvre d'un audit. 4) Techniques de référencement - 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). Mise en oeuvre des techniques. Réécriture de contenu. 5) Optimisation du site Web - 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. 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,... Mise en place d'une campagne Google AdWords. Définition d'un plan d'animation. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 86

87 Stage pratique de 1 jour(s) Réf : GAW Commerciaux et responsables marketing ou toute personne liée à la promotion d'un site Web avec une campagne payante sur Internet. Connaissances de base des sites Web. Google Adwords, optimiser vos campagnes OBJECTIFS 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. 1) Etat des lieux 2) L'outil Google AdWords 3) Préparer sa campagne 4) Exploitation de l'outil 5) Optimiser ses campagnes 1) Etat des lieux - Le marché du Web. - La publicité payante sur Internet. - Les pratiques en termes de publicité sur le Web. - Faire la promotion de son entreprise sur Google. 2) L'outil Google AdWords - 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). Analyse et échange autour de différentes campagnes publicitaires existantes. 3) 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. Identifier ses besoins, ses mots-clés pour établir une campagne publicitaire. 4) 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. Prise en main de l'outil. Analyse des différentes étapes de la conception d'une campagne AdWords. 5) 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. Analyse de différents rapports. Etude de différentes démarches e-marketing sur Internet. Utiliser les landing pages. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 87

88 Stage pratique de 2 jour(s) Réf : LYT Commerciaux et responsables marketing, ou toute personne concernée par la promotion d'un site Web. Connaissances de base des sites Web. Prix 2016 : 1400 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 3 mar. 2016, 9 juin sep. 2016, 9 nov Google Analytics, analyser les statistiques de vos sites OBJECTIFS 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. 1) Rappel des fondamentaux du web 2) La terminologie essentielle 3) L'outil Google Analytics 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. Réflexion autour de différents acteurs du Web. 2) La terminologie essentielle 4) Savoir lire et exploiter les différents rapports 5) Exploiter Google Analytics par rapport à ses besoins - 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. 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. 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. Exercice d'exploitation des données Google Analytics. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 88

89 Stage pratique de 2 jour(s) Réf : ITF Développeurs de sites Web, Web designers, acteurs du marketing ou de l'informatique. Design d'un site Web, comment faire un site attractif et efficace OBJECTIFS 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. Aucune connaissance particulière. Prix 2016 : 1410 HT Dates des sessions 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 8) Suivi de projet Web Paris 14 mar. 2016, 19 mai juil. 2016, 8&15 sep nov Aix 11 fév. 2016, 30 juin sep. 2016, 1 déc Bordeaux 4 fév. 2016, 23 juin oct. 2016, 8 déc Grenoble 11 fév. 2016, 30 juin sep. 2016, 1 déc Lille 11 fév. 2016, 30 juin sep. 2016, 1 déc Lyon 11 fév. 2016, 30 juin sep. 2016, 1 déc Montpellier 4 fév. 2016, 23 juin oct. 2016, 8 déc Nantes 4 fév. 2016, 23 juin oct. 2016, 8 déc Rennes 4 fév. 2016, 23 juin oct. 2016, 8 déc Sophia-antipolis 11 fév. 2016, 30 juin sep. 2016, 1 déc Strasbourg 11 fév. 2016, 30 juin sep. 2016, 1 déc Toulouse 4 fév. 2016, 23 juin oct. 2016, 8 déc ) Positionnement du site Web - 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? Positionner un site exemple. 2) Règles de conception et usabilité - 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 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. Création d'une page valide et accessible. Correction des erreurs d'accessibilité. Tests sur les sites existants. 4) Décliner sa marque au site Web - Lier le design Web, la stratégie et la communication. - Valoriser une marque. Brief et stratégie créative. Charte graphique. Définir une charte graphique et utiliser un outil de maquettage fonctionnel. 5) Conception et gestion de contenu - 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. Utiliser un logiciel de publication Web et découvrir des sites légaux. 6) Techniques d'animation - 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. Découvrir les techniques d'animation de différents sites. 7) Analyse de trafic - Suivi et analyse de trafic. Analyse de référencement et positionnement. Techniques pour accroître le trafic. Création, analyse et positionnement de référencement. Analyse statistique et approches des SEO. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 89

90 8) Suivi de projet Web - Audit juridique du site : les risques. Conduite de projet : maquettage, développement... ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 90

91 Stage pratique de 3 jour(s) Réf : TOX Graphistes, intégrateurs débutants ou toute personne désirant s'initier à l'intégration Web. Bonne pratique de l'internet. Connaissances de base en HTML. Notions de design et connaissances de base de l'interface de Photoshop. Prix 2016 : 1920 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 11 avr. 2016, 27 juin sep. 2016, 14 nov Créer un site Web, de la maquette Photoshop à l'intégration HTML/CSS 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. OBJECTIFS PEDAGOGIQUES 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 Méthodes pédagogiques 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 91

92 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 92

93 Stage pratique de 2 jour(s) Réf : RPO Webmaster, designer, chef de projet et développeur. Connaissances de base en HTML et CSS. Prix 2016 : 1410 HT Dates des sessions Paris 11 fév. 2016, 21 avr juin 2016, 8&15 sep nov Aix 24 mar. 2016, 16 juin sep. 2016, 15 déc Bordeaux 17 mar. 2016, 9 juin sep. 2016, 8 déc Bruxelles 11 fév. 2016, 26 mai 2016 Geneve 11 fév. 2016, 26 mai 2016 Grenoble 24 mar. 2016, 16 juin sep. 2016, 15 déc Lille 24 mar. 2016, 16 juin sep. 2016, 15 déc Luxembourg 11 fév. 2016, 26 mai 2016 Lyon 24 mar. 2016, 16 juin sep. 2016, 15 déc Montpellier 17 mar. 2016, 9 juin sep. 2016, 8 déc Nantes 17 mar. 2016, 9 juin sep. 2016, 8 déc Rennes 17 mar. 2016, 9 juin sep. 2016, 8 déc Sophia-antipolis 24 mar. 2016, 16 juin sep. 2016, 15 déc Strasbourg 24 mar. 2016, 16 juin sep. 2016, 15 déc Toulouse 17 mar. 2016, 9 juin sep. 2016, 8 déc Responsive Web Design, créer des interfaces Web adaptables Best OBJECTIFS 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. 1) Les terminaux 2) Démarche de conception 3) MediaQueries 4) Principe de grille flexible, fluide 1) Les terminaux 5) Composants graphiques 6) Framework et librairies responsive 7) Optimisation et performance - 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...). Détection du type de terminal en PHP JavaScript. 2) Démarche de conception - 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. 3) MediaQueries - 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). Construction de CSS selon les modes portrait/paysage, résolution du terminal. 4) Principe de grille flexible, fluide - 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. Construire une ergonomie basée sur une grille flexible. 5) Composants graphiques - 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. Mise en oeuvre de solutions. 6) Framework et librairies responsive - Détecter les ressources avec "Modernizr". - Librairies de substitution (less, css3pie...). - Frameworks CSS 960 grid, HTML5 BoilerPlate, Bootstrap, Foundation, Skeleton, Utilisation de frameworks. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 93

94 7) Optimisation et performance - Mesurer la performance de chargement, optimisation de bande passante. Répartition Client/Serveur. - Optimisation des ressources graphiques. - Gestion du cache. Audit de pages Web, corrections conceptuelles et techniques. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 94

95 Stage pratique de 3 jour(s) Réf : CSN Ce stage pratique s'adresse à tous les concepteurs de newsletters. Connaissances de base de 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. 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é. 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. 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). Préparation du dossier contenant tous les éléments constitutifs de la newsletter jusqu'à l'envoi sur le serveur distant en ftp. Tests. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 95

96 Stage pratique de 3 jour(s) Réf : PHO 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... Aucune connaissance particulière. Prix 2016 : 1200 HT Dates des sessions Paris 25 jan. 2016, 15 fév mar. 2016, 4 avr mai 2016, 6 juin juil. 2016, 22 aoû sep. 2016, 17 oct nov. 2016, 12 déc Aix 29 mar. 2016, 27 juin oct. 2016, 5 déc Bordeaux 21 mar. 2016, 20 juin oct. 2016, 5 déc Bruxelles 15 fév. 2016, 9 mai 2016 Geneve 15 fév. 2016, 9 mai 2016 Grenoble 29 mar. 2016, 27 juin oct. 2016, 5 déc Lille 29 mar. 2016, 27 juin oct. 2016, 5 déc Luxembourg 15 fév. 2016, 9 mai 2016 Lyon 29 mar. 2016, 27 juin oct. 2016, 5 déc Montpellier 21 mar. 2016, 20 juin oct. 2016, 5 déc Nantes 21 mar. 2016, 20 juin oct. 2016, 5 déc Rennes 21 mar. 2016, 20 juin oct. 2016, 5 déc Sophia-antipolis 29 mar. 2016, 27 juin oct. 2016, 5 déc Strasbourg 29 mar. 2016, 27 juin oct. 2016, 5 déc Toulouse 21 mar. 2016, 20 juin oct. 2016, 5 déc Photoshop CC/CS6, prise en main Best OBJECTIFS 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. 1) Introduction 2) Les couleurs et les images pour le Web 3) Les corrections chromatiques 4) Les filtres et leurs effets 1) Introduction 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 - 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 - 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. Correction de photos. 4) Les filtres et leurs effets - Présentation des catégories de filtres. - Description détaillée des principaux filtres. Redéfinir l'aspect d'une façade. 5) Les sélections et les masques - 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". Créer un effet loupe. 6) Gestion des calques - 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. Créer une carte de vœux. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 96

97 - Contenu manquant. Échelle basée sur le contenu. 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. Créer un GIF animé. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 97

98 Stage pratique de 2 jour(s) Réf : EGO Toute personne dans le domaine de l'informatique concernée directement ou indirectement par la qualité des interfaces Homme- Machine. Connaissances de base sur les systèmes d'exploitation mobiles et les interfaces d'un point de vue utilisateur. Prix 2016 : 1410 HT Dates des sessions Paris 21 jan. 2016, 3 mar juin 2016, 1 sep nov 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 1) Introduction : qu'est-ce que l'ergonomie? - 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 4) Maquetter une interface mobile 5) L'analyse heuristique des IHM mobiles - 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 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é. 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. Audit d'interfaces mobiles. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 98

99 Stage pratique de 4 jour(s) Réf : MOB Développeurs et chefs de projets mobilité. Bonnes connaissances du Web, d'html de CSS. Connaissances de base du JavaScript et du XML. Prix 2016 : 2390 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 9 fév. 2016, 8 mar avr. 2016, 10 mai juin 2016, 5 juil &27 sep. 2016, 11 oct nov. 2016, 13 déc Aix 22 mar. 2016, 14 juin sep. 2016, 22 nov Bordeaux 29 mar. 2016, 28 juin oct. 2016, 6 déc Grenoble 22 mar. 2016, 14 juin sep. 2016, 22 nov Lille 22 mar. 2016, 14 juin sep. 2016, 22 nov Lyon 22 mar. 2016, 14 juin sep. 2016, 22 nov Montpellier 29 mar. 2016, 28 juin oct. 2016, 6 déc Nantes 29 mar. 2016, 28 juin oct. 2016, 6 déc Rennes 29 mar. 2016, 28 juin oct. 2016, 6 déc Sophia-antipolis 22 mar. 2016, 14 juin sep. 2016, 22 nov Strasbourg 22 mar. 2016, 14 juin sep. 2016, 22 nov Toulouse 29 mar. 2016, 28 juin oct. 2016, 6 déc 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 Phone. OBJECTIFS PEDAGOGIQUES Comprendre le processus de publication d'une application mobile Identifier les spécificités d'une application mobile Découvrir les solutions de développement mobile Construire une application mobile complète 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 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. 1) Rappels sur les technologies de base - Présentation des familles de terminaux smarttouchet tablets, 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. Mise en place d'un environnement de travail dédié au mobile. 2) Solutions embarquées - Présentation des technologies existantes et leurs environnements de développement : limite, coût, portabilité. - Objective-C (iphone, ipad), Java (Android),.Net (Windows Phone), Tizen, Firefox OS. - Méthode de publication d'une application dans les catalogues officiels des opérateurs (Applestore, GooglePlay, Ovi...). - 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 et moteurs iwebkit (boutons, effets, transformations...). JavaScript. Rappels sur le langage. - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 99

100 - Bibliothèque graphique : API de dessin (rectangle, ligne...), palette de couleur, manipulation des images. - Tests de conformité au W3C : outils de validation. 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. - Flat Design, Material Design (Materializecss, Ionic). 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). 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. Affichage de la carte par rapport à la localisation du mobile et affichage de markers sur la carte. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 100

101 Stage pratique de 3 jour(s) Réf : OVA Chefs de projet, développeurs Web et mobiles. Bonnes connaissances du développement Web (HTML / CSS et JavaScript). Des connaissances de base de Visual Studio et de NodeJS peuvent être un plus. Prix 2016 : 1920 HT Dates des sessions Cordova, développer des applications mobiles multiplateformes Nouveau Le développement d'applications mobiles est devenu un enjeu majeur, mais viser les principales plateformes (ios, Windows Phone 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. OBJECTIFS PEDAGOGIQUES 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 Paris 4 avr. 2016, 6 juin sep ) 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 mobile 5) Interagir avec le device 6) Pour aller plus loin 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). - Création d'une première application en ligne de commande (CLI). - Analyse de la structure d'une application. - Génération de l'application Windows Phone / Windows 8. - Génération de l'application Android. - Génération de l'application ios. 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 seconde application avec Visual Studio. - Génération de l'application Windows Phone ou Android. - Déploiement et debug de l'application sur Device ou Emulateur. 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 mobile - Création d'une application Web. - Modification de l'application Web pour la rendre utilisable sur mobile (responsive design, gestion du touch...). - Analyse des impacts d'une migration de l'application Web vers une application mobile avec Cordova. - Migration de l'application Web vers une application mobile avec Cordova. - Déploiement sur Device ou Emulateur. 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 Cordova. Fonctionnement. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 101

102 - Utilisation d'un plug-in Core de Cordova pour accéder à la caméra. - Utilisation d'un plug-in public pour lire des cartes NFC. - Déploiement sur plusieurs plateformes. - Développement d'un plug-in. Utilisation de plug-ins. Création d'un plug-in. 6) Pour aller plus loin - Utilisation du dossier Merge. - Publier son application sur les stores. - Quid des performances? - Utiliser AngularJS pour structurer son application Web. - TypeScript. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 102

103 Stage pratique de 3 jour(s) Réf : AMB Développeurs web, infographistes et web designers. Bonnes connaissances HTML, CSS et JavaScript. Prix 2016 : 1840 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 29 fév. 2016, 23 mai aoû. 2016, 24 oct déc 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. OBJECTIFS PEDAGOGIQUES 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 1) Environnement de test 2) Optimisation de l'application 3) Design et device 4) Responsive design Méthodes pédagogiques 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 ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 103

104 - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 104

105 Stage pratique de 3 jour(s) Réf : PHG Développeurs. Chefs de projets. 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. Prix 2016 : 1840 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 7 mar. 2016, 6 juin sep. 2016, 6 déc 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 Tous les développements seront testés sur Smartphone mis à la disposition des participants. Les environnements Android et IOS seront utilisés. 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. 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. 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). 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. Prise en main de PhoneGap. Création d'un projet. 6) Utilisation de PhoneGap ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 105

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. Mise en œuvre de certaines spécificités de la plateforme mobile dans l'application développée. Création d'un plugin PhoneGap. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 106

107 Stage pratique de 3 jour(s) Réf : UER Développeurs, chefs de projets mobilité, webmasters, designers. Connaissances de base du HTML et du JavaScript. Prix 2016 : 1840 HT Dates des sessions Paris 4 avr. 2016, 27 juin sep. 2016, 14 nov 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é. OBJECTIFS PEDAGOGIQUES 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. 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. 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. 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 107

108 - Envoi du formulaire et contrôle du formulaire. 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. Gestion des multiples événements et solutions de stockage. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 108

109 Stage pratique de 3 jour(s) Réf : SEU Développeurs et chefs de projets. Bonnes connaissances 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. OBJECTIFS PEDAGOGIQUES 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 1) Présentation du framework 2) Concepts fondamentaux 3) Le modèle MVC 4) Gestion des données 5) Composants graphiques orientés données 6) Thèmes 7) Utilisation des API natives 1) Présentation du framework - 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. 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. 2) Concepts fondamentaux - 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. 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. Définition et utilisation d'un Contrôleur. Envoi d'événements personnalisés. 4) Gestion des données - L'ensemble des données : Models, Proxies, Stores. - Envoi et réception de données : requêtes et réponses HTTP, Ajax/JsonP. Gérer les données. 5) Composants graphiques orientés 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 109

110 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... Utilisation de l'api Device. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 110

111 Stage pratique de 3 jour(s) Réf : EDG Webmasters, graphistes, maquettistes ou toute personne en charge de la communication de sites Internet. Une pratique courante d'un logiciel de dessin vectoriel ou bitmap (InDesign, Photoshop, Illustrator) est un plus pour suivre cette formation. Prix 2016 : 1920 HT Edge Animate, créer des animations interactives pour le Web Nouveau 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. OBJECTIFS PEDAGOGIQUES 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 Dates des sessions Paris 11 avr. 2016, 13 juin sep ) 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 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. 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 111

112 Réaliser une animation. 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. Exporter son projet. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 112

113 Stage pratique de 5 jour(s) Réf : APJ Développeurs, architectes, chefs de projets. Bonnes connaissances en Java ainsi que des bases du Web : HTTP, HTML, CSS, JavaScript. Les bases de la programmation JEE (ex : Servlet / JSP) seront un plus. Prix 2016 : 2560 HT Dates des sessions Paris 8 fév. 2016, 7 mar avr. 2016, 9 mai juin 2016, 4 juil aoû. 2016, 26 sep oct. 2016, 21 nov déc 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. OBJECTIFS PEDAGOGIQUES 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 Méthodes pédagogiques 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. 1) Introduction - 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. 2) Environnement de travail - Environnement Eclipse. Dépendances Maven. - Tests unitaires avec le conteneur embarqué. - Utilisation des webtools, prise en main du serveur. 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. 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, JTA 1.2. 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. Mise en place de services avec les EJB Sessions et d'un bus d'échange de messages avec JMS. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 113

114 6) Web et JSF - Concepts (MVP, Presenter, View). - Facelets, taglibs, jsf-el. - Validation JSR Mise en oeuvre d'ajax. 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. 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. Ajout d'une connexion websocket au client web. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 114

115 Stage pratique de 5 jour(s) Réf : APP Informaticiens souhaitant développer des applications Web avec les technologies Java/JEE. Bonnes connaissances du 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 Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 8 fév. 2016, 9 mai juil. 2016, 24 oct déc Java, développement de Servlets et JSP pour JEE 6 OBJECTIFS Ce cours vous apprendra développer des applications Web d'entreprise basées sur la plateforme Java/JEE6. Vous verrez comment mettre en oeuvre des solutions robustes et facilement extensibles, notamment au moyen des architectures MVC et de l'environnement JSF. 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 5) Accès aux bases de données 6) JSF 2 7) Sécurisation des applications Web 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 JEE. 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. 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. 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. Développement de servlets. 5) Accès aux bases de données - 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. 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. - Mise en œuvre des Managed Beans. Définir la navigation entre pages. Convertir et valider des données. Adapter l'application à JSF 2. 7) Sécurisation des applications Web ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 115

116 - 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. Sécuriser l'accès à l'application. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 116

117 Stage pratique de 3 jour(s) Réf : JSF Développeurs et chefs de projet ayant à réaliser le développement d'applications n-tiers sur Java EE. Connaissance du langage Java et du développement Web. La connaissance de la plate-forme Java EE est un plus, mais non indispensable. Prix 2016 : 1920 HT Dates des sessions Paris 7 mar. 2016, 30 mai sep. 2016, 7 nov Framework JSF 2, développer des applications Web OBJECTIFS 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. 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 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. 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. 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. 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. Faire coopérer des backing beans. 6) Compléments - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 117

118 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>. Définition d'une nouvelle classe de composant. Usage de composants Ajax dans JSF. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 118

119 Stage pratique de 3 jour(s) Réf : GWT Ce cours s'adresse aux développeurs et chefs de projets désireux de découvrir un framework permettant d'améliorer l'ergonomie des applications Web, mais aussi d'en simplifier le développement. Bonnes connaissances des langages Java et JavaScript. Expérience souhaitable en programmation Java/Web. Prix 2016 : 1920 HT Dates des sessions Paris 8 fév. 2016, 2 mai sep. 2016, 21 nov Aix 22 fév. 2016, 2 mai sep. 2016, 12 déc Bordeaux 15 fév. 2016, 2 mai sep. 2016, 12 déc Grenoble 22 fév. 2016, 2 mai sep. 2016, 12 déc Lille 22 fév. 2016, 2 mai sep. 2016, 12 déc Lyon 22 fév. 2016, 2 mai sep. 2016, 12 déc Montpellier 15 fév. 2016, 2 mai sep. 2016, 12 déc Nantes 15 fév. 2016, 2 mai sep. 2016, 12 déc Rennes 15 fév. 2016, 2 mai sep. 2016, 12 déc Sophia-antipolis 22 fév. 2016, 2 mai sep. 2016, 12 déc Strasbourg 22 fév. 2016, 2 mai sep. 2016, 12 déc Toulouse 15 fév. 2016, 2 mai sep. 2016, 12 déc Développer une application Web 2.0/GWT le Google Web Toolkit Best 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. OBJECTIFS PEDAGOGIQUES 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 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. 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. Conception d'écrans avec composants GWT. CSS personnalisés. 5) Concepts GWT avancés 6) Implémenter une politique de tests 7) Considérations architecturales 8) L'écosystème GWT 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 119

120 - Analyse des performances avec Speed Tracer. - Paramétrage du compilateur GWT. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 120

121 Stage pratique de 5 jour(s) Réf : JAD Informaticiens souhaitant développer des applications Web en utilisant conjointement JSF 2.O et Dojo. Bonnes connaissances du langage Java et du développement Web en Java. Expérience requise en programmation Java. Connaissance des langages XML et HTML. Prix 2016 : 2560 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 21 mar. 2016, 13 juin sep. 2016, 21 nov 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) 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 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 - 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. 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. 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. Mise en oeuvre de quelques composants JSF au sein d'une application. 6) La gestion des événements en JSF Le modèle d'événements de JSF. - Fonctionnement des événements JSF. - Ecrire ses propres listeners. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 121

122 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. Mise en oeuvre de l'une des approches présentées. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 122

123 Stage pratique de 5 jour(s) Réf : NEA Développeurs ASP.NET. Bonnes connaissances de la programmation Web en.net ou connaissances équivalentes à celles apportées par le stage "ASP.NET 4.5, niveau 1" (réf. AST). Expérience requise. Prix 2016 : 2560 HT Dates des sessions Paris 21 mar. 2016, 20 juin oct. 2016, 12 déc ASP.NET 4.5, niveau 2, développement Web 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ées (Entity Framework, objets métier...). OBJECTIFS PEDAGOGIQUES Entrez ici un objectif pédagogique 1) Architecture des applications ASP.NET 2) Accès aux données avancés 3) Contrôles personnalisés 4) Sécurité et authentification 5) Services Web 6) Ajax 7) Compléments 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és - Object DataSource comme adaptateur d'accès aux DAL propriétaires. - Entity Framework 6 : edmx, code first, héritage TPH et TPT, code migration, model binding et EntityDataSource. - TableAdapters et dataset typés. Contrôles basés sur des templates. 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 utilisateurs distribuables et composites. - Intégration au designer. 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. 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. É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. Utilisation de services JSON. UpdatePanels pour optimiser un service de discussion en ligne. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 123

124 7) Compléments - Internationalisation. APIs 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 & minification, unobtrusive validation, données liées typées, validation par la décoration. À la demande, en fonction des centres d'intérêt du groupe. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 124

125 Stage pratique de 5 jour(s) Réf : SLV Ce cours s'adresse aux 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. Bonnes connaissances du 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 1) Introduction 3) Composants de l'application Silverlight 4) Manipulations de données - 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. 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. 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). 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. Création d'une interface d'édition d'une collection d'objets métiers. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 125

126 Stage pratique de 4 jour(s) Réf : ASA 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 Bonnes connaissances de C#, HTML et JavaScript. Expérience requise en développement logiciel. Prix 2016 : 2390 HT Dates des sessions Paris 9 fév. 2016, 9 mai juil. 2016, 6 sep déc Aix 31 mai 2016, 13 sep déc Bordeaux 16 fév. 2016, 24 mai sep. 2016, 6 déc Grenoble 31 mai 2016, 13 sep déc Lille 31 mai 2016, 13 sep déc Lyon 31 mai 2016, 13 sep déc Montpellier 16 fév. 2016, 24 mai sep. 2016, 6 déc Nantes 16 fév. 2016, 24 mai sep. 2016, 6 déc Rennes 16 fév. 2016, 24 mai sep. 2016, 6 déc Sophia-antipolis 31 mai 2016, 13 sep déc Strasbourg 31 mai 2016, 13 sep déc Toulouse 16 fév. 2016, 24 mai sep. 2016, 6 déc ASP.NET MVC 5, développement d'applications Web 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 2013 et One ASP.NET. 1) Introduction 2) Le modèle et les contrôleurs 3) Les vues 4) Routage des URL 1) Introduction - Synthèse des technologies Web du framework.net. - Présentation du modèle MVC5. - Projets.NET MVC5 dans VS2013. Création d'une application MVC5. 2) Le modèle et les contrôleurs - 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. Développement de modèles MVC4. Création de contrôleurs MVC5. 3) Les vues - Moteur de vues Razor. Contenu dynamique. - Modèles de vues. Application des styles CSS. Créations de Vues MVC5, utilisation de Bootstrap dans MVC5. 4) Routage des URL - Pattern URL. Conception du routage. - Personnalisation du Routage, les attributs de Routage dans MVC5. Scénarios de routages et structures de navigation MVC5. 5) Ajax et jquery - Ajax Helper et jquery/jqueryui. - Mises à jour partielles. Gestion du cache. - Autres techniques d'optimisation client. Création de pages JavaScript et Ajax MVC5. 6) Validation et sécurité 5) Ajax et jquery 6) Validation et sécurité 7) API Web et déploiement - 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. Mise en œuvre de la sécurité dans une application MVC 5. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 126

127 Gestion du déploiement des applications. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 127

128 Stage pratique de 3 jour(s) Réf : PYM Développeurs PHP et chefs de projets. Bonnes connaissances de PHP. Connaissances de base de la Programmation Orientée Objet. Prix 2016 : 1840 HT Dates des sessions Paris 29 mar. 2016, 27 juin sep. 2016, 28 nov PHP 5, développement Web avec Symfony 2 Best OBJECTIFS Vous apprendrez dans ce cours à développer des applications Web PHP avec le framework Symfony 2. Vous verrez entre autres comment installer le 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. 1) Présentation du framework Symfony 2 2) Démarrer avec le framework Symfony 2 3) La "couche contrôleur" et la gestion des URL 4) La "couche vue" et le moteur de template Twig 1) Présentation du framework Symfony 2 - Rappels de programmation orientée objet. - Présentation globale de Symfony 2. - Concepts principaux, architecture MVC. - Installation de Symfony 2. - Architecture du projet : application, bundles... - Traitement d'une requête HTTP avec Symfony 2. Démonstration Exemples avec Symfony 2. 2) Démarrer avec le framework Symfony 2 5) La couche Modèle 6) Les formulaires et leur validation 7) Aller plus loin avec le framework Symfony 2 - Configuration de l'application et surcharge. - Outils de ligne de commande. - Outils de débogage du code : Web Debug Toolbar... - Autoloading des classes. 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 Mécanisme du routage et gestion des URL. - Injection de Dépendance et conteneurs de service. 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. 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 128

129 - Sécurité renforcée avec les tokens (SCRF). - Validation des formulaires. Création de formulaires. Ajout de pages à l'application fil rouge. Mise en place de la validation. 7) Aller plus loin avec le framework Symfony 2 - Sécurité, contrôle d'accès et authentification. - Tests automatisés avec PHPUnit. - Solution d' . - Services Web (SOAP et Rest). - Ajouter de nouvelles macros, fonctions à Twig. Mise en œuvre et tests. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 129

130 Stage pratique de 4 jour(s) Réf : FAR Développeurs et architectes. Connaissances de base des concepts objet. Bonnes connaissances de PHP5 et du HTML. Prix 2016 : 2390 HT Dates des sessions Paris 26 jan. 2016, 22 mar mai 2016, 6 sep nov Zend Framework 2, maîtrise du développement Web OBJECTIFS 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. 1) Introduction 2) Programmation orientée objet 3) Installation de Zend Framework 2 4) Utilisation du framework 1) Introduction - Définition d'un framework et de son intérêt. - Présentation générale du Zend Framework 2. - Changements par rapport à Zend Framework 1. 2) Programmation orientée objet 5) Accès aux bases de données 6) Les formulaires 7) Bonnes pratiques avec Zend Framework 2 8) Autres composants - 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. Conception d'un modèle Objet. 3) Installation de Zend Framework 2 - Utilisation d'un composant dans un projet existant. - Création d'un projet, installation via ZFTool, utilisation de Composer, configuration d'un IDE. - Architecture MVC. Squelette d'application. Création d'un projet. 4) 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. Développement d'un CMS sous ZF2. 5) Accès aux bases de données - Les bases de données simplifiées avec Zend\Db. - L'ORM Doctrine et le module Doctrine Module. Manipulation de données via l'orm Doctrine. 6) Les formulaires - Zend\Form : gestion des formulaires. - Filtrage et validation : Zend\Filter, Zend\Validate, Zend\InputFilter. - Conversions objets/tableaux avec les Hydrateurs. 7) Bonnes pratiques avec Zend Framework 2 - Injection de dépendances : Zend\Di et Zend\ServiceManager. - Ecriture de tests unitaires avec PHPUnit. - Création de modules, utilisation de modules Zend Framework 2 populaires : ZfcUser, ZendDeveloperTools, BjyProfiler... - Débogage et profilage avec XDebug. 8) Autres composants - Les Web Services avec Zend\Soap, Zend\XmlRpc, Zend\Mvc\Controller\AbstractRestfulController. - Authentification et gestion des droits. - Mails, Logs, Session, Config. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 130

131 - Internationalisation avec Zend\ I18n. - Zend\EventManager. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 131

132 Stage pratique de 5 jour(s) Réf : NEC Développeurs. Bonnes connaissances en programmation. Connaissances de base des concepts Objet. Expérience requise en développement logiciel avec un langage de type C/C++ ou Java. Prix 2016 : 2710 HT Programmation en C# (70-483) préparation à l'examen Nouveau 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. Ce stage couvre tous les sujets nécessaires pour préparer l'examen Microsoft OBJECTIFS PEDAGOGIQUES Comprendre l'architecture.net Framework avec C# Apprendre la programmation orientée objet (POO) avec C# Acquérir les connaissances nécessaire pour exploiter des données avec LINQ Dates des sessions Paris 15 fév. 2016, 11 avr juin 2016, 12 sep déc ) 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 1) La syntaxe du langage C# 5) Données distantes et interface utilisateur 6) Performances des applications 7) Code non managé et types réutilisables - L'architecture.NET Framework. - Présentation du langage C#. - Les types de données, les opérateurs et les expressions. - Les structures de programmation. 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. 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. 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 pas les flux. - Création et utilisation d'un modèle de données Entité. - Interrogation de données par LINQ. 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. Accéder à des données à distance. Personnaliser l'apparence d'une interface utilisateur. 6) Performances des applications ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 132

133 - Comment améliorer les performances d'une application. - Le multitâche en utilisant tâches et expressions Lambda. - Les opérations asynchrones. Exemple d'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. Créer des objets dynamiques. Créer des attributs personnalisés. Exemple de cryptage et décryptage. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 133

134 Stage pratique de 5 jour(s) Réf : JSC Développeurs Web. Connaissances de base de HTML et CSS. Prix 2016 : 2710 HT Dates des sessions Paris 22 fév. 2016, 18 avr juin 2016, 19 sep déc Programmation en HTML5 avec JavaScript et CSS3 (70-480) préparation à l'examen Nouveau Ce cours vous apprendra à développer des sites et des applications Web avec HTML5 et CSS3. Vous verrez également comment rendre vos sites plus dynamiques et les enrichir avec multimédia comme les vidéos et l'audio grâce à l'html5. Ce stage couvre tous les sujets nécessaires pour préparer l'examen Microsoft OBJECTIFS PEDAGOGIQUES Apprendre à développer des sites et des applications Web avec HTML5 et CSS3 Comment 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 1) La structure du langage - Le langage HTML et le CSS. - 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. - Comment insérer un script dans un document HTML/XHTML. Créer et mettre en forme 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. Créer un formulaire avec la validation des entrées d'utilisateur à l'aide des attributs de 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. Appliquer des styles avec CSS3. 4) Le langage JavaScript - Les éléments de base (syntaxe, variables,...). - Les fonctions. Les objets personnalisés. - Les objets globaux (Array, Date,...). - Les tableaux. Exemple d'utilisation du JavaScript. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 134

135 Insérer de la vidéo en utilisant les API. 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. 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. - La transmission des données. - La sérialisation. Le XMLHTTPRequest. - Les WebSocket. Les échanges entre le client et le serveur. - L'API Socket Web et JavaScript. Exemple de transmission de données. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 135

136 Stage pratique de 5 jour(s) Réf : AWA Développeurs web. Bonne expérience en développement d'applications ASP.Net. Prix 2016 : 2710 HT Dates des sessions Paris 8 fév. 2016, 4 avr juin 2016, 5 sep déc Développement d'applications Web ASP.NET MVC (70-486) préparation à l'examen Nouveau 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 OBJECTIFS PEDAGOGIQUES 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) Planification et conception d'applications ASP.NET MVC 4 2) Les modelés, les contrôleurs et les 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 1) Planification et conception d'applications ASP.NET MVC 4 - 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. Planification des vues et conception d'une Application MVC. 2) Les modelés, les contrôleurs et les 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. 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. Exécuter des tests unitaires. Exemples de gestion des exceptions. 4) Structurer une application et appliquer des styles - L'importance de structurer une application. - 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. - Interface utilisateur adaptative Appliquer une apparence cohérente à une Application MVC. 5) Pages réactives et JavaScript - Utiliser AJAX. - Mises à jour de pages partielles. - La mise en cache pour réduire la bande passante réseau. - Implémenter le code JavaScript. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 136

137 - La bibliothèque jquery et jqueryui. 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. 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. 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 4. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 137

138 Stage pratique de 5 jour(s) Réf : APW Développeurs. Connaissances de base de Visual Studio 2010 ou 2012, du langage C# et de.net Framework 4.5. Prix 2016 : 2710 HT Dates des sessions Paris 21 mar. 2016, 23 mai juil. 2016, 17 oct déc Les fondamentaux du développement d'applications Windows Store en utilisant C# (70-484) préparation à l'examen Nouveau 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 OBJECTIFS PEDAGOGIQUES 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 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 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. 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 Qu'est-ce les contrôles intégrés de Windows Les contrôles WinRT et AppBar. - Les modes de fenêtrage Réaliser une mise en page en utilisant les contrôles intégrés dans Windows ) La gestion des fichiers et des processus - 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. 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. 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. 6) Les contrats Windows Les concepts des charmes et des contrats. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 138

139 - Le contrat de recherche et le contrôle "SearchBox". - Le contrat de partage. - Les paramètres des applications. Implémenter un contrat de recherche. Exemple d'utilisation du contrôle SearchBox. 7) Accès aux données et déploiement - 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. Exemple de mise en œuvre d'événements de la souris et de mouvement. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 139

140 Stage pratique de 5 jour(s) Réf : AAV Développeurs d'applications. Bonnes connaissances en programmation C#. Avoir une expérience sur Visual Studio 2013 et avoir déjà travaillé sur des applications Windows Store. Prix 2016 : 2710 HT Dates des sessions Paris 14 mar. 2016, 16 mai juil. 2016, 10 oct déc Développement d'applications avancées Windows Store en utilisant C# (70-485) préparation à l'examen Nouveau 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 OBJECTIFS PEDAGOGIQUES 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,...) 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 1) Introduction aux applications Windows Store - Architecture et fonctionnalités de la plateforme. - Processus de création d'interfaces utilisateur avec XAML. - Le nouveau modèle de l'api WinRT. 2) Animations et globalisation - 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. Créer des animations et des transitions. Créer des fichiers de ressources pour la localisation. 3) Stratégie de marque et interface utilisateur - Stratégie de marque pour votre application. - L'écran de démarrage personnalisé. - L'interface et l'expérience utilisateur. Créer un écran de démarrage pour une application Windows Store. 4) Stockage de données avancé - Bien utiliser le stockage de fichier. - Utiliser la mise en cache. - Extensions de fichier et associations à une application. - Compression des fichiers. Exemple de mise en cache de donnée. 5) Composants et contrôles réutilisables - Savoir personnaliser les contrôles. - Créer des nouveaux composants. - Réutiliser les composants. Création d'un contrôle personnalisé. 6) Scénarios de contrat avancés et WSN - Les contrats de lecture et d'impression. - Les contacts et les calendriers. - Fichiers PDF et des captures d'écran. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 140

141 - Le service de notifications Windows Push (WNS). - La communication avec le service WSN. Exemple d'ajout du support PDF. 7) Capteurs et périphériques - 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. 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. Exemple de cryptage d'une application Windows Store. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 141

142 Stage pratique de 5 jour(s) Réf : AWH Développeurs d'applications. Connaissance de base du langage HTML 5, CSS 3 et du langage JavaScript. Expérience requise en développement Web avec Visual Studio 2010 ou Prix 2016 : 2710 HT Dates des sessions Paris 8 fév. 2016, 4 avr juin 2016, 5 sep déc Les fondamentaux du développement d'applications Windows Store en utilisant HTML5 et JavaScript (70-481) préparation à l'examen Nouveau 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 OBJECTIFS PEDAGOGIQUES 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 Entrez ici un objectif pédagogique 1) La plate-forme de développement 2) Conception d'applications 3) La mise en page 4) Les notifications utilisateurs 5) La gestion des fichiers et des processus 6) La navigation dans les applications 7) Les contrats Windows 8.1 8) Accès aux données et déploiement 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) 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. 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. 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 "tiles", les "live tiles". - Les "tiles" secondaires et les notifications de "tiles". - Qu'est-ce que les notifications "toast". Exemple de mise en place les notifications utilisateurs. 5) La gestion des fichiers et des processus - 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. Exemple de cycle de vie d'une application. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 142

143 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". Mettre en œuvre la "Semantic Zoom". 7) Les contrats Windows Les concepts des charmes et des contrats. - Le contrat de recherche et de partage. - Les paramètres des applications. Implémenter un contrat de recherche. 8) Accès aux données et déploiement - 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. Exemple de mise en œuvre d'événements de la souris et de mouvement. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 143

144 Stage pratique de 5 jour(s) Réf : AAW Développeurs d'applications. Bonnes connaissances de la programmation HTML5, du langage JavaScript, de l'utilisation Visual Studio 2013 et avoir déjà travaillé sur des applications Windows Store. Prix 2016 : 2710 HT Dates des sessions Développement d'applications avancées Windows Store en utilisant HTML5 et JavaScript (70-482) préparation à l'examen Nouveau 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 OBJECTIFS PEDAGOGIQUES 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 Paris 21 mar. 2016, 23 mai juil. 2016, 17 oct déc ) 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 1) Introduction aux applications Windows Store - Architecture et fonctionnalités de la plateforme. - Processus de création d'interfaces utilisateur avec HTML. - Le nouveau modèle de l'api WinRT. 2) Animations et globalisation - 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. Créer des animations et des transitions. Créer des fichiers de ressources pour la localisation. 3) Stratégie de marque et interface utilisateur - Stratégie de marque pour votre application. - L'écran de démarrage personnalisé. - L'interface et l'expérience utilisateur. Créer un écran de démarrage pour une application Windows Store. 4) Stockage de données avancé - Bien utiliser le stockage de fichier. - Utiliser la mise en cache. - Extensions de fichier et associations à une application. - Compression des fichiers. Exemple de mise en cache de donnée. 5) Composants et contrôles réutilisables - Savoir personnaliser les contrôles. - Créer des nouveaux composants. - Réutiliser les composants. Création d'un contrôle personnalisé. 6) Scénarios de contrat avancés et WSN - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 144

145 Exemple d'ajout du support PDF. 7) Capteurs et périphériques - 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. 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. Exemple de cryptage d'une application Windows Store. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 145

146 Stage pratique de 4 jour(s) Réf : DJA La formation est destinée aux développeurs souhaitant acquérir une connaissance approfondie des bases du framework Django. Connaissances des bases du langage Python et technologies Web (HTML, JavaScript...) Prix 2016 : 2390 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 15 mar. 2016, 24 mai juil. 2016, 27 sep nov 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 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. 4) Les templates 5) Gestion des formulaires 6) Fonctions avancées 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 146

147 - L'interface d'administration. - Les tests unitaires. Exercice Intégrer Ajax à travers le framework JQuery. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 147

148 Stage pratique de 3 jour(s) Réf : WEB Cette formation pratique s'adresse aux futurs développeurs WebDev souhaitant réaliser des sites dynamiques Internet ou Intranet. 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 2) Accès aux données 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 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. 2) Accès aux données - 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. 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. 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. 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. 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). Bien organiser ses dossiers de projet, créer la documentation de l'application. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 148

149 7) Déploiement de l'application - Génération de l'application. - Génération de la procédure d'installation. - Déploiement. Créer le programme d'installation et installation d'un programme ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 149

150 Stage pratique de 3 jour(s) Réf : RUR Programmeurs, développeurs Web et Webmasters désirant concevoir des sites Internet professionnels orientés Web Services. Connaissances de base d'html, de JavaScript, d'un langage de développement côté serveur et en administration d'un serveur Web. Prix 2016 : 1840 HT Dates des sessions Paris 15 fév. 2016, 11 avr juin 2016, 12 sep nov 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. OBJECTIFS PEDAGOGIQUES 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 1) Introduction - Rappel Internet, HTML et CSS, XML, JSON, YAML. - Design Pattern MVC. - Les hébergeurs Rails. 2) Préparer son environnement de travail 5) Notions avancées de Rails 6) Tests et versioning 7) Migration vers Rails 4 - Environnement de travail (interpréteur Ruby). - Préparer le dossier de travail. - Les outils en ligne de commande. - Installer les outils de développement. 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). 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. 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. Ecriture de formulaires. Intégration de JQuery et CoffeeScript dans les développements. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 150

151 6) Tests et versioning - Le TDD (Test Driven Development). - Rails Tests et RSpec. - Gérer les versions avec GIT. Application du TDD. Gestion des sources avec GIT. 7) Migration vers Rails 4 - Les fonctionnalités de Rails converties en gems. - Utilitaire de migration. Migrer une application Rails 3. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 151

152 Stage pratique de 4 jour(s) Réf : DSW Cette formation pratique s'adresse aux informaticiens qui souhaitent concevoir une application client intranet/ Internet. Connaissances de base en architectures techniques. Prix 2016 : 2390 HT Dates des sessions Paris 23 fév. 2016, 15 mar avr. 2016, 24 mai juin 2016, 26 juil aoû. 2016, 6&20 sep oct. 2016, 15 nov déc Aix 1 mar. 2016, 7 juin sep. 2016, 15 déc Bordeaux 16 fév. 2016, 21 juin oct. 2016, 13 déc Bruxelles 21 mar. 2016, 28 juin sep Geneve 21 mar. 2016, 28 juin sep Grenoble 1 mar. 2016, 7 juin sep. 2016, 15 déc Lille 1 mar. 2016, 7 juin sep. 2016, 15 déc Luxembourg 21 mar. 2016, 28 juin sep Lyon 1 mar. 2016, 7 juin sep. 2016, 15 déc Montpellier 16 fév. 2016, 21 juin oct. 2016, 13 déc Nantes 16 fév. 2016, 21 juin oct. 2016, 13 déc Rennes 16 fév. 2016, 21 juin oct. 2016, 13 déc Sophia-antipolis 1 mar. 2016, 7 juin sep. 2016, 15 déc Strasbourg 1 mar. 2016, 7 juin sep. 2016, 15 déc Toulouse 16 fév. 2016, 21 juin oct. 2016, 13 déc Développer un site Web, synthèse pratique Best OBJECTIFS 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, XML..., les technologies du Web 2.0, 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. 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 1) Les technologies du site Web 6) Ergonomie et accessibilité d'une application Web 7) Pages dynamiques 8) Les technologies Web 2.0 9) Initiation au langage JavaScript et au DHTML - 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. 2) Administration d'un site Web - 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. 3) Création de pages Web : HTML, XML, XHTML - 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. 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. Réalisation d'un formulaire avec envoi des données vers la messagerie et une base de données. 5) Conception graphique et multimédia - 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. 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. - Accessibilité. Norme. Impact sur le développement. Mettre en conformité un site Web. Outils de test et de validation en ligne. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 152

153 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. Développer des pages dynamiques, interrogation d'une base de données, de services web. 8) Les technologies Web Présentation des technologies Web 2.0 (blogs, rss, wiki...). - Les technologies émergentes d'interfaces graphiques : XAML, Flex, HTML5. - Présentation et mise en oeuvre de solutions Rich internet Application (RIA) et Rich Desktop Application (RDA). - Présentation des solutions émergentes Adobe AIR, Microsoft SilverLight, framework Google. Démonstration et mise en oeuvre de ces multiples technologies. 9) Initiation au langage JavaScript et au DHTML - 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. 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 153

154 Stage pratique de 2 jour(s) Réf : ITF Développeurs de sites Web, Web designers, acteurs du marketing ou de l'informatique. Design d'un site Web, comment faire un site attractif et efficace OBJECTIFS 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. Aucune connaissance particulière. Prix 2016 : 1410 HT Dates des sessions 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 8) Suivi de projet Web Paris 14 mar. 2016, 19 mai juil. 2016, 8&15 sep nov Aix 11 fév. 2016, 30 juin sep. 2016, 1 déc Bordeaux 4 fév. 2016, 23 juin oct. 2016, 8 déc Grenoble 11 fév. 2016, 30 juin sep. 2016, 1 déc Lille 11 fév. 2016, 30 juin sep. 2016, 1 déc Lyon 11 fév. 2016, 30 juin sep. 2016, 1 déc Montpellier 4 fév. 2016, 23 juin oct. 2016, 8 déc Nantes 4 fév. 2016, 23 juin oct. 2016, 8 déc Rennes 4 fév. 2016, 23 juin oct. 2016, 8 déc Sophia-antipolis 11 fév. 2016, 30 juin sep. 2016, 1 déc Strasbourg 11 fév. 2016, 30 juin sep. 2016, 1 déc Toulouse 4 fév. 2016, 23 juin oct. 2016, 8 déc ) Positionnement du site Web - 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? Positionner un site exemple. 2) Règles de conception et usabilité - 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 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. Création d'une page valide et accessible. Correction des erreurs d'accessibilité. Tests sur les sites existants. 4) Décliner sa marque au site Web - Lier le design Web, la stratégie et la communication. - Valoriser une marque. Brief et stratégie créative. Charte graphique. Définir une charte graphique et utiliser un outil de maquettage fonctionnel. 5) Conception et gestion de contenu - 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. Utiliser un logiciel de publication Web et découvrir des sites légaux. 6) Techniques d'animation - 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. Découvrir les techniques d'animation de différents sites. 7) Analyse de trafic - Suivi et analyse de trafic. Analyse de référencement et positionnement. Techniques pour accroître le trafic. Création, analyse et positionnement de référencement. Analyse statistique et approches des SEO. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 154

155 8) Suivi de projet Web - Audit juridique du site : les risques. Conduite de projet : maquettage, développement... ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 155

156 Stage pratique de 2 jour(s) Réf : OPS Chef de projet, Webmestre, développeur, designer, toute personne liée au développement et à la promotion d'un site Web. Connaissances de base des concepts et technologies Web. Prix 2016 : 1410 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 10 mar. 2016, 9 juin oct. 2016, 12 déc Optimiser le référencement de votre site Web OBJECTIFS 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. 1) Rappel sur le Web 2) Moteurs de recherche 3) Audit de référencement 1) Rappel sur le Web - Les serveurs Web (Apache, IIS). Protocole HTTP. - HTML, XHTML. Tests de validation, enjeux sur le référencement. Accessibilité. Création et audit de métatags, audit de conformité XHTML. 2) Moteurs de recherche 4) Techniques de référencement 5) Optimisation du site Web 6) Accroître la popularité du site, campagne de publicité Web - 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. Référencement sur des moteurs, annuaires, zones dédiées. 3) Audit de référencement - 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. Mise en oeuvre d'un audit. 4) Techniques de référencement - 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). Mise en oeuvre des techniques. Réécriture de contenu. 5) Optimisation du site Web - 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. 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,... Mise en place d'une campagne Google AdWords. Définition d'un plan d'animation. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 156

157 Stage pratique de 1 jour(s) Réf : KCX Candidats à la certification FFP "Concepteur de sites Web". Certification Concepteur de sites Web OBJECTIFS Cette journéee 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. Avoir suivi l'intégralité des stages du cycle certifiant "Concepteur de sites Web". 1) Présentation des épreuves 2) Questionnaire à choix multiple 3) 4) Entretien individuel avec l'examinateur Prix 2016 : 540 HT Dates des sessions Paris 7 mar. 2016, 6 juin aoû Composition du cycle - 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 Certification Dans le cadre de cette journée, les participants auront à répondre à un QCM, à réaliser des travaux pratiques et un entretien individuel avec l'examinateur. 1) Présentation des épreuves - Présentation du déroulé des épreuves (timing, documents autorisés, etc...). - Questions de la salle. 2) Questionnaire à choix multiple - Questions ouvertes et fermées sur les connaissances essentielles des technologies web. 3) - Exercices sur la création d'un mini-site et le respect des règles apprises. 4) Entretien individuel avec l'examinateur - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 157

158 Stage pratique de 4 jour(s) Réf : HTX Ce stage pratique s'adresse à tous les informaticiens désireux de maîtriser les techniques permettant de développer un site Web et de construire une interface Web interactive et dynamique. Connaissances de base des composants d'une architecture Web. Prix 2016 : 2390 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 15 mar. 2016, 14 juin sep. 2016, 15 nov Dreamweaver CS6, développer un site 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é 1) Rappels Web - Les protocoles d'un site web : HTTP, FTP, SMTP, POP3. - Fonctionnement d'un site Web. HTML, URL. 5) Intégration de composants multimédias 6) JavaScript 7) Accès aux bases de données Paramétrage du navigateur, du serveur Web, création d'un environnement de développement. 2) L'interface Dreamweaver - 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). Découverte de l'éditeur, construction de pages. Développement de pages XHTML. 3) Composition de pages complexes - 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. 4) Design et accessibilité - 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. 5) Intégration de composants multimédias - 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. Contrôles sur les formulaires, ouverture de pop-up, traitement sur les div. 7) Accès aux bases de données - Paramétrage de la connexion ODBC. - Gestion dynamique des bases de données. - Interrogation SQL sur une table. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 158

159 - 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. Connexion à une base. Création d'une table d'utilisateurs, génération de pages de login. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 159

160 Stage pratique de 4 jour(s) Réf : DHL Ce stage pratique s'adresse à tous les concepteurs de sites Web et informaticiens désireux d'exploiter Javascript et les technologies HTML dynamique pour leurs projets. Bonnes connaissances du HTML. Connaissances de base en programmation. Prix 2016 : 2390 HT Dates des sessions Paris 1 mar. 2016, 9 mai juin 2016, 5 juil aoû. 2016, 13 sep oct. 2016, 15 nov déc Aix 1 mar. 2016, 17 mai sep. 2016, 8 déc Bordeaux 23 fév. 2016, 31 mai oct. 2016, 20 déc Bruxelles 8 mar. 2016, 7 juin 2016 Geneve 8 mar. 2016, 7 juin 2016 Grenoble 1 mar. 2016, 17 mai sep. 2016, 8 déc Lille 1 mar. 2016, 17 mai sep. 2016, 8 déc Luxembourg 8 mar. 2016, 7 juin 2016 Lyon 1 mar. 2016, 17 mai sep. 2016, 8 déc Montpellier 23 fév. 2016, 31 mai oct. 2016, 20 déc Nantes 23 fév. 2016, 31 mai oct. 2016, 20 déc Rennes 23 fév. 2016, 31 mai oct. 2016, 20 déc Sophia-antipolis 1 mar. 2016, 17 mai sep. 2016, 8 déc Strasbourg 1 mar. 2016, 17 mai sep. 2016, 8 déc Toulouse 23 fév. 2016, 31 mai oct. 2016, 20 déc JavaScript, HTML dynamique Best OBJECTIFS 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. 1) Les technologies du Web 2) Le langage JavaScript 3) Evénements et données 4) Gestion de formulaires HTML Programmation Javascript, manipulation du DOM, gestion de l'interactivité. 1) Les technologies du Web 5) Interaction avec les feuilles de style en cascade 6) Manipulation du DOM XML 7) Ajax - 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...). - Positionnement et illustration des technologies DHTML. 2) Le langage JavaScript - 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. 3) Evénements et données - 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). Exercice Programmation d'événements multiples sur les éléments formulaire, souris, clavier... 4) Gestion de formulaires HTML - Manipulation de contenu de formulaires. - Accès et modification dynamique des composants du formulaire : zone de saisie, cases à cocher, cases d'options... ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 160

161 - 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. 6) Manipulation du DOM XML - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 161

162 Stage pratique de 3 jour(s) Réf : PAJ Ce cours s'adresse aux Webmasters, développeurs Web, informaticiens. Ajax, programmation côté client 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. Bonnes connaissances en Javascript et en technologies Web côté client. Prix 2016 : 1920 HT Ce cours fait l'objet d'un accompagnement vidéo Dates des sessions Paris 8 fév. 2016, 2 mai sep. 2016, 28 nov ) Ajax 2) Rappels XML et Javascript 3) Javascript Object Notation (JSON) 4) Programmation du DOM 1) Ajax - Les objectifs d'ajax. Principes de fonctionnement. - Force du mix technologique Ajax/REST/Web Choisir entre Ajax et Flash, Applet, Html. Application. 2) Rappels XML et Javascript - 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. 5) Traitements XML en Javascript 6) XMLHttpRequest 7) Les patterns Ajax 8) Compléments Création d'une structure XML bien formée et valide. Manipulation de classes et d'objets. 3) Javascript Object Notation (JSON) - Avantages et inconvénients dans les échanges. - Objets, Arrays, syntaxe et parseur JSON. - JSON, avantages et inconvénients. - Sérialisation entre client et serveur. 4) Programmation du DOM - Importance du langage XHTML. Composants DHTML. - Le rôle du DOM dans la programmation XML. - Gestion dynamique de CSS. Modification dynamique du DOM d'une page HTML. 5) Traitements XML en Javascript - Présentation XSLT. Langage Xpath. Format RSS. 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. Gérer une table produit, un formulaire de login en Ajax. Remplir dynamiquement un menu déroulant. 7) Les patterns Ajax - Threads. Usage d'iframe pour les appels client/serveur. - Traitements asynchrones, synchrones. - Sécuriser des échanges Ajax (cryptage, sessions...). - Problématiques de sécurité et performance : cryptage, compression, débogage, offuscation. - Mise en place de proxy crossdomain. - Présentation et mise en oeuvre du framework jquery. Mise en oeuvre de requêtes asynchrones et multithreads. Développement Ajax en jquery. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 162

163 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. Développer en Javascript un exemple de cartographie. Développement Ajax sous HTML5. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 163

164 Stage pratique de 1 jour(s) Réf : KEX Candidats à la certification FFP "Développeur Web côté client". Avoir suivi l'intégralité des stages du cycle certifiant "Développeur Web côté client". Prix 2016 : 540 HT Dates des sessions Paris 1 avr. 2016, 5 sep Certification Développeur Web côté client OBJECTIFS Cette journéee 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. 1) Présentation des épreuves 2) Questionnaire à choix multiple Certification 3) Entretien individuel avec l'examinateur Dans le cadre de cette journée, les participants auront à répondre à un QCM, à réaliser des travaux pratiques et un entretien individuel avec l'examinateur. 1) Présentation des épreuves - Présentation du déroulé des épreuves (timing, documents autorisés, etc...). - Questions de la salle. 2) Questionnaire à choix multiple - Questions ouvertes et fermées sur les connaissances essentielles des technologies web. 3) Entretien individuel avec l'examinateur - 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. ORSYS, La Grande Arche, Paroi Nord, Paris La Défense cedex. Tél : +33 (0) Fax : +33(0) page 164