% INF3190 — Introduction à la programmation Web % UQAM — Département d'informatique % Plan de cours — Automne 2020 * Horaires, locaux et enseignants: Responsable(s) du cours ======================= Coordination ------------ Mosser, Sébastien PK-4820 Enseignement ------------- Guillemette, François-Xavier PK-4115 Groupes: 020 Berger, Jacques PK-4115 Groupes: 040 - Les étudiants doivent consulter régulièrement leur courriel UQAM, moyen de communication de l'enseignant avec le cours-groupe. Description du cours ==================== Ce cours introduit à la conception et au développement Web, tant du côté client que serveur. Sommaire du contenu ------------------- Les fondements du web : navigateur, serveur, protocoles. Langages et normes du Web (HTML5, JavaScript, PHP, CSS). Introduction à un cadre d'applications (cadriciel, framework). Notions de conception d'interface et de logiciel en tant que service (Software as a service, SaaS). Modalités d'enseignement ------------------------ Ce cours comporte une séance obligatoire de laboratoire (2 heures). Préalables académiques ---------------------- - INF1120 - Programmation. I - INF1070 - Utilisation et administration des systèmes informatiques. Objectif du cours ================= Ce cours vise à fournir aux étudiants les connaissances nécessaires dans la programmation du web du côté client et du coté serveur: - Comprendre l'évolution du web et des langages de marquage; - Étudier les aspects de structure, de style et traitement dans une application web; - Se familiariser avec les langages fondamentaux du web; - Se familiariser avec les outils de développement d'application web; - Étudier les éléments importants de programmation du côté du client à l'aide de langages de scripts tels que JavaScript; - Se familiariser avec l'approche de programmation d'applications interactives avec des composantes web; - Comprendre les bases de la programmation du côté des serveurs web; - Appliquer les concepts appris dans des cas pratiques; - Se familiariser avec l'asynchronisme et la programmation événementielle omniprésentes sur le web; - Se familiariser avec les méthodes de développement de l'industrie et le débogage d'application web. Quelques aspects pratiques ========================== Compte tenu du contexte actuel de COVID-19, de la nécéssité de proposer une solution adaptée au plus grand nombre et du surcharge de travail engendré pour l'enseignant; les activités se poursuivront sous la forme suivante: - Cours à distance. - Les présentations, les vidéos et les références seront mises à la disposition des étudiants sur la plateforme au choix de l'enseignant. - Les séances synchrones par vidéoconférence serviront à illustrer la matière, discuter, répondre aux questions et faire le suivi des travaux. Contenu du cours ================ - Introduction. Évolution de la programmation web, langages de marquage, architecture client/serveur web, navigateurs, plateformes de développement, protocole HTTP; - Introduction à la construction de pages web avec le langage de marquage HTML. Introduction au concept de document sémantique et aux règles d'accessibilité; - Génération dynamique de pages web côté-serveur avec un langage de gabarit; - Production de contenu interactif en HTML (formulaires sémantiques, contrôles graphiques, sensibilisation aux concepts d'utilisabilité et d'expérience-utilisateur, validation côté-client, interactions avec le serveur et l'utilisateur); - Traitement de requêtes et de formulaires côté-serveur. Validation de données, patron de conception PostRedirectGet et MVC, introduction aux concepts d'injection; - Introduction au langage de définition de styles CSS. Définition des sélecteurs, calcul de la priorité d'application, introduction aux concepts de séparation de la structure du contenu de sa mise en page et aux liens entre les balises sémantiques, les lignes directrices d'accessibilité et les règles de style CSS; - Mise en page avancée avec CSS. Introduction au concept de mise en page, de responsive design, de positionnement, du box model, de flexbox et de grid layout; - Organisation et exploitation d'une application web. Mise en place des outils et cadres applicatifs. Architecture dotée d'un reverse-proxy, d'un répartiteur de charge, applications multi-thread c. multi-process. Discussion sur les conditions de course possibles reliées à l'utilisation de sessions web et d'une base de données; - Introduction au langage de scripting JavaScript. Discussion sur les notions de compression, de concaténation, de minification et de précompilation. Introduction au langage de structures de données JSON; - Programmation événementielle. Introduction au patron de conception d'interfaces utilisateurs ModelViewController. Binding d'événements utilisateurs à des fonctions de rappels. Discussion sur le concept de Promises et des mots clés async/await; - Introduction au concept de programmation d'interfaces utilisateurs par composantes. Introduction aux concepts de gestion de l'état des composantes, de binding aux événements utilisateurs, serveurs et fureteurs; - Programmation d'applications Ajax. Intégration des notions présentées (protocole HTTP, programmation événementielle, composantes HTML, structures de données JSON et génération dynamique de contenu côté-serveur) dans le but de produire une application complète; - Sujets variés selon les tendances actuelles (bundlers, loaders, transpilers, dependency managers, cadres applicatifs et standards permettant la programmation par composantes); Modalités d'évaluation ====================== Description Pondération -------------- ------------- Examen intra 25% Examen final 25% TP1 15% TP2 15% TP3 20% Règles concernant le seuil de passage ------------------------------------- L'étudiant doit obtenir une moyenne cumulée aux examens égale ou supérieure à 50%, ainsi qu'une moyenne cumulée pour les travaux supérieure ou égale à 50%. Si ces seuils ne sont pas atteints, la mention échec sera automatiquement attribuée au cours. Médiagraphie ============ VO Présentations du cours et manuel d'exercices (disponibles sur ). VR sur le web : - - VR Reg Braithwaite -- JavaScript Allongé, the "Six" Edition VR David Sklar -- Learning PHP, A Gentle Introduction to the Web's Most Popular Language O'Reilly Media, 2016. (Disponible en ligne, après un abonnement gratuit, à BAnQ) VR FELKE-MORRIS, Terry -- *Web Development and Design Foundations with XHTML* -- 5/E. ADDISON-WESLEY, 2010. Fortement recomandé. VR SEBESTA, Robert -- *Programming the World Wide Web* -- 5/E. ADDISON-WESLEY, 2010. VR LEMAINQUE, Fabrice -- *HTML, XHTML, CSS, Scripts, Le guide Complet* -- EDITIONS MICRO APPLICATION, 2008. VR NEBRA, Mathieu -- *Réussir son site Web avec XHTML et CSS* -- EYROLLES, 2010.