Formations courtes

Bootstrap : styles, composants et WebApp responsive

Initiation
3 jours (21 heures)
Paris
Habiller rapidement des pages Web et des WebApps

Objectifs

Pour qui ?

Prérequis

Objectifs

Définir le rôle de Bootstrap 4
Réaliser des mises en pages responsive
Maîtriser les styles génériques de Bootstrap 4
Utiliser les composants Bootstrap 4
Créer et personnaliser une application Web avec Bootstrap 4

Pour qui ?

Intégrateurs, webdesigners et développeurs.


Code dokélio :

Prérequis

Il est nécessaire de maîtriser le HTML et d'avoir des notions de CSS. La connaissance de JavaScript n'est pas requise (les notions de base sont rappelées) mais facilitera l'accès à cette formation.



Compétences acquises:
Habiller rapidement des pages Web et des WebApps

Programme

Bootstrap : styles, composants et WebApp responsive

Définir le rôle de Bootstrap
• Connaître les bases de HTML5 et CSS3
• Maîtriser la notion de responsive design avec les Media Queries
• Comprendre le rôle d'une bibliothèque CSS
• Comprendre le rôle de Bootstrap et ses avantages
• Savoir récupérer et installer Bootstrap dans ses projets
• Connaître le support des navigateurs et la compatibilité
➔ Étude de cas : analyse de pages réalisées avec Bootstrap et recommandation de sites

Réaliser des mises en pages responsive

• Comprendre la notion de “Mobile First”
• Maîtriser le système de grille de Bootstrap
• Savoir gérer les options et la taille des écrans
• Savoir mélanger mobile, tablette et desktop
• Maîtriser le décalage et l'imbrication des colonnes
➔ Exercice : création de pages responsive

Maîtriser les styles génériques de Bootstrap

• Maîtriser la typographie : titres, listes, alignements, effets graphiques…
• Mettre en pages des formulaires : form-group, inline…
• Décorer efficacement ses formulaires : input, textarea, checkboxes…
• Enrichir ses formulaires avec des effets CSS sur les inputs, les icônes
• Tout savoir sur les boutons : options, couleur, taille et états
• Insérer des images responsive
➔ Exercice : création et personnalisation de formulaires responsive

Utiliser les composants Bootstrap

• Informer avec les icônes
• Gérer des choix avec le menu déroulant et le groupe de boutons
• Organiser la navigation avec le composant navbar
• Se repérer avec les composants pagination et breadcrumbs (fi l d'Ariane)
• Informer avec les composants labels, badges et jumbotron
• Accompagner l'utilisateur avec les alertes et la barre de progression
• Structurer ses pages avec les panels, les groupes de listes et les wells
➔ Exercice : tester les composants dans une mini WebApp

Créer et personnaliser une application Web avec Bootstrap

• Personnaliser Bootstrap
• Créer sa propre version personnalisée en ligne
• Compiler ses fichiers .less en .css
➔ Exercice : créer une WebApp sur la base d'un wireframe imposé
Bootstrap : styles, composants et WebApp responsive
Ref
WM08819
Tarif
1700€ HT

Prochaines sessions

Le choix de la session vous sera demandé lors de votre inscription.

Paris
Prochaines sessions
02 au 04 déc. 2019
02-12-2019
04-12-2019
Cette formation vous intéresse ?