Accueil > Développement Logiciel, Devops > Bootstrap 4 : Système de grille
Formation #DEV203

Formation Bootstrap 4 : Système de grille

Formation avec Restauration incluse
(Déjeuner, Petit Déjeuner et Pauses Cafés)

Durée : 3 jours

Code : DEV203


Sessions programmées :

Du 06 au 08 Jan. 2021

Du 10 au 12 Mars 2021

Du 19 au 21 Mai 2021

Du 21 au 23 Juil. 2021

Du 20 au 22 Oct. 2021

Du 22 au 24 Déc. 2021

Fin d'Inscription :
Le Bulletin d'Inscription doit être rempli, cacheté, signé et envoyé par email :
  • Pour les entreprises AU MAROC :
    Au minimum 10 JOURS OUVRÉS avant la date de formation
  • Pour les entreprises HORS MAROC :
    Au minimum 15 JOURS OUVRÉS avant la date de formation

Formation dans votre entreprise.

Durée : 3 jours

Code : DEV203


Vous souhaitez réaliser cette formation en vos locaux avec le même programme ?

Vous souhaitez personnaliser le programme de cette formation pour qu'elle réponde aux spécificités de votre entreprise ?

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 grâce Bootstrap
  • L’utiliser comme socle fondateur dans vos sites web
Programme
1/ Présentation du framework
  • Qu’est-ce qu’un framework CSS ?
  • Évolution des technologies web : rappels sur HTML5 / CSS3
  • Les alternatives à bootstrap
  • Pourquoi utiliser bootstrap ?
  • Vue d'ensemble du framework Bootstrap
  • L'apport de Bootstrap par rapport à CSS
  • Vocabulaire Bootstrap
  • L'arborescence des fichiers Bootstrap 3 et Bootstrap 4
  • Différences en Bootstrap 3 et Bootstrap 4
  • Lier une page aux feuillles de style Bootstrap
2/ Mise en place de Bootstrap
  • Installation locale ou par Content Delivery Network
  • Comprendre les relations entre Bootstrap, CSS et JavaScript
3/ Mise en page avec la grille
  • Principe de structuration et d’intégration
  • Faire une mise en pages responsive
  • Passage en revue des responsive breakpoints (différentes tailles d’écran)
  • Du pixel au root em (rem)
  • Mise en place de la grille
  • Container, Row, Columns
  • Utilisation de Flexbox avec la grille Bootstrap
4/ Les contenus HTML et CSS
  • Titres, et mise en pages du texte
  • Les Images responsives
  • Tableaux et liste d’éléments
  • Surcharger les styles au profit de ceux développés
5/ Les composants HTML et CSS
  • Menus de navigation
  • Breadcrumb ou fil d’Ariane
  • Medias objects
  • Cards
  • Les listes
  • Boutons, groupes de boutons et boutons déroulants
  • Pagination
  • Formulaires et Inputs
  • Les alertes
  • Un peu de déco : les badges, les spinners
  • Jumbotron
  • Lecteurs vidéos et audios personnalisés
  • Intégrer du CSS personnalisé dans votre projet
6/ Utiliser Bootstrap avec JavaScript et jQuery
  • Carrousels de photos, accordéons
  • Collapse elements
  • Modals ou Boîtes modales
  • Popovers
  • Progress ou Barre de progression
  • Scrollspy
  • Toasts
  • Tooltips
  • Menus déroulants intelligents
  • Onglets
  • Tabulations
7/ Les utilities
  • Utilities layout, flexbox , float, clearfix, position, visibilité & display
  • Utilities borders
  • Utilities overflow
  • Utilities couleurs
  • Utilities shadow
  • Utilities sizing & spacing
  • Utilities textes
  • Utilities alignement
8/ Analyse des modèles Bootstrap
  • Analyser des modèles construits à partir de Bootstrap
  • Créer un site avec un des modèles
  • Créer une page à partir d'un modèle en surchargeant le fichier CSS
9/ Le pré-processeur Sass
  • Qu’est-ce qu’un pré-processeur ?
  • Avantages de Sass
  • Sass et Bootstrap 4
  • Variables et mixins
Approche Pédagogique

Approche Pédagogique

  • Pédagogie très opérationnelle fondée sur l'alternance entre théorie et pratique
  • Cas pratiques
  • Remise d’outils
  • Echanges d’expériences
Public Cible

Personnes Visées

  • Webmasters
  • Développeurs
  • Intégrateurs
Dates

Dates

  • Du 06 au 08 Jan. 2021
  • Du 10 au 12 Mars 2021
  • Du 19 au 21 Mai 2021
  • Du 21 au 23 Juil. 2021
  • Du 20 au 22 Oct. 2021
  • Du 22 au 24 Déc. 2021
  • Fin d'Inscription :
    Le Bulletin d'Inscription doit être rempli, cacheté, signé et envoyé par email :
    • Pour les entreprises AU MAROC : Au minimum 10 JOURS OUVRÉS avant la date de formation
    • Pour les entreprises HORS MAROC : Au minimum 15 JOURS OUVRÉS avant la date de formation