Sites Web interactifs 2010 / 2011 / S1 Bernhard Rieder

Infos de base Page du cours : Sites Web interactifs

Principes du cours Langage : JavaScript (+HTML +CSS +PHP) => Bonne entrée dans la programmation => Langage qui monte Orientation : pratique et concepts de base ! Exemples tirés du monde du Webdesign Mais : couche réflexive Sites Web interactifs

Validation / notation - Présence et participation au cours - La réalisation de quatre devoirs pendant le semestre - L'achèvement d'un projet => Scripteurs confirmés, venez me voir Sites Web interactifs

Connaissances - Est-ce que vous avez déjà… Sites Web interactifs

JavaScript ? Sans JavaScript : load => click => reload => click => reload => … Avec JavaScript : load => click => click => click => click => … Sites Web interactifs

JavaScript ! = Langage de programmation ≠ Java = coté client (clientside) ≠ coté serveur (serverside) => deux méthodes pour programmer l’interactivité Sites Web interactifs

Architecture client-serveur CLIENTSERVEUR HTTPREQUEST DOCUMENT HTML WEB STATIQUE ( client - serveur ) JavaScript Flash Java Applets PHP ASP JSP Ruby on Rails Python PERL …

Exemples Du très simple au très complexe. Sites Web interactifs

Donc : Un script écrit en JavaScript est intégré dans un document HTML et il est interprété en temps réel par un Navigateur Web (Browser). => ??? Sites Web interactifs

Par rapport à d'autres langages : Pas de typisation stricte pour les variables Pas de gestion de la mémoire Pas de lecture/écriture de fichiers (sf. cookie et AJAX) Pas de linkage et compilation Pas d'accès directe aux bases de données Sites Web interactifs

Mais c'est un langage qui : Fait parti de la famille " C " Est orienté-objet (mais peut être procédural) Est standardisé sous le nom ECMAScript dont ActionScript est un dialecte Vous permet d'apprendre à programmer dans un contexte favorable Sites Web interactifs

JavaScript vs. Flash

Le Web évolue en permanence ! Comme toute technologie, JavaScript a un passé, un présent et un avenir. Sites Web interactifs

L'environnement de programmation Éditeur texte => IDE - Dreamweaver - Notepad++, Notepad 2, Coda, … - Aptana Plugins Firefox - FireBug - IETab => Mode de fonctionnement Sites Web interactifs

Conseils de base - Patience ! - Acceptez de ne pas savoir. - Il faut investir du temps. - Testez, testez, testez ! - Apprendre les bonnes pratiques : formatez bien vos codes (HTML, CSS, JS) commentez regardez les consoles utilisez alert() et console.log() utilisez Google posez des questions Sites Web interactifs

Le fichier de base La tête de la page, JavaScript CSS, etc. Le corps de la page => objet « document » Sites Web interactifs