Formation Bootstrap 4

Logo Formation Bootstrap

1700€

1530€HT/ personne

3 jours (21 heures)

Interentreprises

­Paris

Disponible en intraentreprise pour former votre équipe.

Présentation

Bootstrap est une collection d’outils utile à la création du design (graphisme, animation et interactions avec la page dans le navigateur, etc.) de sites et d’applications web. C’est un ensemble qui contient des codes HTML et CSS, des formulaires, boutons, outils de navigation et autres éléments interactifs, ainsi que des extensions JavaScript en option. Créer par deux développeurs travaillant chez Twitter en 2010, il est devenu open source en 2011 et, un an après, devient l’un des projets les plus populaires sur la plate-forme de gestion de développement GitHub.

Bootstrap 4 est une réécriture majeure de l’ensemble du projet, avec donc des changements incompatibles avec les versions précédentes. Ce qu’il faut retenir de cette nouvelle version, est le changement important au niveau du système de grille, avec le passage à Flexbox. On note une mise à jour des noms de classe de grille, et un nouveau niveau de grille, également la mise à jour des tailles de grilles, des mixins et des variables. Pour les composants, la suppression des panneaux, des vignettes et des puits pour un nouveau composant englobant, appelé cartes. Il y a aussi la suppression de la police d’icône Glyphicons et du composant pager de Bootstrap. Côté support des navigateurs, on note la suppression du support d’Internet Explorer (IE) 8 et 9 et des navigateurs sur iOS 6. Bootstrap 4.0 ne va supporter que IE10+ et iOS 7+. Pour les sites qui ont besoin des versions non supportés, il est nécessaire d’installer la version 3 de Bootstrap.

Comme dans toutes nos formations, celle-ci vous présentera la toute dernière version (Bootstrap v4.x à la date de rédaction de l’article).

 

Objectifs

  • Présenter les différentes fonctionnalités afin de vous permettre de maîtriser Bootstrap 4
  • Être à même d’adapter vous-même le code source de Bootstrap 4
  • Intégrer votre propre design à Bootstrap
  • L’utiliser comme socle fondateur dans vos sites web

 

Public visé

Développeur web, webdesigner et webmaster

 

Pré-requis

Connaissances en HTML

Programme de la formation Bootstrap

Introduction

  • 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

Le système de grille

  • Principe de structuration et d’intégration
  • Le concept de grille
  • L’utilité de Flexbox
  • Mise en forme structurelle et textuelle
  • Templates Bootstrap
  • Organisation de la grille
  • Manipuler les grilles
  • Sass mixins

Les composants HTML et CSS

  • Images responsives
  • 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
  • Cartes
  • 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
Langues et Lieux disponibles

Langues

  • Français
  • Anglais / English

Lieux

  • France entière
    • Paris
    • Lille
    • Reims
    • Lyon
    • Toulouse
    • Bordeaux
    • Montpellier
    • Nice
    • Sophia Antipolis
    • Marseille
    • Aix-en-Provence
    • Nantes
    • Rennes
    • Strasbourg
    • Grenoble
    • Dijon
    • Tours
    • Saint-Étienne
    • Toulon
    • Angers
  • Belgique
    • Bruxelles
    • Liège
  • Suisse
    • Genève
    • Zurich
    • Lausanne
  • Luxembourg

Nos Formateurs Référents

Témoignages

Donnez votre avis ?

Afficher tous les témoignages

Donnez votre avis ?

Noter la formation

1700€

1530€HT/ personne

3 jours (21 heures)

Interentreprises

­Paris

Disponible en intraentreprise pour former votre équipe.

Une question ? Un projet ?

Pour des informations complémentaires, n’hésitez pas à nous contacter.