Controllo della versione principale per team remoti

Sep 15, 2025
Come si fa
Version control

Lavorare da remoto è diventato molto più comune nello sviluppo web negli ultimi anni. Prima del controllo della versione, lavorare da remoto sullo stesso progetto di sviluppo sarebbe stato un incubo assoluto. Gli sviluppatori avrebbero dovuto Invia file di grandi dimensioni l'un l'altro (probabilmente attraverso l'e-mail), incollando nel proprio codice prima di inviarlo indietro. Non c'era un vero modo per tenere traccia di ciò che era stato aggiunto e quando.

  • 6 abilità must-hanno per i giovani sviluppatori web

Per fortuna, il controllo della versione è arrivato e ha fatto sviluppo su tutti i fronti molto più gestibili. I progetti Web sono diventati molto più facili da implementare e gestire, specialmente quando si tratta di lavorare in un team di sviluppo remoto. Non devi più preoccuparti della versione corrente di un sito web sovrascritto: ogni membro del team è libero di lavorare su qualsiasi file in qualsiasi momento, non c'è confusione da dove viene memorizzata l'ultima versione di un file - e in alto deposito cloud. Aiuta anche con il processo.

In questo tutorial, stiamo andando usando Github. per gestire il nostro codice. Ci sono numerosi tipi diversi di strumento di controllo della versione là fuori, come Bitbucket e TFVC, ma anche se sono tutti diversi, i principi rimangono gli stessi quando si tratta di gestire il codice.

Per ulteriori modi per semplificare il processo di costruzione del sito, vedere le nostre guide in alto Builder del sito web e web hosting servizio.

Modello di ramificazione

Innanzitutto, è molto importante avere un modello di ramificazione di successo quando si lavora in qualsiasi squadra per rendere lo sviluppo e il processo di implementazione correre senza intoppi. È probabile che tu abbia più sviluppatori più sviluppatori che lavorano sullo stesso progetto. Quando si lavora con una forza lavoro remota, credo che il miglior flusso di lavoro sia composto da tre rami principali e una serie di temporanee:

  • Sviluppare il ramo: Ogni riga di codice è stata testata e convalidata dal cliente.
  • Ramo di staging: Ciò corrisponderà all'ambiente di convalida.
  • RILASCIO RAMI: Questo contiene l'ultima versione del tuo sito web in produzione.

Ci sarà anche un insieme di rami di caratteristiche. Tuttavia, questi saranno solo temporanei per costruire inizialmente le nuove funzionalità.

Più sviluppatori su un progetto

Version control: Branching model

Il miglior flusso di lavoro è composto da tre rami principali: sviluppare, stagando e rilascio

Supponiamo che tu gestisca una squadra con due sviluppatori che lavorano da remoto. Li chiameremo Sarah e James: stanno entrambi lavorando allo stesso sito di e-commerce per un cliente. Sarah ha bisogno di sviluppare una funzionalità che registra i dettagli del cliente.

Ci abbatteremmo in tre storie utente separate - Aggiunta, modifica e rimozione - e quindi aggiungere questi tre biglietti nel backlog Sprint.

Caratteristiche rami

Version control: Feature branches

Aggiunta di un ramo di funzionalità per lo sviluppo di una funzionalità dei dettagli del cliente e aggiungendo un ramo di una storia utente per l'attività Aggiungi detagli

Quindi, diciamo che Sarah inizia sulla sezione aggiunta dei dettagli del cliente. Avrebbe bisogno di creare il filiale delle caratteristiche "Dettagli clienti" e una storia utente uno per il primo compito "aggiungi-detagli".

 Git Checkout sviluppa e amplificatore; & amp; Git Pull Origin / Sviluppa
GIT Checkout -B Caratteristica / Dettagli del cliente
Git Checkout -b Aggiungi-Dettagli 

Sarah continuerebbe a lavorare sulla filiale temporanea "Address" localmente e commettere il suo lavoro mentre si sviluppa. Ora, diciamo che James vuole aiutare Sarah con la funzione dei dettagli del cliente, quindi inizia a lavorare sulla cancellazione dei dettagli.

James tirerebbe l'ultima versione del ramo condiviso e creerebbe un nuovo ramo per la storia dell'utente 'Elimina-Detail Details'. Poi può iniziare a fare le proprie aggiunte senza preoccuparti della sovrascrittura del codice di Sarah.

 Funzione Git Checkout / Dettagli clienti
GIT Pull Origin / Funzione / Dettagli clienti
Git Checkout -B Elimina-Dettagli 

Utilizzerà anche la sua filiale temporanea per il codice localmente e commettere qualsiasi cambiamento. Una volta che Sarah ha terminato la sua caratteristica localmente, mette il biglietto nella revisione del codice. Avrebbe spinto il suo codice al ramo di staging e aprire una richiesta di tiro con l'ambiente di stadiazione.

 // Spinge il suo codice verso il ramo di staging
Git Push Origin Aggiungi Dettagli
// Apre una richiesta di tiro con l'ambiente di stadiazione
Richiesta di requisiti GIT-Pull Staging Aggiungi-Dettagli 

Avremmo ora i dettagli del cliente. Funzionando il ramo e le due filiali della storia dell'utente in Sviluppo "Aggiunta di detagli" e "Dettagli Dettagli".

Fusione

Version control: Adding new branch

Creazione di una nuova filiale per la storia dell'utente Elimina-Dettagli, consentendo di effettuare aggiunte senza preoccuparti di sovrascrivere il codice di un'altra persona

Una volta che il suo codice è stato rivisto, può unire il suo ramo in scena. Il biglietto è ora nella colonna di convalida, in attesa della convalida dallo sviluppatore principale.

 // Ottiene l'ultima versione del ramo di staging
Git Checkout Staging & amp; & amp; GIT Pull Origin / Staging
Git Merge Aggiungi-Dettagli & amp; & amp; GIT Push Origin Staging
// costruisce l'ambiente di convalida
// e chiede al proprietario del prodotto di convalidare 

Una volta che il lavoro di Sarah è stato convalidato, il biglietto può essere spostato nella colonna Fine. Possono unire il suo lavoro nel ramo del feature e iniziare un'altra storia utente, come la cancellazione dei dettagli del cliente.

 // Tira l'ultima versione del ramo della funzione
Caratteristica Git Checkout / Dettagli clienti
Funzione di origine del tiro git / Dettagli del cliente
Git Merge Add-indirizzo e amp; & amp; GIT Push Origin Feature / Dettagli clienti 

Quando l'intera caratteristica è stata convalidata sia dallo sviluppatore che dal cliente, la Sarah può unire il filiale della funzione in difficoltà, poiché è pronto per andare.

 // Ottiene l'ultima versione del ramo di sviluppo
Git Checkout sviluppa e amplificatore; & amp; Git Pull Origin / Sviluppa
GIT Merge Feature / Cliente-Dettagli & amp; & amp; GIT PUSH ORIGIN Sviluppa 

Distribuisci alla produzione

Version control: Deployment

Una volta pronto a schierare, unire si è sviluppato in versione e avviare la distribuzione

Una volta tutto completato ed è pronto a schierare in produzione, James Miscelle si sviluppano in versione e avvia la distribuzione. A questo punto avrebbe saputo che tutto il codice è corretto e il cliente è felice. Tagga l'impegno del rilascio per ottenere la storia di ogni versione.

 Git Checkout sviluppa e amplificatore; & amp; Git Pull Origin / Sviluppa
Git Checkout Release & amp; & amp; Git Pull Origin / Release
Git Merge Sviluppo & amp; & amp; Git Tag 2.1.
Git Push Origin Release --Tag 

Regole da seguire per questo flusso di lavoro

Questo flusso di lavoro di sviluppo remoto può essere piuttosto difficile da capire all'inizio, ma se si ottiene la tua squadra a lavorare con questo metodo, allora hai un flusso di lavoro gratuito senza la necessità di prendere dal panico dei file sovrascritti o dei tuoi sviluppatori che lavorano sulla stessa area.

Ci sono alcune cose chiave da ricordare:

  • La prima cosa di cui hai bisogno per insegnare ai tuoi sviluppatori remoti è il tuo flusso di lavoro di controllo della versione e assicurati che stiano tutti leggendo dallo stesso libro.
  • Se stai sviluppando una funzionalità, prova a romperla in storie utente più piccole. In questo modo è più facile tenere traccia di ogni commit.
  • Non perdere alcun passaggio: lo stesso flusso di lavoro deve essere seguito ogni volta.
  • Avrai sempre bisogno di unire il tuo ramo in difficoltà per preparare la prossima versione.
  • È necessario pulire il repository di messaggistica ogni settimana se possibile. Dovresti cancellare il ramo di staging, localmente e da remoto, e ricrearlo dallo sviluppo del ramo - vedi esempio seguente:
 Git CO Sviluppo & amp; & amp; Git Pull Origin / Sviluppa
Git Branch -D Staging & amp; & amp; GIT PUSH ORIGINALE - STAGAGGIO DIGETE
GIT CO -B-STAGING E AMP; & AMP; Staging di origine del tiro git 

Flussi di lavoro aggiuntivi

Con progetti più piccoli, potresti voler usare un flusso di lavoro meno complesso. È possibile utilizzare il master, che contiene la versione più aggiornata, un ramo di sviluppo e quindi una serie di rami per ciascuna caratteristica aggiuntiva, indipendentemente dal fatto che sia il forum, il modulo di contatto, il sistema di checkout. Tutto dipende dalla tua preferenza personale.

Gestire i conflitti di unione

Affrontare i conflitti di unione è abbastanza difficile se tutti lavoricino nella stessa stanza, ma possono diventare ancora più di un incubo se stai tutti lavorando in un ufficio diverso. La cosa più importante è ricordare che puoi sempre annullare un unione e tornare allo stato prima che si sia verificato il conflitto.

Sia che tu stia facendo tutti i fusioni come sviluppatore di piombo o la tua squadra sono le loro facendo in modo indipendente, il primo passo è capire cosa è successo.

  • Uno dei tuoi co-sviluppatori ha modificato la stessa linea nello stesso file?
  • Hanno eliminato un file che hai modificato?
  • Hai aggiunto un file con lo stesso nome?

Git ti dirà che tu hai Percorsi increspati attraverso Stato Git :

 Stato $ Git
# Sul sistema di aggancio del ramo
# Hai dei percorsi incernierati.
# (correggi conflitti ed esecuzione "commit git")
#
# Percorsi non ingranditi:
# (Usa "Git Add & lt; File & GT; ..." per contrassegnare la risoluzione)
#
# entrambi modificati: checkout.html
#
Nessuna modifica aggiunta al commit (utilizzare "Git Add" e / o "Git commit -a") 

Ora, la causa più comune di un conflitto è quando le modifiche influenzano gli stessi file sulla stessa riga. Quindi, diamo un'occhiata al contenuto della linea in conflitto. Noterai che Git è davvero bravo nel fatto che contrassegnerà l'area conflittando lo racchiuderò dentro & lt; & lt; & lt; & lt; & lt; & lt; & lt; head; e & GT; & GT; & GT; & GT; & GT; & GT; & GT; [Altro / Branch / Nome] . In questo caso, è Checkout-System. .

 & lt; & lt; & lt; & lt; & lt; & lt; & lt; CAPO
Questa linea è stata impegnata mentre si lavora nel ramo "Modulo utente".
=======.
Questa linea, al contrario, è stata commessa mentre si lavora nel ramo "checkout-System".
& GT; & GT; & GT; & GT; & GT; & GT; & GT; Refs / Heads / Checkout-System 

I contenuti dopo il primo marker provengono dal tuo attuale ramo di lavoro. Dopo le parentesi angolari, Git ci dice di quale ramo è venuto dalle modifiche. Una linea con =======. separa i due cambiamenti contrastanti.

Ora puoi semplicemente aprire il file in un editor, cercare i marcatori di conflitti e apportare modifiche necessarie. Quando hai finito, il file deve sembrare esattamente come vuoi che guarda o, in alternativa, puoi dire a git che vai semplicemente con una delle versioni modificate, chiamate nostro o il loro .

 GIT Checkout --OURS Path / to / conflict-file.html 

Ci sono anche molte applicazioni di strumenti di unione che possono aiutare con questo. Il caleidoscopio è un grande per Mac.

Gestione del progetto e dei problemi

Version control: Issues and problems

Non confondere problemi con problemi: puoi anche utilizzare l'etichettatura del problema per miglioramenti, domande e bug

È altrettanto importante come uno sviluppatore di piombo avere uno strumento di gestione dei progetti per gestire le cose come compiti e bug, specialmente quando i tuoi sviluppatori non sono in ufficio. Ci sono numerose soluzioni là fuori, come Zenhub e Asuna, ma credo che il sistema integrato del progetto e dei problemi di GitHub sia il migliore.

Puoi fare cose come configurare un nuovo progetto, creare schede o assegnare problemi. E non solo confondere problemi con problemi: puoi anche usarlo per miglioramenti, domande e bug, tra le altre cose.

Ecco alcune delle sue migliori caratteristiche:

  • Sistema di tagging integrato: Consente di organizzare e dare priorità al flusso di lavoro e facilmente cercare attraverso progetti per informazioni pertinenti.
  • Pietre miliari: Perfetto per associazione di problemi con caratteristiche specifiche o fasi di progetti, come bug che devono essere fissate prima di essere completato un lancio o attività beta da completare in ottobre.
  • Multi incarichi: I problemi possono essere assegnati agli utenti alla rinfusa, risparmiando tempo e renderti più efficiente.
  • Commentando: Ingegneri e team di gestione possono facilmente discutere dei progressi e dei risultati in ogni fase del modo utilizzando il sistema di commenti incorporato.
  • Elenchi attività: I problemi più grandi possono essere suddivisi in fasi per scoraggiare la creazione di dozzine di problemi microscopici, mantenendo tutto il tuo lavoro nello stesso posto.
  • Formato Markdown: La capacità di utilizzare la formattazione dei markdown si dimostrerà popolare con i tuoi sviluppatori e può essere utilizzato nella maggior parte dei luoghi intorno al GitHub.
  • Schede del progetto: Questi possono essere utilizzati per ospitare problemi, tirare richieste e note, categorizzandole come carte in colonne della tua scelta in modo da poter guardare progetti più grandi nel suo complesso.
  • Alta sicurezza: Puoi fidarti del GitHub per mantenere i tuoi dati al sicuro ed è più difficile da violare rispetto alla maggior parte degli altri sistemi di gestione del progetto.

Impostazione di un progetto

Se vai a GitHub e poi vai a uno dei tuoi repository, vedrai una scheda che si chiama progetti. Da lì è possibile selezionare Nuovo progetto, configurare i dettagli del progetto e creare un nuovo modello di progetto.

Se ora si seleziona la scheda Problemi che è lungo la parte superiore e seleziona il nuovo problema, sarai in grado di creare un nuovo problema. Puoi quindi applicare varie etichette - queste sono cose come bug, miglioramento, domanda e duplicazione. Potresti anche utilizzare il miglioramento per una nuova funzionalità o una richiesta. Puoi quindi assegnare vari membri del team all'attività, una pietra miliare e anche il progetto appena creato.

I membri assegnati avranno quindi un elenco di tutti i loro compiti e si può persino utilizzare la scheda del progetto per mantenere una traccia di ciò che è attualmente costruito. Se ricordi il nostro precedente tutorial, stavamo parlando di biglietti in movimento per sprint backlog e convalida. Quindi GitHub funziona davvero bene come uno strumento all-in-one per supervisionare un progetto.

Questo articolo è stato originariamente pubblicato in emissione 311 di netto , la rivista best-seller del mondo per web designer e sviluppatori. Acquista il problema 311 qui o Iscriviti qui .

Articoli Correlati:

  • Come avere successo come sviluppatore freelance
  • Sviluppare componenti reagibili riutilizzabili
  • 4 Suggerimenti per sviluppare le tue abilità di sviluppatore

Come si fa - Articoli più popolari

10 modi per costruire migliori ambienti mondiali 3D

Come si fa Sep 15, 2025

[Immagine: Albert Valls Punsich] Se vuoi rimanere in cima al tuo gioco come artista 3D, è importante risuonare le tu..


Crea un effetto di testo al neon incandescente

Come si fa Sep 15, 2025

Spesso, sono gli effetti più semplici che sembrano più sorprendenti e il testo al neon è uno di questi progetti. È anche molt..


Fai effetti interattivi di tipografia 3D

Come si fa Sep 15, 2025

La tipografia ha sempre svolto una parte importante nell'arsenale di strumenti di qualsiasi designer in quanto selezionano il tip..


4 semplici passaggi per migliorare il tuo rendering

Come si fa Sep 15, 2025

L'uso di luci a cupola è stato uno dei maggiori progressi della creazione CGI negli ultimi decenni. Bagnare una scena da ogni di..


Come creare una lampada Lava con tasti

Come si fa Sep 15, 2025

C'è qualcosa di stranamente soddisfacente delle lampade di lava. Una leggera calmante, colorata e ipnotizzanti blob certizzanti ..


Dipingi un ritratto in stile munch in Photoshop cc

Come si fa Sep 15, 2025

Come parte del suo Tesori nascosti della creatività Progetto, Adobe ha trasformato i pennelli secolari usati da E..


Usando strumenti vettoriali: un approccio di Web Designer

Come si fa Sep 15, 2025

Se sei un web designer, c'è una buona possibilità che Photoshop sia attualmente aperto e in esecuzione sul tuo computer. Affrontiamolo - Photoshop è sempre stato il cavallo da lavoro e il ..


L'anatomia della caricatura: 15 migliori consigli

Come si fa Sep 15, 2025

Come libero professionista a tempo pieno, sono abituato a lavorare su una gamma di stili e tecniche di disegno . Q..


Categorie