Migliore risposta
Il GitHub Student Developer Pack fornisce le risorse per imposta il tuo firstnamelastname.me dominio senza alcun costo. Nel resto della mia risposta, mi lamento del motivo per cui inizialmente è stato difficile per me, perché potrebbe essere stato un ostacolo per te creare il tuo sito web. Includo una guida breve, in qualche modo completa, pensata per un pubblico di studenti con poca o nessuna conoscenza tecnica, per creare un sito web personale abbastanza pubblico per te stesso (che dovrebbe apparire quando qualcuno il tuo nome su Google).
Perché è davvero difficile creare il tuo sito web
Volendo sapere come funzionano i siti web: In qualità di appassionato di tecnologia delle scuole superiori, ero sempre curioso di sapere come funzionavano i siti web e sono rimasto davvero colpito dalle persone che ne avevano uno proprio. Sembrava tutto così semplice dallesterno, ma ogni volta che cercavo su Google “come funzionano i siti web” e scavo più a fondo, mi perdevo in mezzo a strane abbreviazioni e cose dal suono complicato. TCP, UDP, IP, DNS, IPv6, HTML, JS, CSS: lelenco potrebbe continuare. Il compito di mappare questi concetti astrusi su cose palpabili nei computer che conoscevo era piuttosto difficile e una di quelle cose che richiede unenorme quantità di motivazione per sedersi e andare avanti.
Sulla decisione di creare un sito web solo per capire come funzionano: Ecco una domanda che potresti rivolgere ad alcune aziende tecnologiche esigenti e trovare nella annali di Glassdoor –
Quando digiti “google [dot] com” nel tuo browser web, cosa succede? ( Domanda di intervista a Google: cosa succede quando digiti …)
Anche a metà degli studi di informatica al college, ero un po preoccupato per quanto poco mi dicessero di tutto questo. Per la frustrazione, la cosa più importante per cercare su Google era “come creare un sito web”. Con un sacco di soldi per il marketing, mi sono imbattuto in una miriade di siti Web e termini a cui ancora non riuscivo a dare troppo senso: domini, hosting, GoDaddy, HostGator, routing, CSS, HTML, Javascript, jQuery, WordPress , blogger, ecc. Questo è quello che mi mostra ora:
Ad essere onesti, tutti questi nomi sembravano molto truffatori- y a me, e la loro incomprensibilità ha superato la mia motivazione. Volevo solo avere il mio sito web con il mio nome – debarghyadas.com [ignora lauto promozione] e impara come inserirci dei contenuti.
Sullessere troppo economici per comprare cose su Internet: quando mi sono concentrato su alcuni aveva un po senso. Per creare un sito web, dovrei acquistare un “dominio”, un nome di sito web e un “hosting”, un luogo che contiene il contenuto del mio sito web e lo fornisce, “lo serve”, a questo dominio. Acquista. Non una bella parola data la mia frugalità non così profonda tudente che vive di freeware, non ero troppo entusiasta di distribuire denaro per acquistare cose astratte. Mi ci sono voluti anni per pagare $ 1 per Whatsapp quando era banale spendere $ 4 su quella sontuosa torta di mousse al cioccolato con gelato alla vaniglia.
Dai, potresti essere più imbroglione? “Mangiamo la concorrenza”? Ok, alligatore.
Per molti studenti (e persone), il denaro è una barriera allingresso. Costa circa $ 10 allanno per acquistare un dominio (su GoDaddy) e un importo simile per acquistare hosting su HostGator. E ha comportato il tuo lavoro attraverso numerosi prodotti che non riuscivi a dare un senso. Mi irritava anche il fatto che dovessi pagare su base annuale – non era un acquisto una tantum.
Ricorrere a non essere economici per motivarmi: Alla fine, attraverso un lungo e laborioso processo, ho distribuito i soldi, convincendomi che linvestimento mi motiverebbe ad apprendere le competenze necessarie. Voglio dire, tutti hanno sempre detto che lHTML era semplice, e lo è, ma anche i siti fatti con HTML sembrano una merda. Cera molta confusione.
Alla fine, avevo ragione, però: linvestimento su un dominio e hosting per 5 anni mi ha fatto capire come funzionavano le cose e ho realizzato un sito web personale, e lo ripetevo ogni volta che ne avevo tempo libero.
Una guida abbastanza completa per creare il tuo sito web gratuitamente
Accesso al GitHub Student Developer Pack .Sì, contiene molte cose che non ho mai usato, ma quello che non pubblicizza direttamente (e probabilmente dovrebbe) è che fornisce tutti gli strumenti per far funzionare il tuo sito web sul tuo dominio gratuitamente! Sembra troppo bello per essere vero adesso.
Strumenti del mestiere Qui “una linea guida generale. I non lho provato personalmente, ma immagino che questo sia un buon modo per affrontare le cose. Devi (o dovresti) utilizzare i seguenti servizi a pagamento forniti dallo Student Developer Pack (gratuitamente):
1. Repository privati Github [opzionale]
2. Dominio Namecheap .me
3. Namecheap SSL [opzionale]
4. Hosting DigitalOcean
Inoltre,
1. Bootstrap
2. Diversi tutorial e strumenti online: JSfiddle 3. Alcuni siti di modelli online – StartBootstrap , BootstrapZero
Cosa fare con detti strumenti Cercherò di mantenere questa mini-guida il più semplice possibile . È facile abbandonare termini importanti quando si sa cosa significano, ma può essere un enorme deterrente per i lettori che non hanno idea. Potrei essere più esplicito ed espandere questi termini se così richiesto.
1. Configura un Github privato repository [opzionale]
Quando sei scrivendo molto codice per un progetto, ci sono molte cose che possono andare storte.
- Può essere cancellato dalla tua macchina e tu “re fregato
- Puoi provare ad aggiungere una nuova funzionalità senza eseguire il backup della vecchia versione e arrivare a uno stato in cui dimentica quanti Ctrl + Z (annullamenti) ti servono su quali file tornare allo stato di funzionamento.
- Potresti avere più persone che ci lavorano separatamente sui propri computer e non avere idea di come integrare entrambi i tuoi versione del progetto.
Un programmatore n00b potrebbe suggerire di utilizzare Dropbox per condividere e sincronizzare progetti di codice e se tu “Ci stai lavorando da solo, potrebbe essere una soluzione decente. Tuttavia, dovrai comunque affrontare il secondo problema nellelenco precedente e diventa davvero pazzo quando più persone cercano di lavorare contemporaneamente sulla stessa base di codice.
Git (e ai vecchi tempi, SVN e Mercurial per hipsters) sono usati per “rivedere” il tuo codice. Nota che git non è github. Cioè, puoi apportare modifiche, spingerle “a monte” a gli interweb, dove sono memorizzati in modo permanente nel tuo “repository” (gratuitamente). Git è anche unutilità puramente a riga di comando, il che significa che devi aprire una di quelle schermate di hacker nere dallaspetto spaventoso sul desktop e digitare i comandi Per usarlo. Non è banale da usare. Github si integra con git e ti permette di vedere i repository che hai spinto a monte e fornisce una serie di GUI per eseguire attività git (comportandosi come una normale applicazione sul tuo computer). Puoi sfogliare i tuoi codebase (repository) su Internet dal tuo browser, apportare modifiche, ripristinare le modifiche allultimo checkpoint (commit) e così via.
Github ha sempre fornito repository gratuiti pubblici, il che significava che chiunque poteva vedere il tuo codice e usarlo (sì, ci sono licenze Open Source, ma sai cosa intendo). In sostanza, se dovessi lavorare davvero duramente per progettare roba follemente interessante e reinventare linformatica, il tuo amico potrebbe semplicemente prendere il tuo codice e usarlo per il suo sito web. Ora, con il pacchetto Education, puoi ottenere 5 repository privati gratuiti (sebbene Github fornisse questo servizio anche per gli studenti .edu). Segui i tutorial online e scopri come impostare un repository GitHub privato per il codice del tuo sito web.
2. Ottieni il tuo Namecheap .me domain
Per molto tempo, lunico venditore di domini che conoscevo è stato GoDaddy. Il nome mi è sempre sembrato losco, anche se alla fine ho ceduto allacquisto di un dominio lì. Ora, nellera delle startup, abbiamo unalternativa più pulita e più economica: Namecheap.Namecheap è sempre stato economico, ma ora puoi ottenere un dominio gratis! Quindi procurati il tuo dominio firstnamelastname.me ora gratuitamente, prima che il tuo nome molto comune venga rubato (se non lo è già). E cerca di non tornare indietro ai giorni di posta elettronica degli anni 90 e acquista un raj2kul4skul.me . Non “t. Per favore. Lunica persona che impressionerà sono gli amici senza i quali starai meglio.
Ho già detto che è gratis?
3 . Ottieni Namecheap SSL [opzionale]
Questo è opzionale e non lho ancora ottenuto per il mio sito web (perché su GoDaddy costa ancora) SSL (Secure Sockets Layer) è una cosa fantastica ciò significa fondamentalmente che i tuoi contenuti web possono essere offerti “in modo sicuro”. Ottieni anche quel fantastico lucchetto verde sul tuo sito web, hai un sito web https , invece di http, e sentirsi davvero cool e autentici:
Senza andare troppo sul tecnico, quello che devi sapere è che – questo non è strettamente necessario per il tuo sito web personale dove dubito che farai cose che richiedono una sicurezza così rigorosa. Tuttavia, se stai “imparando cose sul Web, potresti farlo anche tu. Dopotutto è gratuito?
4. Imposta Oceano digitale hosting.
Namecheap: GoDaddy :: DigitalOcean: HostGator.
Namecheap sta a GoDaddy come DigitalOcean sta a HostGator: una startup più legittima, più economica, meglio progettata e più facile da usare alternativa. Quando acquisti un dominio, cosa servirà (mostrerà) allutente? Il tuo sito web, giusto? Ma non puoi semplicemente dire di prendere questi file sul mio computer e mostrarglieli. Bene, puoi, ed è così. Con DigitalOcean, ottieni “hosting” gratuito. DigitalOcean chiama unistanza di hosting una “goccia”.
Ciò significa che puoi caricare il tuo sito web su una macchina virtuale (leggi: un computer) e dire al tuo dominio namecheap per servire i contenuti da quel computer. Senza entrare troppo nei dettagli, ci sono molte cose che accadono nel mezzo di cui DigitalOcean dovrebbe occuparsi – cose come la configurazione e la scelta di un server web – nginx o Apache e le richieste di instradamento sul tuo dominio specificamente al tuo set di file.
5. Realizzare il sito web vero e proprio.
Ora viene la parte “scrivi un po di HTML”. Realizzare un sito web ha vari gradi di difficoltà, dal mostrare il scrivi “Hello World” in Arial per creare un Facebook o Google. Di solito un int Le applicazioni attive che richiedono dati e contengono lo stato sono difficili da realizzare.
Quello che farai probabilmente sarà creare un sito statico (un mucchio dello stesso testo / immagini che vengono serviti a tutti ogni volta). Questo è molto più facile. Probabilmente non lo farò e non posso scrivere un tutorial completo per questo, ma ciò che gli studenti universitari generalmente fanno è imparare e utilizzare le seguenti cose:
- HTML – questo è il contenuto effettivo di testo / link / immagini / video
- CSS – questo rende il contenuto sopra un aspetto gradevole
- Javascript (JS) – questo consente elementi dinamici e belle animazioni. Supponi di voler creare un pulsante che carica unimmagine che non era “t nel tuo HTML, o aggiungi dinamicamente il contenuto al tuo HTML. Quindi, usi JS. Una breve storia: JS è stato violato indietro nel corso della giornata in circa 10 giorni e contiene molti bug e può essere molto prolisso e ingombrante se ne scrivi molti. In genere, un principiante userebbe una libreria come jQuery per renderla meno prolissa e facile (anche se allinizio jQuery può sembrare intimidatorio anche con tutti i suoi simboli $).
- Bootstrap – Bootstrap è un framework per frontend creato da Twitter. LHTML grezzo viene fornito con cose dallaspetto predefinito piuttosto scadente. Il pulsante HTML non è rappresentabile e scrivere CSS richiede tempo e sperimentazione (voglio dire, siamo reali – nessuno VERAMENTE “conosce” CSS). Bootstrap implica il download di alcuni file, laggiunta di una riga al codice HTML e magari la lettura di alcuni documentazione e aggiungendo alcune classi CSS che forniscono – e voilà! Non solo il tuo sito sembra automaticamente molto più carino, ma può anche essere reso compatibile per i dispositivi mobili (di nuovo, uno sforzo non banale).
6. Mettere il tuo sito web online (distribuzione) Una volta che hai finito di creare e testare il tuo sito web localmente (sul tuo computer) attivando il tuo localhost (server web locale – google it.Potresti non averne bisogno per i siti statici) e testando e mescolando con il tuo CSS utilizzando gli utilissimi Chrome Developer Tools e, se sei soddisfatto del tuo output, puoi andare su Digital Ocean, comprimere il tuo sito e inviarlo al tuo server. Se hai fatto tutto bene, attendi qualche secondo e vai al tuo firstnamelastname.me e dovresti vedere il tuo contenuto. E anche tutti gli altri dovrebbero essere in grado di farlo.
7. Rendere il tuo ottimo sito web ricercabile (SEO)
Un ultimo passaggio è la SEO, lottimizzazione per i motori di ricerca. Lobiettivo finale è di avere, si spera, un nome insolito e di rendere il tuo sito web tra i migliori risultati quando qualcuno cerca su Google il tuo nome. Questo potrebbe richiedere del tempo (ma ora può essere fatto a un costo monetario). Ci sono molti modi per farlo, e puoi cercarli tutti su Google. Ci sono modi per associare il tuo Facebook con esso, il tuo vecchio account G + che non usi mai con esso, aggiungendo metadati personalizzati da mostrare nella tua Ricerca Google , ecc. ecc. In definitiva, entro alcune settimane, a meno che il tuo nome non sia estremamente comune o purtroppo lo stesso di una persona famosa, dovresti essere uno dei primi risultati su Google.
Cose varie che dovresti sapere
Sulle scorciatoie per creare una bella pagina: A seconda di quanto lavoro vuoi dedicare al tuo sito web, potresti sempre prendere un pratico modello di bootstrap online o creare a mano le tue classi CSS se vuoi un aspetto unico, o anche mantenerlo semplice e andare per HTML / CSS di base (che è ciò che fanno un gran numero di accademici). Ad esempio, Homepage di Jon Kleinberg “.
Sul fatto di non dover conoscere PHP e altre cose fantasiose: poiché stai “riprogettando un sito statico, non si conoscono cose fantasiose come creare un backend, creare molte pagine e avere database. Sì, sto parlando con te, tutto il persone che vogliono usare PHP e MySQL senza una buona ragione (anche se necessario, cerca di stare lontano da PHP). Cè “un sacco di ottimi framework di backend là fuori destinati a creare altri tipi di siti web complicati da Ruby on Rails (in Ruby) a Django (in Python) per Riproduci! (in Java e Scala) quelli leggeri come CherryPy (in Python) o Flask (in Python). In effetti, ci sono framework per quasi tutte le lingue che puoi immaginare – Confronto di framework di applicazioni web ma non esaurirti usandoli / imparandoli ancora.
Altre cose da considerare di aggiungere al tuo sito web: Altre cose che potresti voler fare per il tuo sito web personale –
- Comprimi le tue immagini se ne usi molte, il tuo sito web richiederà molto tempo per il caricamento.
- Utilizza i plug-in sociali da Facebook / Quora / Twitter
- Aggiungi Google Analytics (in realtà è quasi un must). Google Analytics ti consente di vedere, tra molte altre cose, quante persone stanno visitando il tuo sito web, da dove vengono e così via. È un bel motivatore (si spera) per aggiornare il tuo sito e mantenerlo aggiornato. Inoltre, è molto facile da usare: si tratta solo di copiare e incollare alcune righe di codice nella tua pagina.
- Minimizza i tuoi script. Molti JS e CSS di un sito possono ancora essere visibili a chiunque visiti il tuo sito. Se pensi hai fatto qualcosa di terribilmente interessante che vuoi nascondere, minimizzare il tuo JS / CSS. Altrimenti, rovina lo scopo di avere un repository privato. Inoltre, rende il tuo sito più veloce.
- Cripta il tuo HTML . Ancora una volta, se davvero non vuoi che le persone vedano come hai creato il tuo sito web, ci sono modi per crittografare il tuo HTML in modo che anche facendo clic sul pulsante “Visualizza sorgente” la tua pagina web non rivelerà nulla di interessante.
Scrivendo questa risposta: Molte persone chiedono in giro come creare il proprio sito web. Ho pensato che sarebbe stato utile scrivere un piccolo tutorial breve (discutibile) e di facile comprensione per aiutare tutti. È davvero una di quelle cose facili a cui devi pensare. Oh, e ho già detto che ora è gratis?