Introduction
Explication de la grille
Mettre du style
Utiliser les composants prêt à l’emploi
Utiliser les composants JavaScript
Détails de la leçon
Description de la leçon
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.
Objectifs de cette leçon
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.
Prérequis pour cette leçon
Les prérequis pour suivre cette vidéo sont:
- Connaissances de base en HTML et CSS.
- Notions de développement web.
Métiers concernés
Cette vidéo est particulièrement utile pour les:
- Développeurs front-end.
- Concepteurs web.
- Testeurs d'interface utilisateur.
Alternatives et ressources
Les alternatives aux logiciels et outils mentionnés sont:
- Visual Studio Code comme alternative à phpStorm.
- Firebug pour des fonctionnalités similaires à l'inspecteur d'éléments.
- D'autres extensions pour tester le Responsive Design comme Responsive Web Design Tester.
Questions & Réponses
Je m'abonne