Utilisation des outils de développement
Objectifs
Les objectifs de cette vidéo sont:
- Comprendre comment télécharger et utiliser Bootstrap correctement.
- Tester le Responsive Design avec les plugins adaptés pour différents navigateurs.
- Utiliser l'Inspecteur d'éléments pour analyser et éditer le code HTML et CSS.
- Choisir un IDE pour coder efficacement.
Résumé
Découvrez les outils essentiels pour utiliser Bootstrap et tester le Responsive Design.
Description
Pour suivre cette formation, nous utiliserons plusieurs outils:
1. Visitez getbootstrap.com pour télécharger les sources de la version 3.3.1 de Bootstrap. Faites attention à ne pas confondre avec des versions plus anciennes.
2. Installez le plugin Viewport Resizer pour Chrome afin de tester le Responsive Design directement dans votre navigateur sans avoir à recharger la page constamment.
3. Pour les utilisateurs de Firefox, le mode Vue Adaptative est intégré et accessible via Outils > Développement Web > Vue Adaptative ou par le raccourci Command-Alt-M.
4. Utilisez l'outil Inspecteur d'éléments pour examiner le code HTML et les styles CSS appliqués à chaque élément de la page, que ce soit sur Chrome ou Firefox.
5. Le développement se fera dans un IDE comme phpStorm. Les alternatives incluent Sublime, TextMate, ou tout simplement le Bloc-notes.
Questions fréquentes
Programme détaillé
Module 1 - Introduction
Module 2 - Explication de la grille
Module 3 - Mettre du style
Module 4 - Utiliser les composants prêt à l’emploi
Module 5 - Utiliser les composants JavaScript
on parle de jquery alors que dans la version il n'y est plus
on nous parle de phpstorm comme editeur qui est payant voir lez bloc note (au secours !!!)
il y a vscode qui maintenant est utiliser par quasi tous les développeurs et qui est gratuit.
sur la video : Maîtriser les Grilles et Colonnes dans Bootstrap
1 - le cours annonce la modification pour passer sur 4 colonne puis de changer les titres,
a ce moment la on reviens en arrière à la modification pour passer en 4 colonnes... et ça recommence
grosse erreur de montage.
2 - ensuite push et pull ont été supprimé pour utiliser le système flexbox sur la version 5
avec les classes order pour gérer l'ordre des colonnes.
3 - l'explication sur le offset n'est absolument pas claire :
on a une première explication, puis une deuxième qui est la même mais avec le résultat directe avec offset.
bref je vais être franc j'ai trouver une formation sur udemy sur bootstrap 5 bien plus intéressante, je ne trouve pas normal d'avoir une formation sur bootstrap 3 qui nous induit en erreur.
ayant passer ce premier chapitre j’arrête car je ne vois aucun intérêt à continuer.