> formation Technologies numériques > formation Technologies Web > formation Développement Front-End > formation Bootstrap, développer des pages Web Responsive

Avis loadedNote : 4,1Length : 4TotalNote : 65TotalNote20 : 1
Toutes nos formations Développement Front-End

Formation Bootstrap, développer des pages Web Responsive

4,1 / 5
Stage pratique
Durée : 2 jours
Réf : BOP
Prix  2021 : 1510 € H.T.
Pauses et déjeuners offerts
  • Programme
  • Participants / Prérequis
  • Intra / sur-mesure
  • avis clients
Programme

Le framework Bootstrap, créé par les développeurs de Twitter, est devenu un framework CSS et Javascript de référence dans la conception de sites Web. Vous apprendrez à habiller vos pages et à les enrichir de composants interactifs avec Bootstrap afin de rendre vos sites attractifs et adaptatifs.

Objectifs pédagogiques

À l’issue de la formation, le participant sera en mesure de :
  • Intégrer Bootstrap dans un projet Web
  • Réaliser des pages Web reprenant les codes esthétiques des sites actuels
  • Maîtriser les composants et les plug-ins du framework Bootstrap
  • Développer des sites Web responsive

Travaux pratiques

Réalisation d'une interface administrateur back-office avec Bootstrap. Création d'un site Web Responsive depuis un modèle Bootstrap.

Méthodes pédagogiques

50% d'exposé, 50% de pratique.
PROGRAMME DE FORMATION

Présentation du framework

  • Vue d'ensemble du framework Bootstrap.
  • L'apport de Bootstrap par rapport à CSS.
  • Les éléments du kit Bootstrap (grilles, Normalize.css, icônes, plug-ins jQuery...).
  • Comprendre l'arborescence des différents fichiers : feuilles de style, JavaScript...
  • Lier une page Web à la feuille de style de base de Bootstrap.

Travaux pratiques
Installation de Bootstrap. Habiller une page HTML avec Bootstrap.

Les feuilles de style de Bootstrap

  • Les CSS pour les éléments textuels et les images.
  • Les CSS pour les éléments de formulaires et les tableaux.
  • Utilisation des polices icônes pour afficher des icônes sur les pages.
  • Les CSS pour la mise en page, les blocs de texte.
  • Personnaliser sa feuille de style.

Travaux pratiques
Styler les différents éléments constituant une page Web avec les CSS de Bootstrap. Personnaliser le style de certains éléments de la page.

Les grilles

  • Comprendre le concept de grille.
  • Les grilles adaptatives (le Responsive Web Design, Media Queries, positionnement...).
  • Organisation de la grille. Manipuler les grilles.
  • Flexbox dans Bootstrap.
  • Disposition des colonnes.
  • L'ordre des blocks.

Travaux pratiques
Créer une page Web responsive basée sur une grille.

Les composants de base

  • Les deux fichiers JavaScript nécessaires.
  • Les marges de chaque block.
  • Les menus responsives améliorés.
  • Les composants de navigation et de pagination.
  • Les boutons, les badges, les alertes.
  • Les barres de progression.
  • Les tableaux, les listes d'éléments.

Travaux pratiques
Conception d'une page Web pour un site Internet ou intranet intégrant plusieurs composants Bootstrap.

Les plug-ins jQuery de Bootstrap

  • Les fenêtres modales. Les accordéons. Le carrousel de photos.
  • La barre de navigation. Les onglets. Les menus déroulants.
  • Les champs d'auto-complétion.
  • Intégration de plug-ins externes (Datepicker...).
  • Les cards conteneurs flexibles et extensibles.

Travaux pratiques
Intégrer des effets visuels modernes par le biais de plug-ins jQuery associés à la librairie Bootstrap.

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.
  • Utiliser des fichiers SAAS avec un préprocesseur et/ou un serveur NodeJS.

Travaux pratiques
Créer son propre Bootstrap.css.

Participants / Prérequis

» Participants

Webmasters, développeurs et intégrateurs.

» Prérequis

Connaître HTML et CSS et avoir des notions de JavaScript.
Intra / sur-mesure

Demande de devis intra-entreprise
(réponse sous 48h)

Vos coordonnées

En cochant cette case, j’atteste avoir lu et accepté les conditions liées à l’usage de mes données dans le cadre de la réglementation sur la protection des données à caractère personnel (RGPD).
Vous pouvez à tout moment modifier l’usage de vos données et exercer vos droits en envoyant un email à l’adresse rgpd@orsys.fr
En cochant cette case, j’accepte de recevoir les communications à vocation commerciale et promotionnelle de la part d’ORSYS Formation*
Vous pouvez à tout moment vous désinscrire en utilisant le lien de désabonnement inclus dans nos communications.
* Les participants inscrits à nos sessions de formation sont également susceptibles de recevoir nos communications avec la possibilité de se désabonner à tout moment.
Avis clients
picto avis clients
DORIAN Z. 22/09/2021
4 / 5
Le cours est bien tenu avec un bon rythme, mais les exercices sont un peu long pour le peu qu’on voit dedans.

FLOHIC YVAN L. 22/09/2021
4 / 5
Souci de la gestion entre la théorie et la pratique. Expliquer les différents éléments puis compléter un code avec l’(les) élément(s) vu(s) précédemment aurait pu être plus intéressant dans la pédagogie. Là on a recopié du code, certes expliqué par le formateur, mais du coup on voit beaucoup d’éléments d’un coup.

JEROME R. 03/05/2021
4 / 5
Formation trop pointue pour des profils novices.

STÉPHANE L. 22/03/2021
5 / 5
Très bons exemples permettant de cibler rapidement les élèments
Avis clients 4,1 / 5

Les avis clients sont issus des feuilles d’évaluation de fin de formation. La note est calculée à partir de l’ensemble des avis datant de moins de 12 mois.

CLASSE A DISTANCE

En inter et en intra-entreprise
Inscrivez-vous ou contactez-nous !

Pour vous inscrire

Cliquez sur la ville, puis sur la date de votre choix.
[+]
CLASSE A DISTANCE
[+]
PARIS

Horaires

Les cours ont lieu de 9h à 12h30 et de 14h à 17h30.
Les participants sont accueillis à partir de 8h45.
Pour les stages pratiques de 4 ou 5 jours, les sessions se terminent à 15h30 le dernier jour.