Dans ce cours en ligne nous allons créer un site de A à Z dans les règles de l'art, le tout en HTML / CSS et JavaScript pour les animations.
Le site en question sera un portfolio 100% responsive, qui utilisera pas mal de concepts clés en CSS.
À travers ce projet de Portfolio, vous apprendrez à :
- Positionner des éléments avec Flexbox,
- Utiliser les medias queries,
- Utiliser CSS Grid pour faire une grille,
- Animer vos éléments avec TypeWriter, Greensock et ScrollMagic,
- Créer un site de A à Z, tout simplement.
Le code source est disponible avec la formation.
On se donne rendez-vous de l'autre côté !
Table des matières de cette formation CSS, JavaScript, HTML (durée : 3h52m)
-
Introduction
- Introduction gratuit 00:01:20
- Code source gratuit 00:01:42
-
Création du site (HTML / CSS)
- Création du dossier 00:06:52
- Navbar HTML 00:07:28
- Navbar partie CSS 00:10:40
- Navbar images 00:05:40
- Ouverture du menu 00:11:48
- Medias queries et animation de la navbar 00:06:53
- Partie accueil HTML 00:06:18
- Partie accueil CSS 00:11:03
- Medias queries accueil 00:13:39
- Animation JS accueil 00:11:09
- Section présentation HTML 00:05:27
- Section présentation CSS 00:10:27
- Section présentation Medias queries 00:06:24
- Section Portfolio HTML 00:05:02
- Section Portfolio CSS 00:10:44
- Section portfolio Media queries 00:03:17
- Section Range html 00:03:15
- Section Range CSS 00:10:01
- Section range media queries 00:05:00
- Section experience HTML 00:04:24
- Section expérience CSS 00:10:04
- Section expérience media querie 00:04:17
- Section Parallax 00:05:08
- Section contact HTML 00:02:59
- Section Contact CSS 00:10:13
- Animation des inputs 00:09:30
-
Animations JavaScript
- Animation de la page d'acceuil 00:11:04
- Animation Scrollmagic 00:06:41
- Animation du Portfolio 00:06:07
- Animation de la partie Range et fin 00:07:28
- Fichiers sourcestélécharger
- Certificat
Formateur : Enzo Ustariz
-
C'est super Parlée moins vite!!! C'est une bonne idée Merci cordialement
-
Bien mais, un peu trop rapide pour bien suivre les liens entre les différentes feuilles HTML/CSS/JAVASCRIPT .
-
Très bon cours, toute fois je début dans le developpement web et le rythme de parole est très soutenu. Bien que chaque partie est bien détaillé, j'aurai aimé plus de détail sur certain éléments. Je part de ce pas faire la reste de vos cours !
-
Avec quelles versions de logiciels ce tuto est-il compatible ?CSS , JavaScript , HTML
-
Quel est le niveau requis pour suivre ce tuto ?débutant
note moyenne
avis laissés