Formation Bootstrap

Consevoir des pages responsive avec Bootstrap

  • Présenter les différentes fonctionnalités afin de vous permettre de maîtriser Bootstrap 3

  • Être à même d’adapter vous-même le code source de Bootstrap 3

  • Intégrer votre propre design à Bootstrap

  • L’utiliser comme socle fondateur dans vos sites web

Avoir des connaissances en HTML

Avoir suivie la formation HTML, CSS, Javascript (HTCSJ) est un plus


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éos 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 Nodejs

Les nouveautés de Bootstrap 4

L’utilité des flexbox