Logo entreprise

Non finançable CPF
Formation Découverte des frameworks CSS : Bootstrap et Tailwind

Coût de la formation
2360.00€
Durée totale
Localisation
A distance 100% en ligne
Profils acceptés
Tout public
Certifications
OPQF, Qualiopi

Connaissances nécessaires

Connaissances HTML5/CSS3/RWD

Objectifs de la formation

Découvrir Boostrap - Manipuler des classes Bootstrap avec Javascript - Installer et Utiliser Tailwind - Créer une architecture modulaire de Tailwind - Utiliser Tailwind UI et ses composants

Programme et détails du déroulé de la formation

Programme de Formation Découverte des frameworks CSS : Bootstrap et Tailwind

Rappels sur le responsive web design et CSS

Viewport et Media queries

Block, inline et autres display

Grid et Flex

Le nesting

Atelier : Création d'une page complexe en CSS3Utiliser Boostrap, les Structures et Breakpoints

Composition Bootstrap : container, row et col

Les breakpoints

Composition HTML et bootstrap

Les Positions

Atelier : Modification de page et agencement responsive sur différent formatUtiliser les composents Bootstrap

Formulaires

Images

Card

Navbars

Atelier : Création de formulaire et réarrangement de la pagePersonnaliser avec SCSS

Présentation du SCSS

Créations des variables SCSS

Mixins

@include

Atelier : Révision et customisation des couleurs et dimensions standards de BootstrapManipuler des classes Bootstrap avec Javascript

Intégrer Bootstrap en JS

Prendre en charge et modification des composant en JS

Atelier : Ajout et manipulation d'élément Bootstrap en JSInstaller et Utiliser Tailwind

Présentation de Tailwind

Intégration via NPM

Inclusion dans un projet

Atelier : Création d'un projet one-page en TailwindCréer des interfaces avec Tailwind

Syntaxe de Tailwind

Intégration HTML

Boostrap VS Tailwind

Atelier : Création d'interface utilisateur riche et responsive avec TailwindCréer une architecture modulaire de Tailwind

Création de module

l'outil @apply

L'extraction sous Tailwind

Atelier : Création de carte complexe sous la forme de moduleUtiliser Tailwind UI et ses composants

Bibliothèque de composant Tailwind

Composants de présentation

Composants de navigation

Composants de formulaire

Atelier : Ajout d'élément sur le projet one-pageUtiliser Tailwind UI avec Javascript

Tailwind et les frameworks js

Intégration de tailwind en JS

Atelier : Création d'un jeu FizzBuzz en mise en page avec Tailwin