Présentation de la formation
Programmation en HTML5 avec JavaScript et CSS3 (70-480)
Chamseddine OUERHANI Site : http://www.alphorm.com Blog : http://www.alphorm.com/blog Forum : http://www.alphorm.com/forum HTML5 avec JavaScript et CSS3 (70-480)
Développeur et Formateur DOTNET
Contact :
[email protected]
alphorm.com™©
Plan • Présentation du formateur • Qu’est-ce que c’est HTML5, CSS3 et JavaScript ? • Le plan de formation • La certification MCSD • Publics concernés • Connaissances requises • Liens des ressources logicielles
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Présentation du formateur • OUERHANI Chamseddine • Email:
[email protected] • Développeur et formateur DOTNet • Expert auditeur en sécurité des systèmes d’information
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Qu’est-ce que c’est HTML5, CSS3 et Javascript ? • HTML5: décrit plus de 100 spécifications défini par le (W3C) relatives à
la nouvelle génération de technologies Web. • CSS3: (Cascading Style Sheets) sont un langage permettant de décrire la
restitution de documents HTML à l'écran, sur papier, vocalement, etc. • JavaScript : est un langage de script léger utilisant le concept
de prototype, principalement connu comme le langage de script des pages web.
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Le plan de formation 1. Vue d'ensemble de HTML et CSS
9.
Ajouter le support du mode hors ligne aux
2. Créer et styler une page HTML5
applications
3. Introduction à JavaScript
10. Implémenter une interface utilisateur
4. Créer des formulaires pour collecter des
adaptative
données et valider les entrées utilisateurs
11. Créer des graphiques avancés
5. Communiquer avec une source de données
12. Animer l'interface utilisateur
distante
13. Implémenter la communication temps-réel
6. Styler HTML5 en utilisant CSS3
avec les Web Sockets
7. Créer des objets et des méthodes en utilisant
14.
Créer un processus Web Worker
JavaScript 8. Créer des pages interactives en utilisant les API HTML5
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
La certification MCSD • Cette formation est associée à l’examen 70-480 • Cette formation prépare au passage de la certification : MCSD (Microsoft Certified Solutions Developer) : Web Applications
MCSD (Microsoft Certified Solutions Developer) : Windows Store Apps Using HTML5
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
La certification
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Formation ASP.NET sur alphorm.com • Formation Développez des applications Web avec ASP.NET MVC 4 (70-486)
• Formateur : Djamel BOUCHOUCHA • Durée : 12 heures 32 minutes
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Publics concernés • Développeur junior ou senior • Chef de projet
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Connaissances requises • Les candidats à cet examen doivent avoir une ou plusieurs années
d'expérience dans la programmation de la logique métier/application essentielle pour une variété de types d'applications et plates-formes matérielles/logicielles en utilisant JavaScript. • Les candidats doivent également avoir un minimum de un à deux ans
d'expérience dans le développement en HTML dans une modèle de programmation axé sur les événements et orienté objet.
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Les ressources logicielles • IDE: Visual studio 2012 https://www.microsoft.com/france/visual-studio/ • Bibliothèque: JQuery http://jquery.com/
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Les liens utiles • Formation http://www.microsoft.com/france/vision • Académie virtuelle de Microsoft http://www.microsoftvirtualacademy.com/ • Passage d’examen https://www.prometric.com/en-us/Pages/home.aspx • Repassage d’examen http://www.microsoft.com/learning/en-us/second-shot.aspx
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Are you ready ? ☺
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Vue d’ensemble de HTML et de CSS
Notions de bases et évolution Chamseddine OUERHANI Site : http://www.alphorm.com Blog : http://www.alphorm.com/blog Forum : http://www.alphorm.com/forum HTML5 avec JavaScript et CSS3 (70-480)
Développeur et Formateur DOTNET
Contact :
[email protected]
alphorm.com™©
Plan • Historique et évolution Internet Le Web Html CSS JavaScript
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Internet • Internet est un regroupement de réseaux, reliant des ordinateurs. • Origine (ARPANET) L'ARPA (Advanced Research Project Agency), un organisme du département de la défense américain. 1969 • Apparition (INTERconnected NETworks ) Sa date d'inauguration retenue le plus souvent est le 1er janvier 1983 avec l'apparition du protocole TCI/IP. • Constitution messagerie, transfert de fichier, web…
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Le Web (World Wide Web) •
Le Web est une des applications d’internet.
•
Installation au CERN situé près de Genève.
•
Le Web est supervisé par le W3C, un Consortium International.
•
Le W3C est dirigé depuis janvier 2003 par l'ERCIM (the European Research Consortium for Informatics and Mathematics) Timothy John Berners-Lee Inventeur du World Wide Web
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
HTML (HyperText Mark-Up Language) • HTML est le langage de base du Web.
Apparu en août 1991, il utilise un ensemble de balises pour décrire les données à afficher.
• HTML 1.0 ->HTML 2.0-> HTML 4.0 -
>XHTML ->HTML 5
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
CSS(Cascading Style Sheets) • CSS est un langage consacré à la mise
en forme des contenus HTML.
• CSS1 -> CSS2 -> CSS2.1 -> CSS3 ->
CSS4 en cours d’écriture.
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
JavaScript • Un langage qui ajoute de l'interactivité
aux pages Web. • JavaScript a été développé par Netscape
en 1995. • Ce n'est que lors de la sortie de
Netscape 2.0 que le nom « JavaScript » est apparu.
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Ce qu’on a couvert Des notions indispensables au développement WEB. •
Internet, Le Web, Html, CSS, JavaScript
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Vue d’ensemble de HTML et de CSS
Vue d’ensemble de HTML
Site : http://www.alphorm.com Blog : http://www.alphorm.com/blog Forum : http://www.alphorm.com/forum HTML5 avec JavaScript et CSS3 (70-480)
Chamseddine OUERHANI Développeur et Formateur DOTNET
Contact :
[email protected]
alphorm.com™©
Plan • Caractéristiques de HTML • Démonstration: Première page web avec Bloc-notes Notion de balises et attributs Les bases, le doctype, l’encodage, les paragraphes, les titres, les listes, les liens, les images, les commentaires
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Page web statique Requête HTTP
Réponse HTTP Client
Serveur
HTML est un langage de programmation de page web statique HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Langage interprété vs langage compilé Compilation
Exécution
Ordinateur Système d’exploitation
Navigateur Interprétation
HTML est un langage de programmation interprété HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Ce qu’on a couvert • Notion de site statique et site dynamique • Notion de Langage interprété, langage compilé et langage hybride • Notion de balises et attributs • Les différentes balises de HTML
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Vue d'ensemble de HTML et CSS
Vue d'ensemble de CSS Chamseddine OUERHANI Site : http://www.alphorm.com Blog : http://www.alphorm.com/blog Forum : http://www.alphorm.com/forum HTML5 avec JavaScript et CSS3 (70-480)
Développeur et Formateur DOTNET
Contact :
[email protected]
alphorm.com™©
Plan • Les règles générales • Les sélecteurs d’élément, d’identifiant, de classe et d’attribut • Cascade et héritage • Méthodes d’application des styles CSS
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Les règles générales • Structure de base
Sélecteur { Porpriété 1: Valeur 1; Porpriété 2: Valeur 2; }
Exemple:
HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Les sélecteurs • Sélecteur d’élément
• Sélecteur de plusieurs éléments • Sélecteur universel • Sélecteur d’identifiant
• Sélecteur de classe • Sélecteur d’attribut • Sélecteur de valeur d’attribut HTML5 avec JavaScript et CSS3 (70-480)
alphorm.com™©
Méthodes d’application des styles CSS • Dans l’élément