Guide d'utilisation Annuler

Utilisation de Git dans Dreamweaver

  1. Guide de l’utilisateur de Dreamweaver
  2. Introduction
    1. Principes de base du design web réactif
    2. Nouveautés de Dreamweaver
    3. Développement web avec Dreamweaver - Présentation
    4. Dreamweaver / Questions fréquentes
    5. Raccourcis clavier
    6. Configuration requise pour Dreamweaver
    7. Récapitulatif des nouvelles fonctionnalités
  3. Dreamweaver et Creative Cloud
    1. Synchronisation des paramètres de Dreamweaver avec Creative Cloud
    2. Bibliothèques Creative Cloud dans Dreamweaver
    3. Utilisation de fichiers Photoshop dans Dreamweaver
    4. Utilisation d’Adobe Animate avec Dreamweaver
    5. Extraction de fichiers SVG optimisés pour le web depuis des Bibliothèques
  4. Espaces de travail et affichages Dreamweaver
    1. Espace de travail de Dreamweaver
    2. Optimisation de l’espace de travail Dreamweaver pour la conception visuelle
    3. Recherche de fichiers sur la base de leur nom ou de leur contenu | Mac OS
  5. Configuration de sites
    1. À propos des sites Dreamweaver
    2. Création d’une version locale de votre site
    3. Connexion à un serveur de publication
    4. Configuration d’un serveur d’évaluation
    5. Importation et exportation des paramètres d’un site Dreamweaver
    6. Importation de sites web d’un serveur distant vers la racine de votre site local
    7. Fonctions d’accessibilité dans Dreamweaver
    8. Paramètres avancés
    9. Définition des préférences de site pour le transfert de fichiers
    10. Indication des paramètres du serveur proxy dans Dreamweaver
    11. Synchronisation des paramètres de Dreamweaver avec Creative Cloud
    12. Utilisation de Git dans Dreamweaver
  6. Gestion des fichiers
    1. Création et ouverture de fichiers
    2. Gestion des fichiers et des dossiers
    3. Acquisition et placement de fichiers depuis ou vers votre serveur
    4. Archivage et extraction de fichiers
    5. Synchronisation de fichiers
    6. Comparaison de fichiers pour analyse de leurs différences
    7. Masquage de fichiers et de dossiers dans votre site Dreamweaver
    8. Activation des notes de conception pour les sites Dreamweaver
    9. Prévention de l’exploitation potentielle de Gatekeeper
  7. Mise en page et design
    1. Utilisation d’assistances visuelles pour la mise en forme
    2. À propos de l’utilisation de CSS pour mise en forme de votre page
    3. Création de sites web en responsive design avec Bootstrap
    4. Création et utilisation des requêtes de multimédia dans Dreamweaver
    5. Présentation de contenus dans des tableaux
    6. Couleurs
    7. Design réactif à l’aide de mises en forme à grille fluide
    8. Extract dans Dreamweaver
  8. CSS
    1. Description des feuilles de style en cascade
    2. Mise en forme de pages avec CSS Designer
    3. Utilisation de préprocesseurs CSS dans Dreamweaver
    4. Comment définir les préférences de Style CSS dans Dreamweaver
    5. Déplacement des règles CSS dans Dreamweaver
    6. Conversion de code CSS intégré en règle CSS dans Dreamweaver
    7. Utilisation de balises div
    8. Application de dégradés à l’arrière-plan
    9. Permet de créer et modifier des effets de transition CSS3 dans Dreamweaver.
    10. Formatage du code
  9. Contenu de page et actifs
    1. Définition des propriétés de page
    2. Définition des propriétés d’en-tête CSS et des propriétés de lien CSS
    3. Utilisation du texte
    4. Recherche et remplacement de texte, de balises et d’attributs
    5. Panneau DOM
    6. Modification en mode En direct
    7. Le codage de documents dans Dreamweaver
    8. Sélection et affichage d’éléments dans la fenêtre de document
    9. Définition des propriétés de texte dans l’inspecteur Propriétés
    10. Vérification de l’orthographe d’une page web
    11. Utilisation de règles horizontales dans Dreamweaver
    12. Ajout et modification de combinaisons de polices dans Dreamweaver
    13. Utilisation d’actifs
    14. Insertion et mise à jour des dates dans Dreamweaver
    15. Création et gestion des actifs favoris dans Dreamweaver
    16. Insertion et modification d’images dans Dreamweaver
    17. Ajout d’objets multimédias
    18. Ajout de vidéos dans Dreamweaver
    19. Insertion de vidéo HTML5
    20. Insertion de fichiers SWF
    21. Ajout d’effets audio
    22. Insertion de fichiers audio HTML5 dans Dreamweaver
    23. Utilisation d’éléments de bibliothèque
    24. Utilisation de texte arabe et hébreu dans Dreamweaver
  10. Liens et navigation
    1. A propos des liens et de la navigation
    2. Etablissement de liens
    3. Cartes graphiques
    4. Résolution des problèmes de liens
  11. Effets et widgets jQuery
    1. Utilisation de widgets jQuery UI et Mobile dans Dreamweaver
    2. Utilisation d’effets jQuery dans Dreamweaver
  12. Codage de sites web
    1. À propos du codage dans Dreamweaver
    2. Environnement de codage dans Dreamweaver
    3. Définition des préférences de codage
    4. Personnalisation de la coloration du code
    5. Rédaction et modification de code
    6. Conseils et remplissage de code
    7. Réduction et développement de code
    8. Réutilisation de code à l’aide de fragments
    9. Analyse linting de code
    10. Optimisation du code
    11. Modification de code en mode Création.
    12. Utilisation de contenu d’en-tête pour les pages
    13. Insertion d’inclusions côté serveur dans Dreamweaver
    14. Utilisation des bibliothèques de balises dans Dreamweaver
    15. Importation de balises personnalisées dans Dreamweaver
    16. Utilisation de comportements JavaScript (instructions générales)
    17. Application de comportements JavaScript intégrés
    18. À propos de XML et de XSLT
    19. Exécution de transformations XSL côté serveur dans Dreamweaver
    20. Exécution de transformations XSL côté client dans Dreamweaver
    21. Ajout d’entités de caractère pour XSLT dans Dreamweaver
    22. Formatage du code
  13. Flux de travaux inter-produit
    1. Installation et utilisation des extensions pour Dreamweaver
    2. Mises à jour intégrées dans Dreamweaver
    3. Insertion de documents Microsoft Office dans Dreamweaver (Windows uniquement)
    4. Utilisation de Fireworks et Dreamweaver
    5. Édition de contenu sur des sites Dreamweaver à l’aide de Contribute
    6. Intégration entre Dreamweaver et Business Catalyst
    7. Création de campagnes de messagerie personnalisées
  14. Modèles
    1. À propos des modèles Dreamweaver
    2. Reconnaissance des modèles et des documents basés sur un modèle
    3. Création d’un modèle Dreamweaver
    4. Création de régions modifiables dans des modèles
    5. Création de régions et de tables modifiables dans Dreamweaver
    6. Utilisation de régions facultatives dans les modèles
    7. Définition d’attributs de balises modifiables dans Dreamweaver
    8. Comment créer des modèles imbriqués dans Dreamweaver
    9. Modification, mise à jour et suppression de modèles
    10. Exportation et importation de contenus xml dans Dreamweaver
    11. Application ou suppression d’un modèle depuis un document existant
    12. Modification de contenu dans les modèles de Dreamweaver
    13. Règles de syntaxe pour les balises de modèle dans Dreamweaver
    14. Définition des préférences de surbrillance pour des régions de modèle
    15. Avantages de l’utilisation de modèles dans Dreamweaver
  15. Terminaux mobiles et écrans multiples
    1. Création de requêtes multimédias
    2. Modification de l’orientation de la page pour les appareils mobiles
    3. Création d’applications web pour appareils mobiles à l’aide de Dreamweaver
  16. Sites dynamiques, pages et formulaires web
    1. En savoir plus sur les applications web
    2. Configuration de l’ordinateur pour le développement d’applications
    3. Résolution des problèmes de connexion aux bases de données
    4. Suppression des scripts de connexion dans Dreamweaver
    5. Conception de pages dynamiques
    6. Présentation des sources de contenu dynamique
    7. Définition de sources de contenu dynamique
    8. Ajout de contenus dynamiques aux pages
    9. Changement des contenus dynamiques dans Dreamweaver
    10. Affichage d’enregistrements d’une base de données
    11. Fourniture et dépannage de données en temps réel dans Dreamweaver
    12. Ajout de comportements de serveur personnalisés dans Dreamweaver
    13. Création de formulaires à l’aide de Dreamweaver
    14. Utilisation de formulaires pour la collecte des informations sur les utilisateurs
    15. Création et activations des formulaires ColdFusion dans Dreamweaver
    16. Création de formulaires web
    17. Prise en charge améliorée de HTML5 pour les éléments de formulaire
    18. Développement d’un formulaire à l’aide de Dreamweaver
  17. Création visuelle d’applications
    1. Création de pages principales et détaillées dans Dreamweaver
    2. Création de pages de recherche et de résultats
    3. Création d’une page d’insertion d’enregistrements
    4. Création de la mise à jour d’une page d’enregistrement dans Dreamweaver
    5. Création de pages de suppression d’enregistrement dans Dreamweaver
    6. Modification d’une base de données à l’aide des commandes ASP dans Dreamweaver
    7. Création d’une page d’enregistrement
    8. Création d’une page de connexion
    9. Création d’une page à accès restreint
    10. Sécurisation de dossiers dans ColdFusion à l’aide de Dreamweaver
    11. Utilisation de composants ColdFusion dans Dreamweaver
  18. Test, aperçu et publication de sites web
    1. Prévisualisation de pages
    2. Aperçu et inspection de pages web Dreamweaver sur plusieurs appareils
    3. Test de votre site Dreamweaver

 

Lisez cet article pour apprendre à utiliser Git afin de gérer votre code source et vos fichiers dans Dreamweaver.

Dreamweaver prend en charge Git, un système open source distribué de contrôle de version, pour gérer le code source. Avec l’intégration de Git dans Dreamweaver, vous pouvez travailler indépendamment sur votre code de n’importe où, puis ensuite fusionner vos modifications vers un référentiel Git central. Git vous aide à suivre toutes les modifications dans un fichier, et vous permet également de revenir aux versions précédentes.

Les référentiels Git sont également utiles lorsque vous travaillez en équipe, car Git vous permet de créer et de gérer facilement des branches. Par exemple, si vous êtes un concepteur et souhaitez modifier la conception de votre site. Si un autre membre de l'équipe prend en charge les demandes de modification pour le même site en même temps, vous pouvez tous les deux travailler indépendamment avec Git. Dans ce cas, vous pouvez, tous les deux, créer une branche et apporter vos modifications désirées dans votre référentiel local respectif. Le référentiel local contient l’historique complet de tous les changements que vous avez apportés à la source. Vous pouvez interrompre et fusionner les modifications avec le référentiel central à tout moment. La fusion garantit que le référentiel central dispose toujours du dernier code avec vos changements et ceux de votre collègue.

Lisez ce qui suit pour savoir comment commencer à utiliser Git dans Dreamweaver.

Prise en main de Git sous Dreamweaver

Si vous êtes un nouvel utilisateur Git, vous devez d’abord charger un client Git et créer un compte Git. Un client Git est essentiel avant d’utiliser Git à partir de Dreamweaver.

Si vous êtes un utilisateur qui possède déjà un compte Git, connectez-vous à votre compte. Assurez-vous d’avoir téléchargé le client Git sur votre système. 

Pour commencer à utiliser Git dans Dreamweaver, procédez comme suit :

  1. Téléchargez le client Git pour votre système d’exploitation.

  2. Créez un compte pour votre client Git.

    Si vous possédez déjà un compte Git, entrez vos informations de connexion pour vous connecter à votre client Git.

Le panneau Git

Il est recommandé d’installer le client Git avec les paramètres de configuration par défaut. Dreamweaver sélectionne ensuite automatiquement le chemin d’accès au fichier exécutable.

Vous pouvez maintenant lancer Dreamweaver et associer votre site à un référentiel Git.

Dreamweaver prend en charge les opérations Git au travers du panneau Git (Windows > Git). En tant qu’utilisateur de Dreamweaver, vous pouvez utiliser ce panneau pour effectuer des opérations Git courantes comme valider, envoyer, récupérer et extraire.

Remarque :

Vous pouvez afficher ce panneau dans Dreamweaver uniquement après avoir téléchargé le client Git sur votre ordinateur.

Le panneau Git dans Dreamweaver CC
Panneau Git dans Dreamweaver

A. Commit B. Obtenez tous les référentiels distants et actualisez les compteurs C. Git Pull D. Git Push E. Afficher l’historique des référentiels F. Afficher l’historique des fichiers G. Créer une balise H. Ouvrir la console Bash/Terminal I. Autres actions J. Rechercher K. Diff L. Rétablir le fichier 

Association de votre site à Git

Pour commencer à utiliser Git dans Dreamweaver, vous devez d’abord associer votre site Dreamweaver à un référentiel Git. Un référentiel Git est comme un dossier que vous créez pour vous aider à suivre les modifications apportées aux fichiers. Vous pouvez avoir un nombre quelconque de référentiels Git sur votre ordinateur. Chaque référentiel sur votre système est indépendant. Autrement dit, les modifications enregistrées dans un référentiel Git n’affectent pas le contenu d’un autre.

Vous pouvez associer votre site web à un référentiel soit en créant un référentiel soit en clonant un référentiel existant. Lorsque vous initialisez ou créez un référentiel, un référentiel Git vide est créé dans votre référentiel de travail actuel, avec un fichier .gitignore dans le dossier.

Toutefois, lorsque vous créez un clone à partir d’un référentiel Git existant, tous les fichiers de votre référentiel parent sont clonés dans votre système local.

Lisez ce qui suit pour savoir comment initialiser un référentiel Git ou cloner un référentiel.

Initialisation d’un référentiel Git

Lorsque vous commencez à travailler avec Git dans Dreamweaver, vous devez commencer par créer un nouveau référentiel. Lorsque vous initialisez un référentiel Git pour votre site, vous créez un référentiel Git où vous pouvez ajouter les fichiers associés à votre site Dreamweaver.

  1. En tant qu'utilisateur Dreamweaver, vous pouvez commencer avec un nouveau site. Ou vous pouvez avoir un site existant que vous voulez associer à un référentiel Git. Quoi qu’il en soit, suivez la procédure ci-dessous pour initialiser un référentiel Git.

    • Pour associer un nouveau site Dreamweaver, cliquez sur Site > Nouveau site.
    • Pour associer un site Dreamweaver existant, cliquez sur Site > Gérer les sites. Dans la boîte de dialogue Gérer les sites, double-cliquez sur le site que vous souhaitez associer à un référentiel Git.
  2. Si vous créez un nouveau site, spécifiez un nom pour le site.

    Si vous disposez d’un dossier contenant des fichiers associés à votre site, désignez-le pour pointer vers le dossier à partir du champ Dossier du site local.

    Spécifiez le nom et l’emplacement du dossier de votre nouveau site Dreamweaver.
    Spécifiez le nom et l’emplacement du dossier de votre nouveau site Dreamweaver.

    Si vous souhaitez associer votre nouveau site à un référentiel Git existant, assurez-vous que le Dossier du site local pointe vers le référentiel Git approprié.

  3. Cochez la case Associer un référentiel Git à ce site. Sélectionnez ensuite l’option Initialiser en tant que référentiel Git.

    Initialisation d’un référentiel Git dans Dreamweaver
    Initialisation d’un référentiel Git pour votre nouveau site Dreamweaver

  4. Cliquez sur Enregistrer.

    Notez que les fichiers de votre dossier local sont à présent visibles dans le panneau Fichiers (vue Git). Les fichiers se trouvent dans un état non suivi. En d’autres termes, ces fichiers ne sont pas encore validés vers votre référentiel Git.

    Vous pouvez continuer à travailler sur vos fichiers et valider vos fichiers plus tard. Vous pouvez aussi ouvrir le panneau Git (Windows > Git) et valider vos fichiers dans votre référentiel. Pour savoir comment valider des fichiers dans Git, consultez la section Suivi et validation de modifications.

Clonage d’un référentiel existant

Si vous travaillez déjà avec un référentiel Git existant hébergé sur Github ou Bitbucket ou d’autres services d’hébergement, vous pouvez procéder comme suit pour cloner le référentiel directement à partir de Dreamweaver. Lorsque vous clonez un référentiel existant, vous créez une copie du référentiel cible dans votre système local.

  1. Cliquez sur Site > Nouveau site.

  2. Dans la boîte de dialogue Configuration du site, cochez la case Associer un référentiel Git à ce site. Sélectionnez ensuite Cloner un référentiel Git existant depuis une URL.

  3. Entrez l’URL du référentiel à cloner.

    Assurez-vous que l’URL https du référentiel cible que vous entrez, est valide. Pour ce faire, cliquez sur le bouton Tester dans cette boîte de dialogue. Une URL incorrecte entraîne des erreurs lors du clonage ainsi que lors de l’exécution d’actions telles que Git Fetch ou Pull.

    Clonage d’un référentiel Git à partir de Dreamweaver
    Clonage d’un référentiel Git à partir de Dreamweaver

    Remarque :

    Le clonage d’une URL à l’aide d’une clé SSH avec mot de passe n’est pas actuellement pris en charge dans Dreamweaver. Les champs de nom d’utilisateur et de mot de passe sont désactivés.

  4. Pour mémoriser les informations d’identification que vous avez créées, cochez la case Enregistrer les identifiants. Cette action vous permet d’enregistrer vos identifiants chaque fois que vous effectuez des actions de dépôt distant telles que Git Push ou Pull.

  5. Cliquez sur Enregistrer.

    Après avoir cloné un référentiel, une copie locale du référentiel d’origine est créée. Vous pouvez afficher et modifier les fichiers locaux à partir de Dreamweaver.

    L’instantané du référentiel d’origine qui est cloné s’affiche dans le panneau Git > Origine dans l’angle supérieur droit.

    Notez le référentiel d’origine à partir du panneau Git
    Notez le référentiel d’origine à partir du panneau Git

Utilisation de Git pour le contrôle de version

Maintenant que vous avez associé votre site Dreamweaver à un référentiel Git, vous pouvez visualiser les fichiers dans Git à partir du panneau Fichiers (vue Git). Git classe les fichiers dans votre référentiel local en différentes catégories :

  • Fichiers non suivis : fichiers que vous n’avez pas validés vers le référentiel Git, même une seule fois. Après avoir initialisé un référentiel Git, les fichiers ne sont pas suivis jusqu’à ce que vous les validiez.
  • Fichiers non modifiés : fichiers qui ne sont pas modifiés.
  • Fichiers modifiés : fichiers qui sont modifiés.
  • Fichiers préparés : fichiers qui sont modifiés et prêts à être validés.

À l’aide de Git, vous pouvez suivre les modifications des fichiers. Lorsque vous modifiez les fichiers dans votre système local, les fichiers modifiés s’affichent dans une couleur différente dans le panneau Fichiers. Lorsque vous double-cliquez sur le fichier et l’ouvrez en mode Code, vous pouvez également voir la marque de gouttière contre les lignes qui ont été modifiées. Vous pouvez continuer et valider vos fichiers modifiés dans Git pour synchroniser les modifications.

Lorsque vous validez vos fichiers, Git vous permet d’entrer des messages de journal pour chaque validation et d’examiner les modifications à l’aide de la fonction diff. Vous pouvez également afficher l’historique des versions pour chaque fichier et pour le référentiel entier.

Lisez ce qui suit pour savoir comment suivre vos modifications dans Dreamweaver et valider vos modifications Git.

Suivi des modifications dans Git

Dans le panneau Fichiers de Dreamweaver, observez l’icône Git qui vous permet de basculer entre la vue FTP et la vue Git. Cliquez sur l’icône Git pour basculer la vue Git.

Si vous avez initialisé un référentiel Git et n’avez pas validé vos fichiers, ces derniers restent non suivis. Cependant, si vous aviez validé vos fichiers après l’initialisation de votre référentiel, Git reconnait ces fichiers.

Affichage des fichiers non suivis dans le panneau Fichiers
Affichage des fichiers non suivis dans le panneau Fichiers

Fichiers après avoir été validés dans le référentiel Git
Affichage des fichiers validés reconnus par Git

Si vous aviez cloné tous vos fichiers à partir d’un autre référentiel, les fichiers sont à nouveau reconnus par Git.

Lorsque vous modifiez un fichier et cliquez sur Enregistrer, le panneau Fichiers affiche les fichiers modifiés dans une autre couleur. Double-cliquez sur le fichier modifié pour afficher les modifications exactes dans le mode Code.

Marque de gouttière en mode Code
Marque de gouttière en mode Code

Une marque de gouttière indique les lignes où des modifications ont été effectuées. Les marques de gouttière en vert indiquent le nouveau code qui a été ajouté. Les marques de gouttière en jaune affichent le code modifié, tandis que les marques de gouttière en rouge désignent une ligne de code qui a été supprimée.

Une marque de gouttière indique la modification du code dans Dreamweaver
Une marque de gouttière indique la modification du code

Lorsque vous cliquez sur la marque de gouttière jaune, l'application affiche le changement dans le code. La ligne de code supprimée s'affiche en rouge et le code ajouté apparaît en vert.

Vous pouvez remarquer la présence d’un symbole R dans l’angle gauche des lignes de code supprimées. Pour rajouter le code supprimé à votre fichier, cliquez sur ce symbole R.

Cliquez sur le symbole R pour ajouter le code supprimé dans l’utilitaire Git de Dreamweaver
Cliquez sur le symbole R pour ajouter le code supprimé

Utilisez les marques de gouttière pour visualiser le comparatif et vérifier la pertinence de vos modifications avant de les valider dans le référentiel Git.

Affichage du comparatif des fichiers modifiés

Lorsque vous ouvrez le panneau Git, vous pouvez voir la liste des fichiers modifiés. Vous pouvez cliquer sur un fichier dans la liste et afficher les modifications apportées au fichier après la précédente validation (diff). Pour afficher le comparatif pour un fichier, effectuez l’une des opérations suivantes dans le panneau Git :

  • Pour afficher les modifications apportées au niveau du fichier, cliquez sur chaque fichier. Les surbrillances rouges indiquent la version précédente, alors que les surbrillances vertes indiquent la modification que vous venez d’apporter.
  • Sélectionnez le fichier pour lequel vous souhaitez consulter le comparatif. Cliquez sur  (icône Diff). La boîte de dialogue Git Diff s’affiche, présentant les modifications en surbrillance en rouge et vert.
Affichage du comparatif des fichiers modifiés
Affichage du comparatif des fichiers modifiés

Validation des modifications

Pour enregistrer toutes les modifications dans votre référentiel local, vous devez valider les modifications apportées à vos fichiers. Pour valider vos modifications dans Git :
  1. Dans le panneau Git, sélectionnez le ou les fichiers que vous souhaitez valider, puis cliquez sur Valider.

    Validation des modifications dans votre référentiel Git local
    Validation des modifications dans votre référentiel Git local

  2. Cliquez sur  (icône Valider).

    Lorsque vous cliquez sur Valider, le système affiche la boîte de dialogue Git Commit. Cette boîte de dialogue affiche les fichiers qui comportent des modifications.

    Vous pouvez cliquer sur chaque fichier pour afficher les modifications avant de procéder à la validation des fichiers.

  3. Pour valider les fichiers, entrez un message de validation dans la zone de texte, puis cliquez sur OK.

    Une fois les fichiers validés, ils sont également effacés du panneau Git.

    Validation de vos modifications dans Git
    Validation de vos modifications dans Git

Rétablissement des modifications

Si vous avez déjà validé vos modifications et souhaitez revenir à la version précédente d’un fichier, procédez comme suit :

  1. Dans le panneau Git, sélectionnez le ou les fichiers que vous souhaitez rétablir.

  2. Cliquez sur l’icône sandwich dans le panneau Git, puis sélectionnez Rétablir toutes les modifications depuis la dernière validation.

    La version précédente des fichiers est restaurée dans votre référentiel local. Vous pouvez afficher les fichiers restaurés à partir du panneau Fichiers.

    Rétablissement des modifications après validation des fichiers
    Rétablissement des modifications après validation des fichiers

    Remarque :

    Si vous souhaitez rétablir un fichier après sa validation, vous devez valider le fichier au moins deux fois.

  3. Pour annuler les modifications avant la validation, procédez comme suit :

    Si vous souhaitez conserver la dernière version validée de votre fichier avant la validation du fichier :

    1. Dans le panneau Git, cliquez sur le fichier que vous souhaitez conserver, puis cliquez sur l’icône Actualiser.
    2. Dans la boîte de dialogue de confirmation, cliquez sur OK.

    Le fichier que vous avez sélectionné est effacé de la liste des fichiers modifiés, et la version précédente du fichier est restaurée.

    Rétablissement du fichier avant la validation des modifications dans Git
    Rétablissement du fichier avant validation des modifications

Création de balises

Vous pouvez créer des balises à chaque fois que vous validez vos modifications dans Git. Vous pouvez utiliser des balises pour marquer des validations importantes. Par exemple, un archivage pour une modification importante demandée par votre client. Les balises agissent comme pointeur vers une validation spécifique.

  1. Pour créer une balise, cliquez sur  (icône Créer une balise) dans le panneau Git.

  2. Dans la boîte de dialogue Créer une balise, spécifiez un nom pour votre balise. Cliquez sur OK.

    Création d’une balise pour votre validation
    Création d’une balise pour votre validation

    La balise que vous avez créée est associée à votre validation.

    Si vous créez une balise une fois que vous avez effectué une validation, la balise est automatiquement associée à votre plus récente validation.

Affichage de l’historique du fichier

Chaque fois que vous validez un fichier dans Git, vous pouvez afficher l’historique du fichier ainsi que les détails de la validation. Cette possibilité permet d’identifier les validations importantes, ainsi que les balises associées aux validations.

  1. Dans le panneau Git, effectuez l’une des opérations suivantes :
  • Sélectionnez le fichier requis, puis cliquez sur  (icône Afficher l’historique des fichiers).
  • Cliquez avec le bouton droit sur le fichier dans le panneau Fichiers et sélectionnez Historique du fichier.

Le système affiche l’historique Git du fichier sélectionné. Vous pouvez également afficher les détails de la validation pour ce fichier à partir de la même boîte de dialogue.

Affichage de l’historique du fichier dans Git
Affichage de l’historique du fichier dans Git

Affichage de l’historique du référentiel

En plus de visualiser l’historique d’un fichier dans Git, vous pouvez également afficher les modifications apportées au niveau du référentiel. Vous pouvez afficher toutes les modifications et validations réalisées au niveau du référentiel. Pour visualiser l’historique du référentiel, effectuez les opérations suivantes :

  1. Dans le panneau Git, cliquez sur l’icône Afficher l’historique des référentiels. Le système affiche l’historique du référentiel Git avec les détails de toutes les validations.

  2. Vous pouvez afficher le message de validation, ainsi que la date et l'heure auxquelles les fichiers ont été validés. Vous pouvez également afficher les balises associées à une validation, ainsi que les informations concernant l'utilisateur qui a validé les fichiers.

  3. L’historique de référentiel spécifie généralement la liste des fichiers qui ont été validés au niveau du référentiel. Vous pouvez cliquer sur chaque fichier pour afficher l’historique de modification au niveau du fichier.

Utilisation de Git pour la collaboration

L’une des caractéristiques les plus distinctes de Git consiste en les branches. Contrairement à la plupart des systèmes de contrôle de version, une branche Git peut être assimilée à une ligne indépendante de l’ensemble de votre code ou tous vos fichiers associés. Par défaut, votre référentiel comporte une branche appelée « gabarit ». La branche gabarit est la branche principale ou finale. Vous pouvez créer des branches à partir du gabarit et apporter des modifications à chacune des branches.

Vous pouvez également créer une branche à partir d’une autre branche, lorsque vous créez une copie de la branche parente. Vous pouvez travailler indépendamment sur les deux branches dans le même référentiel Git. Par exemple, vous pouvez travailler sur une nouvelle fonctionnalité pour votre site sur une branche tout en traitant certaines demandes de modification dans une autre branche.

Git vous permet également de fusionner des branches si vous souhaitez incorporer les modifications de votre branche actuelle vers une branche cible. Lorsque vous fusionnez deux branches, les deux branches continuent d’exister indépendamment. Vous pouvez continuer à travailler avec les branches parente et cible.

Dans Dreamweaver, lorsque des développeurs et designers travaillent ensemble pour un site, chaque utilisateur peut créer une branche à partir du gabarit et effectuer des modifications indépendamment. Au besoin, ils peuvent facilement fusionner leurs modifications avec une autre branche et continuer à travailler avec les deux branches.

Pour en savoir plus sur la création et la gestion de branches dans Git, consultez les sections suivantes :

Création de branches dans Git

  1. Dans le panneau Fichiers, sélectionnez la liste déroulante qui répertorie toutes les branches.

  2. Cliquez sur Gérer les branches.

    Création d’une branche dans Git
    Création d’une branche dans Git

  3. Dans la boîte de dialogue Gérer les branches, cliquez sur le signe + dans l’angle inférieur droit.

    Au bas de la boîte de dialogue Gérer les branches, cliquez sur le signe Plus.
    Au bas de la boîte de dialogue Gérer les branches, cliquez sur le signe Plus.

  4. Dans la boîte de dialogue Créer une branche, sélectionnez la branche d’origine à partir de laquelle vous souhaitez faire une copie.

    S’il s’agit de la première branche que vous créez, la branche d’origine est votre branche principale.

    Sélection de la branche d’origine
    Sélection de la branche d’origine

  5. Dans le champ Nom de la branche, spécifiez un nom pour la nouvelle branche.

  6. Cliquez sur OK.

Fusion de branches

  1. Dans le panneau Fichiers, sélectionnez la liste déroulante qui répertorie toutes vos branches.

  2. Cliquez sur Gérer les branches. Dans la boîte de dialogue Gérer les branches, sélectionnez la branche que vous souhaitez fusionner.

  3. Au bas de la boîte de dialogue, cliquez sur  (icône Fusionner la branche).

  4. Dans la boîte de dialogue Fusionner la branche, sélectionnez la branche cible. Cette branche est le référentiel cible avec lequel vous souhaitez fusionner votre branche.

    Spécifiez éventuellement un message associé à cette fusion.

  5. Cliquez sur OK pour fusionner votre branche avec votre cible.

    Fusion de branches dans Git
    Fusion de branches dans Git

    Si la validation des modifications de fichier entre en conflit avec des modifications provenant d’une autre branche, le processus de fusion est mis en pause. Le système affiche un message de conflit ainsi que les fichiers à l’origine du conflit.

    Le panneau Git affiche également les fichiers qui présentent un conflit. Notez l’icône qui indique qu’il existe un conflit.

    Panneau Git avec fichiers responsables d’un conflit au cours de la fusion
    Panneau Git avec fichiers responsables d’un conflit au cours de la fusion

    Pour procéder à la fusion, vous devez d'abord résoudre le conflit. Vous pouvez utiliser l'option Redéfinition ou procéder à la fusion en utilisant l'option sans avance rapide.

  6. Si vous rencontrez un conflit de fusion, sélectionnez l’une des options suivantes :

    • Utiliser Rebase : lorsque vous sélectionnez l’option de redéfinition pour résoudre un conflit, vos modifications actuelles sont appliquées par rapport aux conflits dans votre branche cible. Une fois que vous avez sélectionné l’option de redéfinition et cliqué sur OK, ouvrez le panneau Git pour visualiser les fichiers qui doivent encore être validés. Vous pouvez ensuite soit annuler la redéfinition soit redémarrer la redéfinition. Lorsque vous annulez la redéfinition, l’action de redéfinition est arrêtée et aucune modification n’est appliquée à la branche cible. Lorsque vous redémarrez la redéfinition, vos modifications sont ignorées par rapport aux conflits affichés dans la branche cible.
    • Créer une validation de fusion, même si la fusion résulte en une avance rapide (--no-ff) : vous pouvez également fusionner votre validation malgré les conflits constatés entre votre branche et la branche cible. Dans ce cas, la fusion est forcée avec vos modifications étant prioritaires sur celles dans la branche cible.

    Pour en savoir plus sur la redéfinition dans Git, consultez la section Redéfinition dans Git.

Utilisation de référentiels distants

Les référentiels distants dans Git sont des versions d’un projet qui sont hébergées sur un autre réseau. Vous pouvez accéder à des référentiels distants en créant une connexion avec le référentiel. En fonction des droits d’accès spécifiés dans le référentiel distant, vous pouvez disposer d’un accès en lecture seule ou d’un accès en écriture à ce référentiel.

Lorsque vous travaillez dans une équipe, les référentiels distants vous aident à envoyer et récupérer des données vers et depuis d’autres référentiels. Dans le panneau Git de Dreamweaver, vous pouvez créer une connexion distante et effectuer plusieurs opérations Git telles que Fetch, Git Push, Git Pull et Remote Refresh.

Pour apprendre à créer et gérer des référentiels distants, lisez les procédures suivantes.

Ajout d’un référentiel distant

Vous pouvez ajouter un référentiel distant pour partager des fichiers, la progression de votre travail, ainsi que pour accéder aux fichiers de votre projet hébergés dans un autre réseau. En ajoutant un référentiel distant, vous établissez une connexion à distance avec le référentiel cible. Dreamweaver vous permet de créer des référentiels distants à partir du panneau Git.

Avant d’ajouter un référentiel distant, assurez-vous que l’autre référentiel dispose de paramètres publics activés.

  1. Dans le panneau Git, cliquez sur Créer un référentiel distant.

  2. Spécifiez un nom pour le référentiel distant.

  3. Entrez l’URL et les informations d’identification du référentiel distant.

    Pour vous assurer d’avoir entré une URL valide lors de l’ajout d’un référentiel distant, cliquez sur le bouton Tester après avoir saisi l’URL. Lorsque vous cliquez sur le bouton Tester, la validité de l’URL est testée.

    Ce test n’est pas applicable pour la validation des identifiants.

    Ajout d’un référentiel distant dans Dreamweaver
    Ajout d’un référentiel distant

    Attention :

    Si vous n’entrez pas une URL valide ou des informations d’identification correctes, vous rencontrez des erreurs lorsque vous effectuez des opérations Git Pull, Git Push, Fetch et ainsi de suite.

  4. Cliquez sur OK.

    Lorsque vous ajoutez un référentiel distant, vous voyez le référentiel dans la liste déroulante en haut du panneau Git. Vous pouvez également afficher plus d’icônes pour l’exécution de compteurs d’opérations Git Push, Git Pull, Fetch remote et Refresh.

    Ajout de référentiels distants dans Git
    Ajout de référentiels distants dans Git

Gestion de référentiels distants

Une fois que vous avez ajouté un référentiel distant et établi une connexion, vous pouvez extraire et récupérer les fichiers du référentiel distant vers votre référentiel local. Vous pouvez également envoyer vos fichiers vers le référentiel distant. Toutefois, vous devez d’abord récupérer des fichiers du référentiel distant avant d’effectuer une action Git Push pour la première fois.

N’oubliez pas de valider tous les fichiers dans le référentiel local avant de tenter d’envoyer vos fichiers. Si votre référentiel local comporte des fichiers préparés, l’action Git Push reste infructueuse 

Vous pouvez effectuer les opérations Git suivantes à partir de Dreamweaver :

Fetch all

Cliquez sur  pour extraire tous les fichiers de toutes vos connexions distantes. Il est recommandé d’exécuter une action Git Fetch avant d’exécuter une opération Git Push ou Git Pull. Cette action extrait uniquement les fichiers depuis des référentiels distants, et ne modifie pas votre référentiel local.

Récupération de fichiers depuis référentiel distant

Vous pouvez récupérer des modifications depuis un référentiel unique ou depuis un groupe de référentiels. Lorsque vous cliquez sur l’icône Git Pull, le système affiche la boîte de dialogue Git Pull avec diverses options.

  1. Dans le panneau Git, cliquez sur  (icône Git Pull) pour récupérer les fichiers modifiés depuis le référentiel distant et fusionner les modifications avec votre référentiel local.

  2. Dans la boîte de dialogue Git Pull, sélectionnez la branche de suivi. Indiquez si vous souhaitez récupérer des modifications de la branche actuelle ou d’une autre branche, puis définissez les paramètres de récupération.

    Exécution d’une action Git Pull depuis des référentiels distants
    Exécution d’une action Git Pull depuis des référentiels distants

  3. Par défaut, la fusion par défaut est sélectionnée. Dans ce cas, les fichiers du référentiel distant sont récupérés dans votre référentiel local et les modifications sont fusionnées avec votre référentiel local.

  4. Vous pouvez également choisir l‘une des options suivantes :

    • Éviter la fusion manuelle : sélectionnez cette option pour désactiver la fusion manuelle de fichiers.
    • Fusionner sans validation : sélectionnez cette option pour procéder à la fusion avec le référentiel distant, même sans valider vos fichiers préparés.
    • Utiliser rebase : sélectionnez cette option pour effectuer une redéfinition. Lorsque vous utilisez l’option rebase, les modifications de votre branche actuelle sont prises et appliquées sur l’historique de la branche dont vous récupérez des fichiers. Le dernier historique validé de votre branche est réécrit. Les fichiers correspondent maintenant aux versions de la branche cible à partir de laquelle vous extrayez les fichiers. Bien que la redéfinition génère un historique Git propre pour votre branche, vous devez être prudent lors de la sélection de l’option Utiliser rebase.
    • Utiliser la réinitialisation logicielle : sélectionnez cette option pour effectuer une réinitialisation ou une redéfinition logicielle. Vous pouvez choisir l’option Utiliser la réinitialisation logicielle lorsque vous récupérez les fichiers depuis un référentiel distant pour la première fois. Dans ce cas, le référentiel distant sert de référentiel parent à partir duquel le référentiel local reçoit toutes les modifications. Toutefois, les modifications dans votre référentiel local sont conservées. Git ne reconnait pas les fichiers qui sont présents dans votre référentiel local, mais pas ceux qui se trouvent dans le référentiel distant. Ces fichiers sont affichés sous la forme de fichiers supprimés une fois que vous avez exécuté une réinitialisation logicielle. Si vous choisissez de conserver ces fichiers dans votre référentiel local, les modifications distantes sont perdues.
    Attention :

    Si vous décidez de procéder à la réinitialisation logicielle, vos fichiers non reconnus sont supprimés.

Envoi de fichiers au référentiel distant

Après avoir établi une connexion avec des référentiels distants, lorsque vous modifiez et validez les fichiers modifiés, Git enregistre ces modifications. L’icône Git Push  dans le panneau Git affiche immédiatement le nombre de fichiers qui ont été modifiés. Ces fichiers peuvent maintenant être envoyés au référentiel distant.

Lorsque vous exécutez une action Git Push, les validations que vous avez apportées au référentiel local sont envoyées au référentiel distant.

Pour envoyer vos fichiers directement depuis Dreamweaver :

  1. Dans le panneau Git, cliquez sur l’icône Git Push.

    Le système affiche la boîte de dialogue Git Push. Vous pouvez envoyer vos validations à la branche de suivi actuelle ou à une autre branche que vous spécifiez.

    Envoi de validations locales vers un référentiel Git distant
    Envoi de validations locales vers un référentiel Git distant

  2. Vous pouvez également définir les paramètres d’envoi depuis cette boîte de dialogue. Par défaut, l’option Envoi par défaut est sélectionnée.

  3. Vous pouvez également sélectionner les options suivantes :

    • Envoi forcé : sélectionnez cette option pour envoyer de force vos modifications au référentiel distant, malgré les conflits potentiels.
    • Supprimer branche de référentiel distant : sélectionnez cette option pour supprimer la branche de référentiel distant existante et envoyer vos fichiers locaux au référentiel distant.
  4. Au besoin, cochez la case Envoyer les balises pour envoyer vos balises au référentiel distant.

  5. Cliquez sur OK.

    En cas de conflits entre vos validations locales et les validations effectuées sur le référentiel distant, il est recommandé de résoudre d’abord les conflits. Vous pourrez alors envoyer vos modifications.

    Pour ce faire, vous devez d’abord récupérer les modifications du référentiel distant, résoudre les conflits, puis envoyer les fichiers ne présentant aucun conflit.

Recherche de fichiers dans le panneau Git

La barre de recherche dans le panneau Git vous permet de rechercher des fichiers à l’aide du nom de fichier. Cette fonctionnalité est particulièrement utile si vous disposez d’un grand nombre de fichiers associés à votre site.

Pour rechercher un fichier, entrez simplement son nom dans la barre de recherche. Le ou les fichiers contenant votre requête de recherche s’affichent immédiatement.

Ajout de fichiers à la liste ignore

Lorsque vous ne souhaitez pas que Git agisse sur un fichier, vous pouvez ajouter le fichier à .gitignore. Git ignore les fichiers de ce dossier à chaque fois que vous effectuez toute action, notamment validation, envoi et récupération. Vous devez valider le fichier .gitignore dans votre référentiel de sorte que tout autre utilisateur clonant votre référentiel soit également au courant des fichiers du dossier .gitignore.

Pour ajouter des fichiers au dossier .gitignore, accédez au panneau Fichiers dans Dreamweaver. Sélectionnez et cliquez avec le bouton droit sur le fichier que vous souhaitez que Git ignore, puis sélectionnez Git > Ajouter à .gitignore.

Ajout de fichiers au dossier .gitignore
Ajout de fichiers au dossier .gitignore

À tout moment, si vous souhaitez retirer un fichier du dossier .gitignore, sélectionnez le fichier dans le panneau Fichiers. Cliquez avec le bouton droit et sélectionnez Git > Retirer de .gitignore.

Assurez-vous de valider le fichier .gitignore dans les référentiels local et distant après la modification de ce fichier.

Accès à Git au travers de la ligne de commande

Dans les sections précédentes de cet article, vous avez appris à utiliser le panneau Git (interface utilisateur) pour exécuter des tâches telles que l’association d’un référentiel Git à votre site, la création et la gestion de connexions à distance, l’envoi de fichiers vers un référentiel ou encore l’extraction de fichiers depuis un référentiel. Vous pouvez également effectuer ces actions et bien d’autres à l’aide de commandes git.

Pour réaliser une opération Git à l’aide du terminal, effectuez l’une des opérations suivantes :

  • Cliquez sur Windows > Git, puis cliquez sur l’icône Ouvrir la console Bash/Terminal.
  • Dans le panneau Fichiers, basculez la vue Git. Cliquez sur l’icône Ouvrir fenêtre Git en regard de la liste déroulante de référentiels.

Pour afficher les commandes Git courantes, consultez l’Aide-mémoire Git

Remarque :

Certaines actions comme git stash et la combinaison de validations après l’envoi ne sont actuellement possibles qu’à partir de la ligne de commande.

Lorsque vous effectuez certaines opérations telles que l’initialisation d’un référentiel Git à partir de la ligne de commande, ces actions sont également reflétées dans l’interface Dreamweaver.

Cependant, vous pouvez également modifier des fichiers à l'aide de la ligne de commande lorsque l'application Dreamweaver est fermée. Dans ce cas, le message suivant apparaîtra la prochaine fois que vous lancerez Dreamweaver :

Message lors de la modification de fichiers à l’aide de l’interface de ligne de commande
Message lors de la modification de fichiers à l’aide de l’interface de ligne de commande

Définition de préférences Git dans Dreamweaver

Les préférences Git dans Dreamweaver vous permettent de définir des paramètres pour l’utilisation de Git dans Dreamweaver. Vous pouvez utiliser la boîte de dialogue Préférences pour définir des préférences Git comme le chemin d’accès au terminal, des paramètres de délai, et ainsi de suite.

  1. Choisissez Édition > Préférences.

  2. Dans la boîte de dialogue Préférences, sélectionnez Git.

  3. Dans la boîte de dialogue Préférences Git, définissez les options suivantes :

    • Chemin d’accès au fichier exécutable Git : le fichier .exe de votre client Git. Si votre fichier exécutable est enregistré à un autre emplacement, accédez à l’emplacement où vous avez enregistré le fichier .exe de Git.
    • Délai par défaut d’opération Git : spécifiez le délai en secondes, pour n’importe quelle opération Git distante.
    • Chemin d’accès au terminal : le chemin d’accès complet au fichier exécutable pour ouvrir et utiliser le terminal Git.
    • Argument de commande : fournissez les arguments de commande, le cas échéant, pour vos commandes Git.
    Définition des préférences pour Git dans Dreamweaver
    Définition des préférences pour Git dans Dreamweaver

  4. Cliquez sur Appliquer pour enregistrer vos paramètres.

Remarque :

Redémarrez Dreamweaver pour que vos préférences mises à jour prennent effet.

 Adobe

Recevez de l’aide plus rapidement et plus facilement

Nouvel utilisateur ?