Dreamweaver CC 2017/2018 : Les nouveautés

Réaliser les opérations de base avec un dépôt local

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Dans cette vidéo, vous allez découvrir comment utiliser les fonctionnalités de base de Git dans Dreamweaver CC 2017.

Transcription

Maintenant que Git a été initialisé dans notre nouveau projet, nous allons explorer les opérations Git de base avec Dreamweaver. Donc pour ça, je vais dans mon panneau « Fichiers » créer un nouveau fichier. Donc voilà, clic droit, « Nouveau fichier » que je vais appeler « index.html ». Constatez dans mon panneau « Fichiers » que le nom de ce fichier est écrit en vert. Ça signifie que pour le moment, le fichier n'est pas suivi par le système Git. Alors, faites attention, il est écrit en vert, mais dans la vue Git uniquement. C'est-à-dire que si vous repassez ici dans la vue fichier classique, le nom de ce fichier, vous le voyez, est écrit en blanc comme d'habitude. Donc, je repasse dans la vue Git et le fichier est en vert. Ce fichier, si je veux l'ajouter au système Git, eh bien, je dois le faire passer dans cette zone de transit, dont on a déjà parlé plus tôt dans ce chapitre. Pour le faire passer dans la zone de transit, je vais faire un clic droit sur ce fichier, et dans le nouveau menu Git qu'il y a ici, vous voyez que je peux préparer ce fichier. C'est comme ça qu'on a traduit ici l'opération de « git add », cette opération qui permet de faire passer un fichier de la zone de travail vers la zone de transit. Remarquez que je peux soit « Préparer », soit « Tout préparer », et c'est ce que je vais faire ici, puisque n'oublions pas qu'il y a également le fichier « gitignore » qui est en vert également, qui a été créé automatiquement par Git, et qui n'est pas suivi pour le moment par le système Git. Donc, je vais tout préparer. Alors, ces deux fichiers sont toujours en vert, mais il y a un petit « v », une petite coche qui est venue se mettre ici devant ces fichiers, sur l'icône, et cette petite coche m'indique que ces fichiers sont pour le moment dans la zone de transit de mon dépôt Git. Je vais ouvrir maintenant « index.html » et je vais lui donner une petite modification. Donc, ici dans ma balise « body », je vais par exemple écrire un élément « h1 », avec un titre donc de niveau 1. « Bienvenue sur mon nouveau projet. » Voilà donc pour mon titre. Je vais sauvegarder ce fichier « index.html », et regardez ce qui va se passer. Ce qui va se passer dans mon panneau « Fichiers », c'est que le fichier est toujours en vert, mais la petite coche a disparu. En effet, la modification que je viens d'apporter, eh bien, quelque part, a retiré ce fichier de la zone de transit, puisqu'il y a eu des modifications, donc, il est dans ma zone de travail de nouveau. Je vais replacer ce fichier dans ma zone de transit. Pour ça, clic droit, « Git Préparer ». Remarquez que j'ai une option supplémentaire, je peux annuler la préparation de tous les fichiers. Ça veut dire les faire repasser de la zone de transit vers la zone de travail. Je ne vais pas faire ça ici, je vais préparer mon fichier, donc remettre la petite coche. Et donc, rappelez-vous qu'il y a également dans Git une troisième zone, qui est le dépôt Git, et donc, pour faire passer mes fichiers de ma zone de transit vers le dépôt Git, j'ai besoin d'un « git commit ». Je vais donc maintenant « commiter » ces fichiers dans mon dépôt, clic droit, « Git », et là j'ai cette option, « Valider les fichiers préparés ». C'est comme ça qu'on a traduit « git commit » dans la version française de Dreamweaver. Donc, je vais valider les fichiers préparés, et j'arrive sur cette boîte de dialogue qui s'appelle « Git Commit », qui me liste les fichiers actuellement dans la zone de transit, les fichiers préparés qui sont donc prêts à être « commités ». Alors attention, vous êtes obligé d'inscrire un message de « commit », et je vais donc inscrire ce message ici, dans la petite zone qui se trouve dans le fond. Donc, je vais mettre par exemple « Commit initial du fichier... ...index.html », voilà comme ceci. Et je valide mon message de « commit ». Mes deux fichiers sont « commités », ils sont dans le dépôt Git, ils sont suivis par Git. Alors, je vais continuer le développement de mon projet. Doncn je vais créer un nouveau dossier que je vais appeler « css » par exemple. Là-dedans, j'ai besoin d'un nouveau fichier, que je vais appeler « styles.css ». Alors, il s'agit d'un nouveau fichier, donc il n'est pas suivi par Git, donc il est en vert. Je vais maintenant dans mon fichier « index.html » apporter une petite modification. Je vais lier ce fichier à ma feuille de style. Donc, j'ai besoin d'une balise « link », et j'ai besoin de lier ça dans le dossier « css » à « styles.css ». Regardez ce qui va se passer quand je vais sauvegarder « index.html ». Voilà, il y a deux choses qui se passent. D'abord, au niveau du panneau des fichiers, vous voyez que le nom « index.html » est maintenant écrit en orange. Alors, ça signifie que le fichier est suivi par le système Git, mais qu'il y a eu une modification depuis le dernier « commit ». Autre chose à remarquer, c'est ce petit indicateur vert qui se trouve ici et qui est placé en face de la ligne qui a été ajoutée au code. Alors, je vais faire une autre modification, « Bienvenue sur mon tout nouveau projet », comme ceci. Je sauvegarde « index.html », et là regardez, un nouvel indicateur apparaît, un indicateur orange qui m'indique la ligne dans laquelle il y a eu une modification depuis le dernier « commit ». Donc, ces modifications que je viens d'apporter à « index.html », ainsi que « styles.css » que je viens de créer, sont pour le moment dans ma zone de travail. Je vais les faire passer dans ma zone de transit grâce à un « git add ». Alors, vous connaissez déjà la technique du clic droit, « Git Préparer », qu'on a déjà vue plus tôt dans cette vidéo. Je vais vous en montrer une autre. Donc, dans le menu « Fenêtre », on a maintenant accès à un tout nouveau panneau Git. Le voici, il apparaît dans le fond de la page, par défaut. Je vais le mettre au milieu pour que vous puissiez bien le voir. Voici donc la liste des fichiers qui ont été modifiés ou ajoutés depuis le dernier « commit ». Je vais les préparer. Pour ça, il suffit de cocher cette petite case. J'ai préparé ces deux fichiers. Ils sont donc maintenant dans la zone de transit. Il ne me reste plus qu'à les « commiter », c'est-à-dire les faire passer dans le dépôt. Et pour ça, j'ai cette première icône qui se trouve ici qui me permet de valider les fichiers préparés. Ils sont deux, « styles.css » et « index », donc je vais ici mettre mon message de « commit ». « Ajout de la feuille de styles CSS », je valide mon message de « commit », et vous voyez qu'il n'y a plus rien à valider, le répertoire de travail est propre. Ça veut dire qu'il est identique au fichier actuellement « commité » dans mon dépôt Git. Je vais fermer mon panneau Git. Vous connaissez maintenant les opérations de base avec Git dans Dreamweaver.

Dreamweaver CC 2017/2018 : Les nouveautés

Optimisez votre flux de travail avec les nouveautés de Dreamweaver. Faites le tour des améliorations de l'interface, appréciez les évolutions de l'éditeur de code, etc.

Aucun commentaire n´est disponible actuellement
Thématiques :
Design web
Standards du web
Spécial abonnés
Date de parution :2 nov. 2016
Mis à jour le:13 juin 2018

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !