Éditeurs HTML CSS JAVASCRIPT

le langage HTML

Tout le necessaire du HTML

Le css

Comprendre le css

Le design et la mise en forme de page HTML

La programmation avec JAVASCRIPT : Les variables , Les tableaux , les if et else , les boucles for - do while - while - for in , les fonctions , les classes ...

La programmation avec React.js

Programmation et création de base de donnée avec Node.js

Exercices pratiques

Présentation HTML

• Éditeurs HTML
• HTML de base
• Éléments HTML
• Les balises HTML
• Les attributs HTML
• Les paragraphes
• Le formatage HTML
• La citations HTML
• Les commentaires en HTML
• Les liens HTML
• Les images HTML
• Titre de la page HTML
• Les tableaux en HTML
• Les listes en HTML
• Les balises Block et Inline
• Les identifiant en HTML - ID et CLASS ...
• Les iframe HTML
• Les Chemins des fichiers HTML
• Composition d'entête HTML et balise head
• Doctypes
• Le footer en HTML
• Mise en page HTML
• HTML résponsive
• Sémantique HTML
• Guide de style HTML
• Entités HTML
• Symboles HTML
• Émoticônes HTML
• Charset HTML
• Encodage d'URL en HTML
• HTML contre XHTML

Formulaires HTML

• Attributs du formulaire HTML - balise form
• Éléments de formulaire HTML
• Label - Textarea - Select - Submit
• Types d'input HTML
• Attributs d'input HTML
• Attributs des inputs du formulaire HTML

Graphiques HTML

• Canvas en HTML
• SVG en HTML

Les médias en HTML

• Vidéo HTML
• HTML Audio
• Plug-ins HTML
• HTML YouTube

Les API HTML

• Géolocalisation en HTML
• Glisser/Déposer HTML (drag/drop)
• Stockage Web HTML (Web strorage)
• HTML SSE

Exemples HTML

• Éditeur HTML
• Quiz HTML
• Exercices HTML
• Site Web en HTML
• Camp d'entraînement HTML
• Résumé HTML

Présentation CSS

• Comment fonctionne le CSS sur page web
• Syntaxe CSS
• Les sélecteurs CSS
• Commentaires CSS - comment
• Couleurs CSS - color
• Arrière-plans CSS - background
• Bordures CSS - border et border-radius
• Marges CSS - margin
• Pading CSS
• Hauteur/Largeur CSS - width/height
• Modèle de boîte CSS - Box model
• Contour CSS - Outline
• Texte CSS
• styler le text en CSS
• Icônes CSS
• Liens CSS
• style de listes en CSS
• Tableaux CSS
• Affichage CSS - display
• CSS Largeur maximale - max-width
• Position CSS
• Z-index CSS
• Débordement CSS - overflow
• CSS - float
• Changement de display en CSS inline - block - inline-block
• CSS Aligner - align
• Combinateurs CSS - combinator
• Pseudo-classe CSS
• Pseudo-élément CSS
• Opacité CSS - opacity
• styler la barre de navigation CSS
• Listes déroulantes en CSS
• styler des galerie d'images en CSS
• Sprites d'images CSS
• Sélecteurs d'attribut CSS
• styler les formulaires en CSS
• Compteurs CSS
• Mise en page du site Web en CSS - css layout
• Unités CSS
• Spécificité CSS
• CSS - ! important
• Fonctions mathématiques CSS - calc() - min() - max()

CSS Avancé

• Coins arrondis CSS - rounded corners
• Images de bordure CSS border-image
• Arrière-plans CSS - background
• Couleurs CSS - color
• Mots clés de couleur CSS - transparent - currentcolor - inherit
• Dégradés en CSS - gradients
• Ombres en CSS - shadow
• Effets de texte en CSS - text-overflow - word-wrap - word-break - writing-mode
• Polices Web CSS - Web Fonts - @font-face
• Transformations CSS 2D
• Transformations CSS 3D
• Transitions en CSS
• Animations en CSS - @keyframes
• Info-bulles CSS - tooltips
• styler les images en CSS
• Réflexion d'image en CSS - box-reflect
• Ajustement des objets en CSS - object-fit
• Position de l'objet CSS - object-position
• Masquage CSS - mask-image
• Boutons en CSS
• Pagination en CSS
• CSS plusieurs colonnes
• Interface utilisateur CSS
• Variables en CSS
• Dimensionnement des boîtes CSS box-sizing
• Requêtes multimédias CSS - media queries
• CSS Flexbox

CSS résponsive - Responsive Web Design RWD

• Introduction au résponsive RWD
• Fenêtre résponsive - Viewport
• Vue de la grille résponsive
• Requêtes multimédias résponsive - media queries
• Images résponsive
• Vidéos résponsive
• Cadres résponsive
• Modèles résponsive

Grille CSS - Grid Layout

• Introduction au Grid Layout
• Conteneur de grille - grid container
• Article de grille - item - grid-row - grid-area - grid-template-areas

CSS - SASS

• Tutoriel SASS

Exemples CSS

• Modèles CSS
• Extraits CSS
• Quiz CSS
• Exercices CSS
• Site Web CSS

Introduction à javascript

• Ou insérer le code javascript
• Sortie javascript - Output
• Déclarations javascript - statements
• Syntaxe javascript
• Commentaires en javascript - comment
• Variables en javascript - var
• javascript - Let
• javascript constante - Const
• Opérateurs javascript + - = - * ++ - != ...
• JavaScript arithmetic
• JavaScript assignment
• Types de données javascript - DATA TYPES - string - number - boolean - array ...
• Fonctions javascript
• Objets javascript
• Événements javascript
• Chaînes de charactère javascript - string
• Fonctions natives sur les chaînes de charactère en javascript ( methods ) - slice() - substring() - concat() - length() ...
• Recherche dans une chaîne de charactère en javascript - indexOf() - lastIndexOf() - search() ...
• Modèles de chaînes javascript - template string
• Numéros en javascript
• javascript BigInt - BigInteger
• Fonctions natives sur les numéros en javascript - methods
• Propriétés du numéro en javascript - properties
• Tableaux en javascript - array
• Fonctions natives sur tableau en javascript - methods
• Recherche dans les tableaux en javascript - array.indexOf() - array.LastIndexOf() - array.find() ...
• Tri des tableaux javascript array.sort() - array.reverse() - array.math.min.apply() ...
• Itération du tableau en javascript - array.forEach() - array.map() - array.flatMap() - array.filter() - array.reduce() ...
• Const de tableau javascript - array const
• Dates en javascript
• Formats de dates en javascript
• Méthodes d'obtention de date en javascript - get
• Méthodes de définition de dates en javascript - set
• Mathématiques javascript - math.ceil() - math.floor() - math.round() ...
• Javascript aléatoire - math.random()
• Javascript Booléens
• Comparaisons javascript - == - !== ...
• Javascript if(){}else{} - switch
• switch javascript
• Boucle javascript - for
• Boucle javascript for in
• Boucle javascript for of
• Boucle javascript while
• Pause javascript - break
• Itérables javascript - Iterables
• Javascript - new Set()
• Cartes javascript - new Map()
• Type javascript - TypeOf()
• Conversion de type de variable en javascript
• Opérateur javascript - Bitwise
• Les régexes en javascript - RegExp
• Erreurs javascript
• Portée des variables en javascript
• Javascript - Hoisting
• Mode strict javascript - use strict
• Javascript et mot clé - this
• Fonction flèche javascript - arrow function - ()=>
• Les classes en javascript - Class - constructor()
• Les modules en javascript - import - export
• Javascript - JSON
• Débogage javascript - Debugging
• Guide de style javascript
• Meilleures pratiques javascript
• Performances javascript
• Mots réservés javascript - Reserved Words

Versions javascript

• Versions javascript
• javascript 2009 (ES5)
• javascript 2015 (ES6)
• javascript 2016
• javascript 2017
• javascript 2018
• javascript 2019
• javascript 2020
• javascript 2021
• javascript 2022
• javascript 2023
• javascript IE/Edge
• Histoire javascript

Objets en javascript

• Définitions des objets
• Propriétés de l'objet
• Méthodes d'objet
• Affichage de l'objet
• Accesseurs d'objets
• Constructeurs d'objets
• Prototypes d'objets
• Objet itérable
• Ensembles d'objets
• Cartes d'objets
• Référence de l'objet

Fonctions en javascript

• Définitions des fonctions
• Paramètres de la fonction
• Invocation de la fonction
• Appel de la fonction - Call
• Fonction Appliquer - Apply
• Fonction Lier - Bind
• Fermetures de fonction - Closures

Classe en Javascript

• Introduction au classe
• Héritage de classe
• Classe statique

JS Asynchrone - ASYNC

• Rappels en javascript - callbacks
• JS asynchrone
• Les promesses javascript - promises
• JS Async/Attendre - await

JS HTML DOM

• Introduction au DOM
• Méthodes DOM
• Document DOM
• Éléments DOM
• DOM HTML
• Formulaires DOM
• DOM CSS
• Animations DOM
• Événements DOM
• Écouteur d'événements DOM
• Navigation DOM
• Nœuds DOM
• Collections DOM
• Listes de nœuds DOM

Nomenclature javascript du navigateur

• Fenêtre JS - windows
• Écran JS - screen
• Emplacement JS - location
• Historique en JS
• Navigateur JS - navigator
• Alerte contextuelle JS - popup alert
• Synchronisation JS - timing
• Cookies JS

API Web JS

• Introduction à l'API Web
• API de formulaires Web
• API Historique Web
• API de stockage Web
• API Web Worker
• API de récupération Web - fetch
• API de géolocalisation Web