Back

Le bootstrap

    Bootstrap est un ensemble d’outils gratuits permettant de créer des pages Web et des logiciels.Applications Web comprenant des fonctions HTML, CSS et JavaScript permettant de générer et d’afficher des formulaires, des boutons, des onglets, des colonnes et d’autres éléments nécessaires à la conception Web.

  • Le Bootstrap est un framework développé par l’équipe du réseau social Twitter. Proposé en open source (sous licence MIT), ce framework utilisant les langages HTML, CSS et JavaScript fournit aux développeurs des outils pour créer un site facilement. Ce framework est pensé pour développer des sites avec un design responsive, qui s’adapte à tout type d’écran, et en priorité pour les smartphones.

  • Avec Bootstrap, les développeurs Web peuvent se concentrer sur le travail de développement, sans se soucier de la conception, et obtenir rapidement un site Web de belle apparence. Inversement, il offre aux concepteurs Web une base solide pour la création de thèmes Bootstrap intéressants.
  • Bootstrap est une boîte à outils open source pour le développement avec HTML, CSS et JS. Protégez rapidement vos idées ou construisez votre application entière avec nos variables Sass et mixins, notre système de grille réactif, de nombreux composants prédéfinis et de puissants plug-ins basés sur jQuery.

    • Bootstrap est une boîte à outils puissante – une collection d’outils HTML, CSS et JavaScript permettant de créer et de créer des pages Web et des applications Web. C’est un projet libre et open source, hébergé sur GitHub , et créé à l’origine par (et pour) Twitter .

  • Bootstrap a été crée en 2011 par Mark Otto et Jacob Thornton, deux salariés de l’entreprise Twitter. Son objectif au départ était de Proposer une bibliothèque de composants standard qui permettrait d’accélérer et d’uniformiser le développement des interface coté utilisateur.
  • Cette série de tutoriels Bootstrap est destinée aux professionnels et aux amateurs de développement web. Une bonne connaissance des standards HTML5 et CSS3 est nécessaire et aussi des notions de JavaScript et de jQuery sont utiles.
  • Cette série de tutoriels Bootstrap contient de nombreux exemples illustrant la création d’applications Web intéressantes à l’aide de Bootstrap 4 et la maîtrise du framework front-end.
  • Nous commençons par une introduction au framework Bootstrap et un environnement permettant de créer une page Web simple. Nous couvrons ensuite le système de grille, les composants Bootstrap de base, les éléments HTML et les composants de personnalisation pour un développement réactif et mobile.

    • À la fin de ce cours, vous serez familiarisé avec les bases du développement d’un plug-in pour le framework et le monde Bootstrap, qui est populaire pour le développement rapide de sites Web frontaux.




01- Présentation de bootstrap

  1. Historique de Bootstrap

  2. Présentation de Bootstrap

02- Mise en oeuvre de bootstrap

  1. Installation de Bootstrap

  2. La Syntaxe de base de Bootstrap

  3. Les bases de Bootstrap

      4. Travaux pratiques

      1. TP1 Bootstrap

03- Les grilles Bootstrap

  1. Le système de grille Bootstrap

  2. La grille de Bootstrap en pratique

  3. Alignement avec Bootstrap

  4. Les classes pull et push

    5. Travaux pratiques

    1. TP la grille Bootstrap

    2. Exercices positionnement sur Grille Bootstrap

04- Mise en forme des éléments

  1. Typographie

  2. Les listes Bootstrap

    3. Travaux dirigés

    1. TP3 Bootstrap

05- Les tableaux et boutons

  1. Les tableaux dans Bootstrap

  2. Les boutons standards Bootstrap

  3. Groupe de boutons Bootstrap

    4. Travaux pratiques

    1. TP4 Bootstrap

06- Les images et les objets media

  1. Le composant media Bootstrap

  2. Les images en Bootstrap

    3. Travaux pratiques

    1. TP media Bootstrap

07- Les composants Jumbotron, Cards et Carousels

  1. Les composants Bootstrap

  2. Créer un Jumbotron Bootstrap

  3. Le composant Card

  4. Le composant Carousel Bootstrap

  5. Le composant modal Bootstrap 5

    6. Travaux pratiques

    1. TP les cards Bootstrap

    2. TP les carousels Bootstrap

08- Les composants "Spinners"

  1. Les "Spinners" Bootstrap

09- Les éléments de navigation

  1. Menus de navigation (Navbar)

  2. Drop-Down Menus Bootstrap 4

  3. Les barres d’outils standard Bootstrap

  4. Les onglets Bootstrap

  5. Pagination Bootstrap

  6. Breadcrumb Bootstrap

    7. Travaux pratiques

    1. TP01 Menus de navigation Bootstrap

10- Les formulaires

  1. Les formulaires de base

  2. Contrôles de formulaire pris en charge en Bootstrap

  3. Les formulaires de base

  4. Les formulaires en ligne

  5. Les formulaires horizontal

  6. Validation des formulaires

    7. Travaux pratiques

    1. TP

11- Autres modules

  1. Les Symboles Bootstrap

  2. Progress Bar Bootstrap

  3. Effet accordéon Bootstrap

12- Exercices et TP

Travaux pratiques

  1. TP05 Composants Bootstrap

  2. TP06 Composants Bootstrap

13- Création des projets

  1. TP1 Création de projet 1

  2. TP2 Création de projet 2

  3. TP3 Création de projet 3

  4. TP4 Création d’un projet Bootstrap

  5. TP5 Création d’un projet Bootstrap

  6. TP6 Création d’un projet Bootstrap

  7. TP7 Création d’un projet Bootstrap

Abonnez vous à notre chaîne YouTube gratuitement