Visit card exercise
katbizniss is an educational project, which will be used for HTML courses.
Note: the school where the course is given, the HEPL from Liège, Belgium, is a french-speaking school. From this point, the instruction will be in french. Sorry.
Pour faire tourner gulp, vous avez d'abord besoin d'installer ses dépendances. Pour cela, il vous suffit de lancer la commande yarn install dans votre projet, qui se chargera alors de regarder les dépendances listées dans le fichier package.json et de les installer pour vous.
Tout nos fichiers se trouvent dans le dossier src/ (bien rangés dans des sous-dossiers). Tels qu'ils sont là, vous ne pouvez rien en faire : il faut les compiler avant de pouvoir les utiliser dans un navigateur.
Pour ça, nous allons utiliser gulp, un task-runner dont le boulot est de lancer des tâches qui vont transformer des fichiers (entre autres choses).
La configuration de ces tâches se fait dans le fichier gulpfile.js. Pour lancer une tâche, il suffit de lancer la commande gulp NOM_DE_LA_TACHE dans votre projet.
Chaque tâche va récupérer des fichiers dans le dossier src, leur appliquer un traitement et sauvegarder le résultat dans le dossier assets.
Nous en avons créé cinq, ainsi que deux alias (des tâches qui en appellent d'autres).
- images : compresse et optimise nos images
- html : compile nos fichiers pug en html (minifié)
- css : compile nos fichiers scss en css (auto-prexifié et minifié)
- js : compile nos fichiers js (ES2015) en js (minifié)