Vous connaissez probablement des outils, tels que Git et Subversion. Mais, en tant que concepteurs Web, il est tout à fait possible que, même si vous utilisez le contrôle de version dans vos projets, la vérité est que, le plus souvent, vous ne le faites pas.. Si vous correspondez à cette description, ne vous inquiétez pas; tu n'es pas seul. En fait, c'est l'opinion entièrement non recherchée de cet auteur que la grande majorité des concepteurs de sites Web n'en ont pas! Le dilemme est qu’il existe une croyance commune selon laquelle le contrôle de version est réservé aux codeurs expérimentés, qui passent leurs journées dans l’obscurité et qui prennent rarement l'air, sauf lorsque le micro-ondes sonne, signalant que la poche chaude est prête à être mangée.
En réalité, si vous codez pour le Web, que ce soit au niveau du système frontal ou du système principal, il est de votre devoir de coder de manière responsable: utilisez le contrôle de version..
5 signes que vous êtes en retard pour le contrôle de version
Vous n'avez aucune idée de ce qu'est le contrôle de version ou de son utilité.
Vous codez localement et n'avez pas de système de sauvegarde.
Vous sauvegardez vos projets en dupliquant sporadiquement le répertoire racine.
Vous avez accidentellement supprimé un fichier de façon permanente et avez dû recoder à partir de zéro.
Après avoir effectué un certain nombre de modifications, votre application est interrompue et vous devez alors appuyer sur Commande + Z pendant un nombre douloureux de secondes, alors que vous regardez l'éditeur inverser vos modifications.
Admettez-le: chaque développeur s'est identifié avec l'un des signes mentionnés précédemment à un moment ou à un autre de sa carrière. Mais rappelez-vous: la première étape de la récupération consiste à admettre que vous avez un problème!
5 avantages immédiats pour le contrôle de version
Supprimé accidentellement cette classe ou PSD? Exécutez une seule commande dans le terminal pour revenir à un état précédent dans le projet. Catastrophe évitée!
Avez-vous déjà eu le souffle coupé par l'horreur alors que votre site Web avait disparu de votre bureau? C'était là hier, mais aujourd'hui, c'est parti! Un service gratuit, appelé GitHub, en fait un non-problème.
Qui diable écrirait ce morceau de code que je dois maintenant passer des heures à réécrire? Pas besoin de se demander qui est à blâmer; Git va vous dire!
Code avec abandon, tout en sachant qu'avec chaque commit, des "instantanés" de votre application sont en cours de sauvegarde, au cas où vous auriez besoin de revenir à cet état ultérieurement..
Si ce n’est pas pour une autre raison, acceptez que les développeurs qui sont probablement beaucoup plus expérimentés que vous l’ayez considéré comme une meilleure pratique. Il est utile d'imiter ceux à qui nous admirons.
Git?
Git est le système de contrôle de version le plus populaire disponible.
Alors, comment Git prend-il en compte tout ce processus de contrôle de version? Eh bien, la définition la plus géniale est que Git est un système de contrôle de version distribué, développé par Linus Torvalds, où chaque répertoire de travail est son propre référentiel avec l'historique complet disponible à tout moment. De plus, Git offre la possibilité de partager du code et de créer plusieurs branches (ou calendriers) pour vos projets, ce qui le rend particulièrement adapté aux équipes de développement agiles..
Une définition plus compréhensible pourrait être: Git est un outil de ligne de commande que vous, et tous les autres développeurs de votre équipe, utilisez pour enregistrer des instantanés fréquents de vos projets. À tout moment, il offre la possibilité d'annuler les modifications apportées aux états précédents, avec une seule commande..
Le livre de Scott Chacon, «Pro Git», est disponible dans son intégralité. sur le site Git.
Installer Git
Certes, la première étape pour récupérer "Cowboy Coding" consiste à télécharger Git à partir de git-scm.com. Utilisez l'une des URL suivantes, selon le système d'exploitation de votre choix.
Mac: http://git-scm.com/download/mac
les fenêtres: http://git-scm.com/download/win
Ensuite, nous devons configurer l’installation d’un simple toucher en associant un nom d’utilisateur et une adresse électronique. Ouvrez votre console la plus proche (Terminal sur le Mac) et exécutez:
Ne t'inquiète pas Cela ne doit être saisi qu'une fois, après avoir installé Git pour la première fois. Maintenant, pour chaque action que vous entreprenez, Git utilisera ces paramètres.
Il existe d'autres options de configuration, telles que spécifier l'éditeur de code à utiliser, lorsque Git vous demande de taper un message de validation, mais ignorez-le pour l'instant..
Félicitations, Git est installé avec succès!
Le cycle de base
Comme pour toute nouvelle technologie, un peu d'apprentissage est nécessaire.
L'un des aspects les plus difficiles de l'apprentissage de Git consiste à déchiffrer le langage utilisé dans les différents jargons. Commit? Mise en scène? Branches? Les journaux? Hein?
Comme pour toute nouvelle technologie, un petit apprentissage est nécessaire. Heureusement, aussi complexe que puisse être Git, en particulier en tant que concepteur Web, vous constaterez qu'une poignée de commandes ira loin. À titre de comparaison, considérons le dictionnaire anglais, puis le nombre de mots que nous utilisons de manière réaliste dans les conversations de tous les jours. La même chose est vraie pour Git - à un niveau beaucoup plus bas. Alors ne vous sentez pas submergé. Prenez-en une commande à la fois.
Pour éliminer cette terminologie déroutante, il est préférable de penser d'abord à quelque chose de concret dans le monde réel: un camion de livraison..
Imaginez que vous ayez commencé un nouveau site web statique. Vous avez créé des dossiers pour les fichiers JavaScript et CSS, ainsi qu'un fichier index.html avec un peu de code HTML passe-partout. En fait, faites la même chose maintenant! Lorsque vous avez terminé, il est temps de créer le premier commit.
Retournez au terminal et tapez:
git init
Cette commande, "initialiser Git", informe Git que nous souhaitons un contrôle de version pour ce projet. Ou "démarrer l'allumage". Il ne doit être exécuté qu'une seule fois, au début du cycle de vie d'un nouveau projet..
Ensuite, déterminons quel est le "statut".
statut git
Si vous travaillez longtemps, vous verrez probablement quelque chose comme:
# Sur le maître de branche # # Commit initial # # Fichiers non suivis: # (utilisez "git add … "À inclure dans ce qui sera commis) # # index.html rien d’ajouté à commettre mais des fichiers non suivis présents (utilisez" git add "pour suivre)
Bien que quelque peu déroutant, si nous prenons un moment, nous verrons que, par défaut, nous travaillons sur une "branche", appelée "maître". Ensuite, nous avons un fichier non suivi: index.html. A partir de là, nous pouvons déchiffrer que Git n’est pas magique; il faut savoir quels fichiers garder sous surveillance, pour ainsi dire.
Curieux de savoir pourquoi les répertoires JavaScript et CSS ne figurent pas dans la liste des fichiers non suivis? Git suit les fichiers, pas les dossiers. Une technique courante, cependant, pour inclure des répertoires vides dans une validation consiste à ajouter un fichier .gitignore à chaque sous-répertoire. Plus sur cela plus tard!
Suivi des fichiers
Pour suivre les fichiers, nous devons d’abord les ajouter à la zone de préparation ou les placer dans le camion..
git add index.html
Maintenant, si nous vérifions à nouveau le statut, nous verrons:
Sur branche master # # commit initial # # Modifications à valider: # (utilisez "git rm --cached … "Pour décompresser) # # nouveau fichier: index.html
Excellent; Git surveille les modifications dans ce fichier. Dans ce cas, nous n’avons ajouté qu’un seul fichier. Si, à la place, nous préférons ajouter tous les fichiers à la zone de transfert, nous pouvons utiliser le symbole de période..
git ajouter .
Gardez à l'esprit que le camion n'est pas encore parti; nous avons simplement chargé quelques boîtes (ou fichiers) à l’arrière. Pour effectuer la capture instantanée et enregistrer une copie du projet dans son état suivi, une validation doit être effectuée..
git commit -m 'Premier commit'
Ci-dessus, nous avons créé un nouveau commit et fourni le message "First commit". Avec cela, notre premier engagement est terminé et le camion est parti pour l'usine, avec une copie du projet à l'arrière..
Pour vérifier votre travail, utilisez une nouvelle commande: "log".
git log commit 02c934fcaf3de7677273b74d8ad3ed5041066986 Auteur: Jeffrey Way Date: mer 19 déc 15:07:23 2012 -0500 Premier commit
Parfait, un nouveau commit a en fait été créé et il semble également que le commit ait un identifiant de référence unique. Fichier ça pour l'instant.
Si vous vérifiez à nouveau le statut.
statut git
Comme aucune modification n'a été apportée depuis le dernier commit, Git nous le dit autant:
# Sur branche master rien à commettre (répertoire de travail propre)
Succès! 90% de votre utilisation de Git suivra ce cycle.
Faire des changements
Ajouter des fichiers à la zone de transfert
Effectuer une validation avec un message décrivant l'action qui a eu lieu
Rincer et répéter!
Passons à l'étape suivante. Comme exemple simple, nous souhaitons peut-être inclure une feuille de style de réinitialisation simple dans notre projet. Nous allons écrire le plus fondamental (peut-être mal avisé) des réinitialisations.
Maintenant, retournez à index.html et incluez une référence à ce fichier:
En règle générale, si vous pouvez décrire à la personne assise à côté de vous le changement que vous venez d’apporter à un projet, celui-ci mérite probablement un engagement. S'engager souvent. Faisons cela maintenant; retour au terminal!
git add. git commit -m 'Ajouter et inclure une feuille de style de réinitialisation.'
Lors de la rédaction de messages de validation, il est généralement considéré comme la meilleure pratique d'écrire au présent. Donc, "ajouter un fichier" au lieu de "fichier ajouté".
Passez rapidement à demain et votre patron vous dit maintenant qu'il ne veut pas utiliser votre fichier de réinitialisation simple. Au lieu de cela, ils préféreraient utiliser la populaire feuille de style Normaliser, de Nicolas Gallagher.
Aucun problème; avec Git, c'est une solution facile. Revenons au commit précédent et apportons les modifications nécessaires.
git revenez HEAD
Avec Git, la règle est "ne jamais réécrire l'histoire".
Cette commande annule toutes les modifications que vous avez apportées à la dernière validation. En gros, c'est un commit qui fait exactement le contraire de ce que faisait le précédent. Pourquoi revenir en arrière, au lieu d'annuler entièrement le commit? Encore une fois, parce que nous suivons les meilleures pratiques. Avec Git, la règle est "ne jamais réécrire l'histoire". Annuler les modifications, mais ne jamais les effacer et les annuler.
En appuyant sur entrer, vous serez amené à un nouvel écran avec le texte, "Rétablir" Ajouter et inclure une feuille de style de réinitialisation. " À ce stade, vous êtes en mode Vi (même si vous êtes libre de configurer Git pour utiliser l'éditeur de code de votre choix.) Pour l'instant, définissez les valeurs par défaut, enregistrez et quittez. Accomplissez ceci en tapant: wq (Write and Quit).
Et avec cette commande unique, les modifications ont été annulées. Allez-y et vérifiez pour vous assurer. Le fichier style.css a été supprimé et il n'y a plus de référence à la feuille de style dans index.html. C'est le pouvoir de Git! Étant donné que nous avons souvent adopté un style de développement consistant à engager, lorsqu'il est placé dans des situations où les modifications doivent être inversées, une seule commande suffit. Pas plus pressant Command-Z pour l'enternité!
Suite à la demande du patron, mettons à jour le projet pour qu'il utilise Normalize.css, que nous avons téléchargé et placé dans css / normalize.css..
Dans index.html, référencez-le:
Et enfin, nous engageons les modifications.
git add. git commit -m "Include Normalize dans le projet"
Bien que ce soit certainement un exemple simple, imaginez l’utilité de cette technique pour les modifications plus importantes, qui s’étendent sur plusieurs fichiers de votre application. En regroupant toutes les modifications associées dans un même commit, nous obtenons un maximum de flexibilité et de sécurité..
Pièce à expérimenter
Vous avez déjà été à un moment donné dans un projet, lorsque vous souhaitez expérimenter une idée qui pourrait ou non figurer dans l'application finale? S'il est vrai que vous pouvez toujours annuler le commit si les choses ne se passent pas comme prévu, c'est une idée plus intelligente, pour diverses raisons, de tirer parti de la création de branches..
La meilleure façon d’illustrer le concept de branche Git est de faire référence à Back to the Future 2..
Sur cette note, si vous êtes un développeur ringard et n'avez pas regardé la trilogie Retour vers le futur, arrêtez ce que vous faites et regardez-le.!
Continuez, rappelez-vous la partie de Back to the Future 2, après le retour de Marty et Doc en 1985, mais trouvez que tout est différent? Lorsqu'il se réunit chez Doc, le laboratoire maintenant détruit, Doc dessine un diagramme décrivant comment, à un moment donné, "la chronologie s'est faussée dans cette tangente, créant une alternative en 1985". C'est comme ramifier!
Considérez notre projet de démonstration actuel; À l'heure actuelle, il y a un calendrier: une ligne droite. Dès que nous créons une branche pour travailler sur notre idée, nous rompons avec cette chronologie et en créons une autre. À ce stade, les deux calendriers existent et peuvent contenir leurs propres commits respectifs, sans interférer les uns avec les autres.
Comment est-ce utile? Envisagez un cycle de développement agile - un cycle dans lequel vous ou votre équipe déployez des mises à jour plusieurs fois par semaine. Si vous vous en tenez à l'approche "chronologie unique", le déploiement, par exemple, d'une simple correction de frappe, ne sera pas possible avant que vous n'ayez également travaillé sur votre idée. Avec la création de branches, cependant, nous avons la possibilité de prendre le temps dont nous avons besoin, tout en libérant la branche principale (la branche par défaut et principale) pour le déploiement du correctif de typo..
Pour créer une nouvelle branche, exécutez:
idée de branche $ git idée de caisse $ git
Sinon, combinez ces deux commandes en une seule.
git checkout -b idea
Cela se traduit par: créer une nouvelle branche, appelée "idée" (remplacer ceci pour être plus descriptif de ce sur quoi vous travaillez, bien sûr), et basculer vers elle.
À partir de ce moment, toutes les modifications et les commits que vous apportez ne seront pas référencés dans la branche principale. Allez-y, essayez-le. Editez index.html et faites une petite modification:
Nous avons maintenant effectué notre premier engagement dans cette nouvelle chronologie. Notre idée fictive a encore besoin de travail, mais nous y allons! Mais, à présent, un client vient de signaler une faute de frappe que nous devons corriger au plus vite. Comme nous utilisons correctement les branches, nous pouvons revenir à la branche principale, corriger la faute de frappe et la déployer..
git checkout master # correction d'une faute de frappe git add index.html git commit -m 'Correction d'une petite faute de frappe' git push
Une fois que notre fonctionnalité est terminée, il est temps de la fusionner dans la branche principale..
idée de fusion git master
Si tout se déroule comme prévu, votre branche sera réintégrée dans la branche principale, ce qui résoudra le deuxième scénario de 1985!
Cela dit, vous rencontrerez sans aucun doute des situations, lorsque Git semble planter ses pieds dans le sol et refuse de continuer comme demandé. Dans ces cas, Git n'est pas un imbécile sans raison! Très probablement, le problème est lié à un conflit qui doit d'abord être résolu, avant que Git puisse procéder. Imaginez que vous essayez de fusionner un fichier dans la branche principale; le seul problème est que, depuis la création de la branche, le fichier a été modifié à la fois dans la branche de fonctionnalité et dans le fichier principal. Dans de telles situations, comment Git pourrait-il savoir quelle version du fichier doit prendre le dessus, lors de la fusion des deux? Ce n'est pas, et c'est ce que nous appelons un conflit.
Fusion automatique index.html CONFLICT (contenu): Conflit de fusion dans index.html Échec de la fusion automatique; résoudre les conflits puis commettre le résultat.
Avant que Git puisse continuer, vous devez résoudre le conflit en modifiant index.html.
Ignorer des fichiers
Il arrivera probablement un moment où vous déterminerez qu'il est préférable de ne pas suivre certains types de fichiers avec Git. Les exemples peuvent inclure les fichiers .DS_STORE courants (avec lesquels les utilisateurs de Mac seront familiers), des répertoires de construction et des ressources compilées temporaires..
Assez facilement, Git, via un fichier .gitignore, nous permet d’ignorer certains types de fichiers. Pour l'utiliser, créez un nouveau fichier .gitignore à la racine (sans toutefois s'y limiter) de votre projet. Dans ce document, fournissez une liste de fichiers ou de types de fichiers à ignorer. Voici un exemple de base:
.DS_STORE construire / * .log * .sql * .exe
Codage social
GitHub rend le codage social possible.
Jusqu'à présent, vous avez appris à commettre votre code localement. Mais comment ces modifications peuvent-elles être partagées avec votre équipe ou avec le reste du monde? Entrez GitHub.
GitHub vous permet de partager votre code avec le monde entier. C'est la plus grande communauté open source existante.
Une fois que vous avez créé un nouveau compte sur github.com, vous devrez suivre quelques étapes pour générer une clé spéciale afin d’associer votre ordinateur à votre compte GitHub. Ne t'inquiète pas si vous suivez les étapes, vous ne devriez pas avoir de problèmes.
À ce stade, nous pouvons créer un nouveau référentiel et pousser notre petit projet à le partager avec le monde entier. Une fois connecté, cliquez sur le bouton "Nouveau référentiel", attribuez un nom à votre référentiel, puis cliquez sur "Créer un référentiel". Ensuite, quelques commandes que vous pouvez coller dans le terminal vous seront présentées. Comme nous avons déjà un repo existant, nous avons besoin de la deuxième option:
git remote ajouter l'origine https://github.com/USERNAME/project.git git push -u origine master
Ceci indique à Git d’ajouter notre nouveau référentiel distant et de l’aliaser comme "origine". Ensuite, nous poussons la branche principale (pas l’idée) vers la télécommande avec l’alias «origine».
C'est tout! Retournez dans le navigateur, actualisez la page et vous trouverez votre nouveau référentiel en attente de partage avec le reste du monde..
Lorsque les autres membres de votre équipe souhaitent intégrer les modifications que vous avez apportées, il leur suffit d'exécuter:
git pull
Cette commande extraira les dernières mises à jour qui ont été envoyées à GitHub! En plus du partage de code, GitHub offre également la possibilité de suivre et de contribuer aux projets open source populaires, ainsi qu'un outil de suivi des problèmes pour les bogues et les demandes de fonctionnalités. C'est le codage social à son meilleur!
Pensées finales
Même si nous n'avons fait qu'effleurer la surface de ce dont Git est capable, la vérité est que, encore une fois, pour 80% de votre utilisation de Git, les techniques référencées dans cet article suffiront. Créez une branche de fonctionnalité, écrivez du code, ajoutez-le à la zone de stockage intermédiaire et validez-le avec un message. Lorsque vous êtes prêt, fusionnez-le dans la branche principale et déployez-le! Ensuite, rincer et répéter!
N'oubliez pas: StackOverflow est votre meilleur ami quand vous êtes perplexe. Quel que soit le problème, d'autres se sont trouvés exactement dans la même situation. Cherchez là d'abord.
Share
Accentsconagua
