Journée 1:
Introduction
- Les avantages de SASS
- Qu’est-ce qu’un préprocesseur CSS ?
- Simplifiez votre code !
- Rappel CSS
Logiciels pour développer, de quoi a-t'on besoin ?
- Présentation de l'éditeur de code que nous allons utiliser durant la formation.
- Installation du logiciel et des plug'in utiles.
Installer SASS
- Télécharger SASS
- Créer un projet SASS
- Compilation automatique à partir du style.scss
- Test de ma première compilation
Travaux pratique: Installation de SASS et mise en place de notre base de travailler pour développer notre premier projet.
Découverte des commandes SASS
- Les variables
- Le Nesting
- Le sélecteur d'imbrication &
- Les propriétés imbriqués
- Les feuilles de styles Partials
- Les extensions de classes
- Les opérateurs mathématiques
- Les mixins
- Placeholder
- Import
- Les commentaires
Travaux pratique: Essai des différentes commandes et mise en place d’un projet.
Compilation
- Choisir le type de sortie du fichier (normal, compressé …)
- Bonnes pratiques
Journée 2:
Le framework Compass
- Introduction
- Les avantages
Installer Compass
- Télécharger Compass
- Créer un projet Compass
- Compilation
Mixins
- Qu’est-ce qu’une mixins
- Découvertes des différentes mixins
- Mise en place des mixins de Compass
Les sprites
- Principe de base
- Configuration
- Préparation des images (:link, :hover …)
- Obtenir un fichier unique pour stocker toutes les images
- Génération du code css automatiquement
Travaux pratique: Mise en place d’un projet avec Compass pour utiliser les mixins et les sprites.
Rédiger un avis public