Mon hobby! la programmation Web

12 octobre 2013

Ce site est consacré à la programmation Web et englobe toutes les disciplines reliées à ce travail soit HTML, CSS, PHP, Javascript et jQuery.

J'ai commencé à travailler sur ce site Web en septembre 2013 et ça ma forcé à retrousser mes manches et apprendre. Du côté serveur, je n'avais pas de problème puisque j'ai mis au point quelques sites Web en utilisant PHP, ce, depuis quelques années. Du côté client, le résultat était plutôt statique puisque je trouvais Javascript difficile à utiliser (trop d'ajustement et de "hack" pour plaire à tous les fureteurs). Sur des sites précédents, j'ai téléchargé un menu qui, lui utilisait Javascript en disséminant les commandes à partir du serveur. Rien de plus jusqu'à ce que je découvre jQuery.

Suite à mon apprentissage de CSS et de jQuery, j'ai pris de nombreuses notes que j'ai décidé de mettre sur ce site Web. En espérant qu'elle puissent servir à quelqu'un, les voici.

Généralités

Comment fonctionne un fureteur?	Cette page décrit en mots le fonctionnement d'un fureteur. J'y montre les opérations qu'il effectue lorsqu'un internaute demande une page Web et la reçoit. Le processus d'analyse qui suit permet alors de construire la structure du DOM et d'y loger le contenu de la page. Il construit ensuite l'arbre de rendu qui inclus la mise en forme, effectue la mise en page et dessine finalement la page à l'écran. Finalement, je détaille le fonctionnement des moteurs de rendu Gecko et Webkit.

Comment fonctionne un fureteur?

Cette page décrit en mots le fonctionnement d'un fureteur. J'y montre les opérations qu'il effectue lorsqu'un internaute demande une page Web et la reçoit. Le processus d'analyse qui suit permet alors de construire la structure du DOM et d'y loger le contenu de la page. Il construit ensuite l'arbre de rendu qui inclus la mise en forme, effectue la mise en page et dessine finalement la page à l'écran. Finalement, je détaille le fonctionnement des moteurs de rendu Gecko et Webkit.

Mes notes sur CSS

J'ai travaillé sur les feuilles de style en cascades en octobre et novembre 2013. J'ai alors pris des notes que j'ai éditées pour les rendre un peu pédagogiques. Les voici:

Généralités	Cette page traite des connaissance générales que je juge nécessaire à une bonne compréhension du sujet: je situe le sujet, j'introduis le sujet par quelques exemples, je définis ce qu'est une CSS et comment elles sont supportées par les fureteurs.
Sélecteurs	>Cette page traite des sélecteurs utilisés pour identifier les parties d'un document qu'on veut formater. Je commence par une présentation du « Document Object Model », je continue en présentait toutes les formes que peuvent prendre les sélecteurs individuels et en montrant comment les composer.
Propriétés simples	Cette page traite des propriétés CSS et de la façon dont elles affectent les éléments du document définies par les sélecteurs. Ces propriétés CSS sont très nombreuses et je commence par les plus faciles: propriétés de couleur et de fond, propriétés des polices, propriétés des textes, propriétés des listes et propriétés d'effets visuels.
Propriétés avancées	Cette page traite encore des propriétés et des règles CSS qui s'y appliquent mais à un niveau de difficulté un peu plus grand et pour lesquelles j'ai donné quelques exemples.
Devrait-on structurer un site Web avec CSS	Ma réponse est « oui » et, dans cette page, je décris la démarche classique de structuration utilisant des balises <table> imbriquées, la démarche CSS utilisant des balises <div> imbriquées utilisant "display: table;", "display: table-row" et "display: table-cell". J'ajoute ensuite la structure ce ce site en tant qu'exemple.
Les variables CSS s'en viennent!	Depuis très longtemps, l'usage de variables en CSS a été une capacité désirée par les programmeurs Web. Voilà qu'elles sont à l'horizon dans le paysage de la norme CSS. Ça va permettre un grand nombre de simplifications dans le code et supprimer les redondances qui affligent les fichiers CSS.
Quelques problèmes résolus et à résoudre	Dans cette page, je relate les quelques problèmes de CSS que j'ai rencontrés et que j'ai dû résoudre. Cette page est en développement et sera mise à jour à chaque nouveau problème trouvé.

Mes notes sur jQuery

Pendant longtemps, j'ai utilisé Javascript pour rendre mon site plus dynamique et convivial. Le gros problème avec ce langage "script" vient du fait qu'il s'exécute sur l'ordinateur du client et est interprété localement par un fureteur. Comme chaque fureteur a son propre interprète et que l'interprétation du code varie d'un fureteur à l'autre, jQuery me paraît une solution à ce problème et je l'ai adopté. Voici mes notes sur le sujet.

Introduction	Je présente ici un court historique du HTML et de Javascript afin de présenter jQuery dans un contexte où il montre sa facilité d'usage et sa puissance. J'en profite aussi pour introduire le « Document Object Model »
Syntaxe	Dans cette page, je présente la fonction globale de jQuery qui s'écrit soit jQuery() ou plus simplement $(). Elle prend deux arguments: un sélecteur et un contexte et elle créé des objets jQuery. J'explique qu'elle a des fonctions diffrentes selon la nature du premier argument qui peut être soit un sélecteur, un élément du DOM ou une chaîne de caractères. Finalement, je donne une idée de ce qu'est la chaînabilité.
Sélecteurs	Cette page traite des sélecteurs utilisés pour identifier les parties d'un document qu'on veut formater. Je commence par une présentation du « Document Object Model », je continue en présentait toutes les formes que peuvent prendre les sélecteurs individuels et en montrant comment les composer.