Présentation de la formation Bootstrap
Apprenez à créer des sites web réactifs et modernes avec notre formation Bootstrap de 3 jours. Découvrez les composants essentiels, la grille responsive, et les techniques de personnalisation pour adapter Bootstrap à vos projets. À travers des ateliers pratiques et des exercices concrets, vous développerez des compétences en design web efficaces et actuelles. Nos formateurs expérimentés vous guideront pour optimiser l'ergonomie et l'esthétique de vos sites. Rejoignez notre formation pour maîtriser Bootstrap et améliorer vos projets web rapidement !
Objectifs de la formation Bootstrap
Objectifs pédagogiques :
- Présenter les différentes fonctionnalités afin de vous permettre de maîtriser Bootstrap
- Adapter vous-même le code source de Bootstrap
- Intégrer votre propre design à Bootstrap
- L’utiliser comme socle fondateur dans vos sites web
Objectifs opérationnels :
- Créer des pages web responsive
Programme de la formation Bootstrap
Introduction à Bootstrap
Evolution des technologies web
Vue d’ensemble sur Bootstrap
Concurrents et alternatives
Mise en place de Bootstrap dans son projet
Arborescence des fichiers : feuille de style, JavaScript, Fonts…
Optimisation et customisation des modules
Glyphicons
Le système de grille
Principe de structuration et d’intégration
Le concept de grille
Vers des grilles fluides et adaptives
Mise en forme structurelle et textuelle
Templates Bootstrap
Les grilles adaptatives (le Responsive Web Design, Media Queries, positionnement…)
Organisation de la grille
Manipuler les grilles
Créer une page multigrille
Les grilles statiques et élastiques
Les composants HTML ET CSS
Images reponsives
Lecteurs vidéo et audios personnalisés
Boutons et groupe de boutons
Navigation
Pagination : contenus longs
Breadcrumb (fil d’Ariane)
Boutons, Badge et Alertes
Barre de progression
Tableaux et liste d’éléments
Vignettes et medias
Intégrer du CSS3 personnalisé dans votre projet
Les composants JavaScript et JQuery
API Bootstrap
Boîtes modales, Popover…
Menus déroulants
Scrollspy
Tabulations
Caroussel de photos, accordéons
Plugin-ins externes (Calendar, Clip-One…)
Le pré-processeur SASS
Qu’est-ce qu’un pré-processeur ?
Avantages de SASS
Variables et mixins
Extends & placeholder, les différences
Fonctions internes
Compass & bourbon, des frameworks pour SASS
Mise en place de l’environnement Gulp
Ateliers
Intégration d’une maquette pour un site full responsive
Mise en place de Bootstrap avec npm et bower
Déploiement du projet
Bootstrap avancé
Créer un site avec un des modèles
Créer une page à partir d’un modèle en surchargeant le fichier CSS
Utiliser des fichiers LESS avec un préprocesseur et un serveur Node.js
Les nouveautés de Bootstrap 5.3
L’utilité des flexbox