Le cours Bootstrap 5 est là !
Bootstrap est le Framework CSS le plus populaire du web. Il est autant utilisé au niveau perso qu'en entreprise. En tant que développeur, maîtriser Bootstrap est donc une bonne corde à avoir dans son arc.
Sachant qu'il est relativement simple à prendre en main, ce serait bête de se priver d'une compétence rapide à acquérir.
Avant de voir de quoi est composé Bootstrap, définissons le mot "Framework". Un cadre de travail est un environnement qui va proposer des règles, des méthodes et des façons de faire qui lui sont propres, afin de structurer la réalisation d'un projet web. Le fait de suivre des règles préétablies permet de gagner du temps sur beaucoup de points, et a aussi l'avantage de rendre le code plus maintenable ainsi que de faciliter son évolution dans le temps.
Le "cadre" de Bootstrap, c'est :
- Des classes utilitaires pour rapidement styliser un site.
- Un système de grille pour le rendre réactif(responsive).
- Des composants préconstruits pour gagner du temps.
- Une possibilité de personnaliser "à sa sauce" tout ce qui a été dit au-dessus.
Lorsqu'on aura bien étudié tout ça, on passera à la création de deux projets pratiques : la création d'une landing page et la création d'un site web.
Avec ce cours en ligne, vous aurez accès au code source et vous pourrez le réutiliser comme bon vous semble.
Je reste disponible dans le salon d'entraide pour répondre à vos questions pendant votre formation.
Rendez-vous de l'autre côté pour commencer à coder !
Table des matières de cette formation Bootstrap, CSS (durée : 5h25m)
-
Introduction Bootstrap v5
- Introduction gratuit 00:04:32
- Code source et conseils gratuit 00:03:45
-
Les classes utilitaires
- Les couleurs gratuit 00:10:53
- La Typographie 1 00:07:54
- La Typographie 2 00:03:42
- Tailles et espacement 00:08:05
- Display et positions 00:05:06
-
Disposition
- Le système de grille I 00:09:58
- Le système de grille II 00:05:24
- Le placement des colonnes 00:05:08
- Les gouttières 00:05:17
- Flexbox 00:07:04
-
Composants sans JS
- Images et tableaux 00:03:20
- Les boutons 00:07:46
- Les cartes 00:06:39
- Breadcrumb et simple navigation 00:03:30
- Les listes 00:02:27
- Progress bar et spinners 00:06:08
-
Formulaires
- Les formulaires de base 00:05:08
- Styliser les inputs 00:02:40
- Divers 00:04:45
- La Validation 00:03:07
-
Composants avec JS
- Le Carousel 00:05:04
- Dropdown et accordéon 00:05:03
- Modale et alerte 00:03:29
- Navbar 00:05:36
- Menu rideau 00:02:11
- Tooltip et popover 00:02:19
-
Personnalisation
- Personnalisation installation 00:12:27
- Créer une palette 00:10:10
- Utilities 00:05:25
- Composants et segmentation 00:09:35
- La purge 00:05:05
-
Création de la Landing Page
- Accueil 00:13:14
- Services 00:06:21
- Section grandes cartes 00:06:50
- Section "striped" 00:02:25
- Section "projets" 00:06:22
- Section "Pricing" 00:05:17
- Section parallax 00:02:50
- Form et footer 00:09:13
-
Création du site "Restaurant Japonais"
- Configuration du second site 00:05:33
- Palette 00:05:57
- Page d'accueil 00:11:32
- Section nourriture 00:05:44
- Section chefs 00:12:52
- Mosaîque et footer 00:09:54
- Menu et accordeon 00:11:39
- Personaliser l'accordéon 00:02:48
- Page reservation 00:10:01
- Purger le CSS 00:07:51
- Fichiers sourcestélécharger
- Certificat
Formateur : Enzo Ustariz
-
Si j'ai eu un souci avec la personnalisation, j'ai trouvé malgré tout ce tuto très bien.
-
Au fur et à mesure de la progression dans l'enseignement, on se rend compte de la qualité de celui-ci. Cependant, certain points restent obscurs et il est nécessaire de maniper pour les éclaircir ... Très bon tuto .
-
Trés bon pas à pas, avec de la pratique; super pour bien retenir.
-
Avec quelle version de logiciel ce tuto est-il compatible ?Bootstrap 5
-
Quel est le niveau requis pour suivre ce tuto ?débutant
note moyenne
avis laissés