Programmation Web (IT103)

Ce cours présente les différentes architectures et technologies utilisées pour développer des applications Web. Les slides d'introduction au module sont disponibles ici.

Plan du cours

Voici le plan du cours.

1. Introduction

  1. Internet
  2. Le Web
  3. Les styles d'applications Web

2. HTML

  1. Présentation du langage
  2. Document, éléments et attributs
  3. Squelette d'un document
  4. Les différentes catégories d'éléments
  5. Manipulation

3. CSS

  1. Présentation du langage
  2. Règles, sélecteurs, blocs et déclarations
  3. Héritage et priorités
  4. Positionnement
  5. Le modèle de boîtes
  6. Déclarations usuelles
  7. Manipulation

4. PHP

  1. Présentation du langage
  2. Générer du HTML
  3. Accéder au contenu des requêtes HTTP
  4. Les sessions applicatives
  5. Interroger une base de données
  6. Manipulation

5. SQL

  1. Présentation des SGBDR
  2. Le modèle entité-relations
  3. Création de la structure de la base
  4. Manipulation des données
  5. Intégration avec PHP
  6. Manipulation

Ressources en ligne

Voici les différentes ressources disponibles en ligne pour approfondir le cours. Malheureusement, vous allez vite vous rendre compte que toutes ces ressources sont en anglais, mais c'est le prix à payer pour profiter d'une documentation de qualité et à jour, get over it! Personnellement j'ai un faible pour les ressources de Mozilla ou du W3C.

  • Le Mozilla Developper Network propose plusieurs cours en lignes ainsi que des documentations de références sur HTML, CSS et JavaScript
  • WebPlatform propose plusieurs cours en lignes ainsi que des documentations de références sur HTML, CSS et JavaScript
  • Le wiki du W3C propose plusieurs cours en lignes ainsi que des documentations de références sur HTML, CSS et JavaScript
  • SitePoint propose des documentations de références sur HTML, CSS et JavaScript
  • W3Schools propose plusieurs cours en lignes ainsi que des documentations de références sur HTML, CSS, JavaScript et PHP.
  • Can I Use? permet de visualiser rapidement quels navigateurs supportent une fonctionnalité donnée de HTML, CSS ou JavaScript.
  • Le manuel officiel de PHP est très bien réalisé.
  • sql.sh (en français, une fois n'est pas coutume) possède un très bonne dpcumentation sur la langage SQL.
  • La documentation du site de MySQL sur mysqli permet d'avoir une vision globale des différentes fonctions disponibles.

Validation de pages

Les validateurs (X)HTML et CSS du W3C vous permettent de vous assurer que vos pages web sont correctes,

Cheat sheets

Ces cheat sheets vous servirons d'aides mémoires très pratiques pendant que vous développez. Merci à leurs auteurs respectifs.

Outils et librairies

  • Pour éditer le code source, je vous conseille les éditeurs suivants : Atom ou Visual Studio Code.
  • Pour débugger votre code HTML, CSS ou JavaScript les outils pour développeurs du navigateur Google Chrome sont très pratiques. Pour Firefox l'addon Firebug est très utilisé.
  • Développer une application Web sur votre ordinateur personnel nécessite l'installation d'un serveur d'Apache, de MySQL et de PHP. Ces trois logiciels sont faciles à installer sur Linux (via le système de paquets) ou Mac OS X (via MacPorts ou Homebrew). Sous Windows, vous pouvez utiliser WampServer.
  • La librairie Bootstrap permet d'écrire du HTML et du CSS avancé de manière beaucoup plus simple. Elle vaut le coup d'oeil (et est notamment utilisée au sein de ce site).
  • Vous pouvez trouver la documentation de la librairie mysqli sur cette page (colonne Procedural interface).

Travaux pratiques

Voici les sujets des séances de travaux pratiques :

Projets

Vous trouverez les documents concernant le projet de cette année ici.

Voici les archives des projets.