Dev Web 1

MON du temps 1 :

• HTML/CSS/JS : 5h sur les tutos de internetthingishard sur HTML et CSS afin de reprendre bien les bases. Aborder les notions de balises, classes, CSS selector, floats...
  S'en suivent 5h sur du javascript ou du moins les prémices de js sur developper.mozilla afin de rendre les sites un peu plus dynamique.

1. Introduction au html/CSS

Site : ensemble de pages
Page : HTML + CSS + JavaScript
HTML : Contenu de la page
CSS : Format de ce contenu
JS : Dynamisation et interactivité de la page

2. Basic web page

Création de notre première page.
Notions abordées : balises, paragraphes, titres, list, head, body, br, hr.

3. Links and Images

Elargissement de page web à site web, relier des pages entre elles grâce à des liens, insertion d'images.
Apprentissage de la rigueur à appliquer à ses dossiers, fichiers, path afin de les retrouver.
Absolute Link, relative link, rooth-relative link.
Formats d'images et leurs utilisations : png, jpg, gif, svg.
Dimensions de l'image.

4. CSS Base

Relier un fichier CSS à un HTML.
Définir le style sur les différentes balises : couleur, taille, police...
Styles de pages, de box, d'inline.
Balises div et span, text-align center.

5. CSS Box

Etudes complètes de la notion de box. Répartition de la pages en terme de blocs.
Content, padding, border et margin.
Manière de paramétrer les espaces entre tous selon toutes les directions.
Aligner les box au centre avec auto-margin. Width, Height.

6. CSS selector

Notions de class permettant de styliser toutes les parties de notre site.
Utilisation plus complètes des balises div comme container.
Notions de Pseudo-class.

7. Floats

Obtenir un pouvoir d'organisation horizontale sur le style de la page, répartition de la page en container div afin que tout ait une place et un contenu.
Organisation classique d'une page : sidebar, menu, contenu, footer.
Division d'une partie en d'autres parties.
Overflow : hidden.

8. Qu'est ce que JavaScript

Stockage de valeurs, Opérations sur variable, notions d'évènements.
Notions d'API. Code interprété, dynamique et coté client (dans ce module).
Relier un fichier JS à un fichier HTML.

9. Un premier code JS

Dans ce premier module, l'objectif est d'étudier une premiere page réaliser à l'aide de javascript.
Cette page est un jeu dans lequel il faut deviner un nombre entre 1 et 100 en 10 tentatives maximum. Le jeu indique plus ou moins à chaque tentative.
Cette page est d'un niveau JS un peu compliqué pour un débutant et c'est voulu. L'objectif est d'explorer les différentes partie d'un code JavaScript et ce que cela peut réaliser.
On peut le décomposer comme suit :

• Variables
• Fonctions
• Boucles à conditions et incrémentations

10. Suite JS

J'ai sauté quelques chapitres sur des thèmes déjà acquis tels les variables et les boucles. Je continue donc mon apprentissage par les fonctions sur JS.
Je ne pense pas avoir besoin de réexpliquer les fonctions, j'étudie ce chapitre plus pour comprendre la syntaxe de déclaration et d'appel des fonctions.
Fonctions intégrées et personnalisées, portée des fonctions.
J'ai ensuite pu pratiquer un peu et créer ma propre fonction générée sur une page HTML. Cette fonction permettait de créer une box alert lorsqu'on cliquait sur un bouton. La box était ensuite personalisé en focntion du type de message.
Exemple intéressant car de nombreuses fonctions intégrés ont été utilisées et j'ai pu me familiariser avec la manière de les appeler. C'était aussi un premier exemple pratique de ce qu'on peut faire avec les évènements.

11. Evenements en JS

Dernière partie de mon apprentissage en JS : les évènements. Le site contient de nombreux exemples de toutes sortes d'évenements possible et cela m'a pris une bonne partie du temps d'apprentissage. C'était sans doute la partie la plus fastidieuse mais c'était vraiment une nouveauté pour moi et je trouvais nécessaire de prendre le temps de bien comprendre la syntaxe sur comment appeler chaque évènement puisque j'en aurais besoin pour le POK.
Notions de bouillonement et de capture.