Share
Parliamo di GitHub Pages; cosa sono e come è possibile utilizzare il servizio in pochi minuti per distribuire gratuitamente pagine statiche. Iniziamo!
Secondo GitHub, GitHub Pages sono:
... pagine web pubbliche liberamente ospitate e facilmente pubblicate attraverso il nostro sito.
Cosa significa questo per voi? Significa hosting libero e affidabile di contenuto statico. In generale, questo è stato creato da GitHub per supportare progetti open-source ospitati su GitHub dando loro un posto dove offrire documentazione, demo o qualsiasi altra esperienza interattiva fornita per integrare il codice nel repository.
Tuttavia, le pagine GitHub possono essere utilizzate per una varietà di progetti e già supportano Jekyll (un potente generatore di siti statici basato su Ruby). Quindi, impariamo come usarlo!
Dovrai registrarti per un account GitHub prima di poter iniziare con le pagine di GitHub. Per ottenere il massimo beneficio da GitHub, si consiglia vivamente di impostare le chiavi SSH. Fondamentalmente, le istruzioni a questo link ti consentono di collegare in modo sicuro il tuo computer con il tuo account GitHub e tutti i tuoi repository su GitHub. Dopo aver creato un account GitHub e registrato le tue chiavi, puoi facilmente scaricare l'app GitHub per Mac o GitHub per Windows, entrambi ufficialmente supportati da GitHub.
GitHub è un posto dove le persone possono memorizzare il loro codice. Git è un potente sistema di controllo delle versioni che consente agli sviluppatori di tenere traccia delle modifiche apportate al codice in incrementi, chiamate impegna, e traccia i diversi percorsi di un particolare progetto usando rami.
Ci sono molte funzionalità di Git, e ancora più potere è bloccato in GitHub, ma per ora resteremo concentrati su GitHub Pages. Se vuoi saperne di più su GitHub, dai un'occhiata a Git for Designers, a Git & GitHub: A Beginner's Guide, che include ulteriori informazioni sulle chiavi SSH, oltre a alcune funzionalità Git di base che vanno oltre lo scopo di Questo articolo.
Esistono vari modi per utilizzare GitHub Pages. Inizieremo con uno dei modi più veloci.
Generatore automatico di pagine consente agli utenti di creare la propria pagina utilizzando Markdown, un linguaggio di marcatura leggibile dall'uomo progettato per aiutare i creatori di contenuti a produrre facilmente documenti con un insieme coerente di linee guida per il markup.
Quindi, come si usa il generatore di pagine automatiche? Innanzitutto, ti consigliamo di creare un repository. Se si desidera che il repository punti a your-username.github.com, creare un repository corrispondente a tale nome. Ad esempio, il mio repository personale è chiamato jcutrell.github.com. Per accedere al generatore di siti statici, vai alle impostazioni di quel repository (accessibile da un URL che segue il formato https://github.com/username/projectname/settings). Questo mostrerà un editor, che è alimentato da un editor di testo RTF Markdown. È possibile copiare automaticamente nel file standard Readme.md oppure modificare il contenuto a propria scelta. Inoltre, il generatore automatico ha anche uno spazio per il tracciamento di Google Analytics.
Dopo aver aggiunto tutti i contenuti pertinenti, puoi passare al selettore di layout. Con più temi tra cui scegliere, questa è una grande opzione per dare immediatamente agli utenti una landing page senza sforzo, basata sul tuo file Readme che richiede semplicemente di mantenere aggiornata la documentazione (qualcosa che dovresti già fare). Puoi anche estrarre queste pagine dalla loro origine, modificarle localmente e quindi reinserirle.
Se vuoi usare l'app GitHub per controllare il tuo repository GitHub, ecco come potresti farlo.
Innanzitutto, ti consigliamo di installare l'app da mac.github.com o windows.github.com e seguire le semplici istruzioni di installazione.
Quindi, scegli un repository che vuoi clonare sul tuo computer selezionando il tuo nome utente GitHub a sinistra e facendo clic Clona al computer.
Quindi, configura la posizione e il nome su cui vuoi clonare il repository.
Quindi, selezionare la scheda dei rami a sinistra e selezionare GH-pagine ramo che è stato creato dal generatore. È quindi possibile apportare le modifiche localmente nella posizione specificata in precedenza.
Una volta che sei pronto a spingere alcune modifiche per essere dal vivo, vai al i cambiamenti scheda e creare un commit con il modulo in alto a sinistra.
Infine, seleziona il rami scheda e fare clic pubblicare a destra del ramo gh-pages. Questo invierà tutte le modifiche apportate a GitHub.
Se vuoi usare la riga di comando per controllare il tuo repository GitHub, ecco come potresti farlo.
git clone [email protected]: username / projectname.git git checkout gh-pages
Se hai generato una pagina utente (anziché un singolo progetto), il ramo principale è il ramo delle pagine di GitHub. Basta clonare il progetto utente per modificarlo localmente.
git clone [email protected]: username / username.github.com.git git checkout master # questo dovrebbe essere già verificato per impostazione predefinita
Tuttavia, il generatore automatico potrebbe non essere la soluzione al tuo problema. Forse hai già costruito il tuo sito staticamente e stai semplicemente cercando di implementarlo da qualche parte.
Questa seconda opzione è semplice come sembra. Per fare in modo che le pagine di GitHub funzionino con contenuti locali arbitrari, devi prima creare il repository su GitHub.
Se hai deciso di utilizzare l'app GitHub, ecco come crei le tue pagine di manuale.
Seleziona il I miei repository scheda cartella, quindi fare clic sulla freccia nel repository con il quale si desidera creare GitHub Pages. Se al momento non disponi di repository con cui avviare la procedura, puoi crearne uno dall'app.
Se stai creando GitHub Pages usando username.github.com, il ramo principale è il ramo delle pagine, quindi puoi andare avanti e aprire il progetto in una cartella locale, saltando la creazione del file GH-pagine ramo. Se stai creando GitHub Pages per un progetto, ti consigliamo di creare un nuovo ramo chiamato GH-pagine; fare clic sul pulsante sul lato destro del repository, quindi fare semplicemente clic sul pulsante + sul lato destro del ramo corrente.
Questo ti permetterà di inserire il nuovo nome del ramo.
Per impostazione predefinita, il nuovo ramo avrà tutti i file di progetto correnti, quindi ti consigliamo di rimuovere tutti i file nel progetto mentre il GH-pagine ramo è selezionato. (Per essere sicuro, assicurati che l'indicatore "current branch" mostri che ti trovi nel ramo gh-pages, a meno che tu non stia creando pagine per username.github.com.)
Quindi, è possibile creare un sito statico direttamente nella cartella del progetto.
Una volta creato il sito statico nella cartella del progetto, si tornerà all'app GitHub e si passerà al i cambiamenti scheda a sinistra. Questo mostrerà tutte le modifiche che hai fatto, inclusa la cancellazione dei file originali. Crea un impegno compilando il modulo in alto a sinistra. Una volta fatto questo, puoi tornare alla scheda dei rami e pubblicare il ramo gh-pages (o il ramo master, se stai creando pagine per username.github.com). Questo è il passaggio che spinge il tuo codice a GitHub e avvia il sito statico sul server.
Puoi anche clonare facilmente il repository attraverso la riga di comando selezionando l'URL nella parte superiore della pagina del progetto ed eseguendo il seguente comando.
git clone [email protected]: username / projectname.git
Successivamente, dovrai creare un nuovo ramo chiamato GH-pagine; questo ramo deve essere completamente vuoto, anche. Esegui questi comandi:
git check -orp gh-pages git rm -rf. git commit -am "initial pages commit"
(Per ulteriori informazioni, consultare la documentazione ufficiale).
Questo farà scendere il progetto in una cartella chiamata Nome del progetto (qualunque sia il tuo progetto) nella tua attuale directory di lavoro, e automaticamente avrà anche GitHub come origine remota. Fondamentalmente questo significa che puoi creare file e apportare modifiche, quindi seguire i prossimi comandi per tenere traccia di quei file e modifiche e inviarli a GitHub.
git status # recupera ed echos lo stato corrente del repository; questo mostrerà i nuovi file e le modifiche non tracciate aggiungere git. # questo aggiunge tutti i nuovi file creati git commit -am "Ecco il mio commit iniziale" # questo crea un commit sul tuo ramo corrente (di default, il ramo master) git push origin gh-pages #questo spinge il ramo gh-pages indietro a GitHub.
Questo processo verrà ripetuto durante tutte le iterazioni del tuo sito mentre apporti le modifiche. Funziona alla grande, ma cosa succede se vuoi ospitare un blog statico? Probabilmente la piattaforma di blogging statico più popolare, Jekyll, è supportata dalle pagine di GitHub per impostazione predefinita. (Jekyll è stato creato da un membro del team di GitHub.)
Per usare Jekyll con GitHub Pages, devi prima creare un sito Jekyll localmente. Puoi compilare localmente oppure puoi consentire a GitHub di compilare per te. Per iniziare, puoi seguire questa guida su Octopress, una struttura che astrae alcune delle funzioni di base di Jekyll.
In alternativa, puoi creare un sito Jekyll raw. Per prima cosa, dovrai installare la gemma jekyll. Generalmente, questo significa eseguire il seguente comando:
gem install jekyll
Se hai installato RubyGems, questo dovrebbe tirare l'ultima versione stabile.
Dai un'occhiata alla guida all'uso e a questa guida su NetTuts. Sarà necessario creare la struttura di base del file prima che Jekyll possa generare un sito. Per iniziare subito a dare un'occhiata a Jekyll-Base di Daniel McGraw, che definisce la struttura dei file necessaria a Jekyll per generare un sito. Ho anche impiegato alcuni momenti per creare uno script riutilizzabile chiamato jekyll_structure. Seguire le istruzioni di installazione; se non funziona per te, crea semplicemente la seguente struttura.
.
| - .gitignore
| - README
| - _config.yml
| - _layouts
| | - layout.html
| '- post.html
| - _posts
| '- 1985-10-26- Test-Post.md
'- index.html
La configurazione principale per Jekyll verrà inserita nel _config.yml file. _layouts manterrà i layout che verranno utilizzati alla generazione.
Una volta creati post e pagine e successivamente modificati, puoi semplicemente aggiungerli al tuo repository git e commetterli, come spiegato in precedenza:
aggiungi git. git commit -am "Aggiunto un nuovo post" git push origin gh-pages # o git push origin master per le pagine username.github.com
Nota: è tanto più facile da usare framework come Octopress o Jekyll Bootstrap per generare automaticamente post e pagine per Jekyll, con comandi simili rake new_post ["Post Name Goes Here"] invece di creare manualmente i tuoi file post o pagina.
È importante ricordare che i repository impostati come privati su GitHub creeranno pagine pubbliche. GitHub ha creato questa funzionalità per i progetti per pubblicare facilmente la documentazione; questo è centrato attorno all'idea di apertura. I siti statici ospitati su GitHub non saranno nascosti da nessuno in qualsiasi momento.
Non limitarti al design o alla struttura che è predefinita nelle pagine generate automaticamente da GitHub. Questi sono facilmente modificabili semplicemente trascinando il repository sul computer locale, apportando le modifiche e inviandole.
Più apprendi su Git e GitHub, più sarai a tuo agio con GitHub Pages. Dai un'occhiata a questo post su Treehouse, così come questo tutorial Tutsplus di Jeffrey Way su GitHub per Designer.
Se desideri reindirizzare il tuo dominio su un dominio GitHub Pages, consulta questa guida nella pagina della guida di GitHub per iniziare. Chissà, forse puoi sbarazzarti del tuo provider di hosting personale e diventare tutto statico!
GitHub Pages è estremamente comodo da usare, specialmente se abbinato ad altri strumenti come Jekyll. Imparare gli strumenti di cui GitHub Pages dipende ti aiuterà a diventare uno sviluppatore e progettista front-end migliore e più prezioso, ed è un ottimo modo per mostrare i tuoi progetti. Inoltre, GitHub fornisce questo servizio gratuito a tutti, quindi il costo per iniziare è limitato al valore del tempo che si spende nell'apprendimento. Che cosa state aspettando? Gettarsi!
Accentsconagua