Beste svaret
GitHub Student Developer Pack gir ressursene til sett opp din egen firstnamelastname.me domene uten kostnad. I resten av svaret snakker jeg om hvorfor det i utgangspunktet var vanskelig for meg, hvorfor det kan ha vært en barriere for deg å lage ditt eget nettsted. Jeg inkluderer en kort, noe omfattende guide som er ment for et studentpublikum med liten eller ingen teknisk kunnskap, å lage et ganske offentlig personlig nettsted for deg selv (som skal vises når noen googler navnet ditt).
Hvorfor det er veldig vanskelig å lage din egen nettside
Om å ville vite hvordan nettsteder fungerer: Som teknologentusiast på videregående skoler var jeg alltid nysgjerrig på å vite hvordan nettsteder fungerte og virkelig imponert over folk som hadde sine egne. Det hele virket så enkelt fra utsiden, men når jeg googlet «hvordan fungerer nettsteder» og gravde dypere, ville jeg gå meg vill midt i rare forkortelser og kompliserte klingende ting. TCP, UDP, IP, DNS, IPv6, HTML, JS, CSS – listen fortsetter. Oppgaven med å kartlegge disse abstruse konseptene til håndgripelige ting på datamaskiner jeg visste om var ganske vanskelig, og en av de tingene som krever enorm motivasjon for å sitte og gå gjennom.
Når du bestemmer deg for å bare lage et nettsted for å finne ut hvordan de fungerer: Det er et spørsmål du kan få hos noen kresne teknologibedrifter og finne i annaler av Glassdoor –
Hva skjer når du skriver inn «google [dot] com» i nettleseren din? ( Spørsmål om Google-intervju: Hva skjer når du skriver …)
Selv midtveis i studiet informatikk på college var jeg litt bekymret for hvor lite de fortalte meg om alt dette. I frustrasjon var fall-back-tingen å slå opp på Google «hvordan lage et nettsted». Med de mange markedsføringspengene som ble lagt ned, sjanset jeg på en mengde nettsteder og vilkår jeg fremdeles ikke kunne få for mye mening om – domener, hosting, GoDaddy, HostGator, ruting, CSS, HTML, Javascript, jQuery, WordPress , blogger osv. Dette er hva det viser meg nå:
For å være ærlig, hørtes alle disse navnene veldig svindel- y for meg, og deres uforståelighet overgikk motivasjonen min. Jeg ville bare ha mitt eget nettsted med navnet mitt – debarghyadas.com [ignorere selvopprykk], og lære å sette innhold på det.
Om å være for billig til å kjøpe ting på internett: Da jeg pakket hodet rundt noen av det var litt fornuftig. For å lage et nettsted, må jeg kjøpe et «domene», et nettstednavn og et «hosting», et sted som inneholder innholdet på nettstedet mitt og gir det, «serverer det», til dette domenet. Kjøp. Ikke et pent ord gitt min ikke så dyptliggende nøysomhet. For som tudent som lever av freeware, var jeg ikke så opptatt av å dele ut penger for å kjøpe abstrakte ting. Det tok meg år å betale $ 1 for Whatsapp da det var trivielt å blåse $ 4 på den overdådige sjokolademousskaken med vaniljeis.
Kom igjen – kan du være noe mer svindel-y? «Vi spiser opp konkurransen»? OK, gator.
For mange studenter (og mennesker) er penger en ganske barriere for inngang. Det koster omtrent $ 10 / år å kjøpe et domene (på GoDaddy) og et tilsvarende beløp å kjøpe hosting på HostGator. Og det innebar å jobbe deg gjennom en rekke produkter du ikke kunne gi mening. Det pønsket meg at du også måtte betale på årlig basis – det var ikke et engangskjøp.
På å ty til ikke å være billig for å motivere meg: Til slutt, gjennom en lang møysommelig prosess, delte jeg ut pengene og overbeviste meg selv om at investeringen ville motivere meg til å lære de nødvendige ferdighetene. Jeg mener, alle sa alltid at HTML var enkelt, og det er det, men nettsteder laget med HTML ser også ut som dritt. Det var mye forvirring.
Til slutt hadde jeg rett i det – investeringen på et domene og hosting i 5 år fikk meg til å finne ut hvordan ting fungerte, og jeg fikk et personlig nettsted ut og ville gjenta det når jeg hadde noen fritid.
En litt omfattende guide til å lage ditt eget nettsted gratis
Komme til GitHub Student Developer Pack .Ja, den inneholder mange ting jeg aldri har brukt, men det den ikke reklamerer for (og sannsynligvis burde) er at den gir alle verktøyene for å få nettstedet ditt på domenet ditt til å gå gratis! Det høres for bra ut til å være sant nå.
Handelsverktøy Her «er en generell retningslinje. Jeg har ikke prøvd det personlig, men jeg forestiller meg at dette er en god måte å gå på ting på. Du må (eller bør) benytte deg av følgende betalte tjenester Student Developer Pack tilbyr (gratis):
1. Github private repositories [valgfritt]
2. Namecheap .me domain
3. Namecheap SSL [valgfritt]
4. Hosting av DigitalOcean
Og i tillegg
1. Bootstrap
2. Flere online veiledninger og verktøy – JSfiddle 3. Noen nettsteder for mal – StartBootstrap , BootstrapZero
Hva skal jeg gjøre med nevnte verktøy Jeg vil prøve å holde denne mini-guiden så enkel som mulig . Det er lett å slippe store vilkår når du vet hva de betyr, men kan være en enorm avskrekkende effekt for lesere som ikke er klar. Jeg kan være mer eksplisitt og utvide disse hvis det blir bedt om det.
1. Sett opp en privat Github depot [valgfritt]
Når du er skriver mye kode for et prosjekt, det er mange ting som kan gå galt.
- Det kan bli slettet fra maskinen din, og du er skrudd
- Du kan prøve å legge til en ny funksjon uten å sikkerhetskopiere den gamle versjonen og komme til en tilstand der du glem hvor mange Ctrl + Zs (angre) du trenger for hvilke filer for å komme tilbake til fungerende tilstand.
- Du kan ha flere personer som jobber med det hver for seg på sine egne datamaskiner og har ingen anelse om hvordan du kan integrere begge dine versjon av prosjektet.
En n00b-koder kan foreslå å bruke Dropbox til å dele og synkronisere kodeprosjekter, og hvis du «jobber du selv med det, det kan være en anstendig løsning. Imidlertid vil du fremdeles møte det andre problemet i listen ovenfor, og det blir veldig gal når flere prøver å jobbe på samme kodebase samtidig.
Git (og i gamle dager, SVN og Mercurial for hipsters) brukes til å «versjonere» koden din. Vær oppmerksom på at git ikke er github. Det vil si at du kan gjøre endringer, skyve dem «oppstrøms» til interwebs, der de lagres permanent i «depotet» (gratis). Git er også rent kommandolinjeverktøy, noe som betyr at du må åpne en av de svarte, skremmende hackerskjermene på skrivebordet og skrive inn kommandoer. å bruke den. Det er ikke trivielt å bruke. Github integreres med git og lar deg se lagringsplassene du har presset oppstrøms og gir en rekke GUI-er for å gjøre git-oppgaver (oppfører seg som et vanlig program på datamaskinen din). Du kan bla gjennom kodebasene (arkivene) på internett fra nettleseren din, gjøre endringer, tilbakestille endringene til det siste kontrollpunktet (commit), og så videre.
Github leverte alltid gratis arkiver som var offentlige – noe som betydde at alle kunne se koden din og bruke den (ja det er åpen kildekode-lisenser, men du vet hva jeg mener). I hovedsak, hvis du skulle jobbe veldig hardt med å designe noe sinnsykt kult dritt og finne ut datavitenskap, kan kompisen din bare ta koden din og bruke den til sitt eget nettsted. Nå, med utdanningspakken, kan du få 5 gratis private arkiver (selv om Github leverte den tjenesten også for .edu-studenter). Gå gjennom de elektroniske opplæringene, og finn ut hvordan du konfigurerer et privat github-arkiv for nettstedskoden din.
2. Få gratis Namecheap .me domain
I det lengste var GoDaddy den eneste domeneselgeren jeg kjente til. Navnet slo meg alltid som skyggefullt, selv om jeg til slutt innrømmet å kjøpe et domene der. Nå, i en nystartet tidsalder, har vi et bedre, renere, billigere alternativ – Namecheap.Namecheap var alltid billig, men nå kan du få et domene gratis! Så få firstnamelastname.me domenet ditt nå gratis, før det vanlige navnet ditt blir stjålet (hvis det ikke allerede er). Og prøv å ikke gå tilbake til 90-tallets e-postdager og kjøp en raj2kul4skul.me . Don «t. Vær så snill. Den eneste personen som vil imponere er venner du har det bedre uten.
Nevnte jeg det er gratis?
3 . Få Namecheap SSL [valgfritt]
Dette er valgfritt, og jeg har ikke fått det til nettstedet mitt ennå (fordi det fortsatt koster penger på GoDaddy). SSL (Secure Sockets Layer) er en fancy ting det betyr i utgangspunktet at nettinnholdet ditt kan serveres «sikkert». Du får også den kule grønne låsen på nettstedet ditt, har et https nettsted, i stedet for http, og føler deg veldig kul og autentisk:
Uten å gå for teknisk, er det du trenger å vite at – dette er ikke strengt nødvendig for ditt personlige nettsted der jeg tviler på at du gjør ting som krever så streng sikkerhet. Men hvis du lærer ting om nettet, kan du like godt. Det er tross alt gratis?
4. Sett opp Digital Ocean hosting.
Namecheap: GoDaddy :: DigitalOcean: HostGator.
Namecheap er til GoDaddy som DigitalOcean er for HostGator – en mer legitim, billigere, bedre designet og enklere å bruke oppstart alternativ. Når du kjøper et domene, hva skal det tjene (vise) til brukeren? Nettstedet ditt, ikke sant? Men du kan ikke bare si å ta disse filene på datamaskinen min og vise dem dem. Vel, det kan du, og slik er det. Med DigitalOcean får du gratis «hosting». DigitalOcean kaller en hostinginstans for en «dråpe».
Dette betyr at du kan laste opp nettstedet ditt til en virtuell maskin (les: en datamaskin), og fortell ditt navnekjøp-domene for å betjene innholdet fra den datamaskinen. Uten å gå i detaljer, det er mange ting som skjer i midten som DigitalOcean bør ta seg av – ting som å konfigurere og velge en webserver – nginx eller Apache , og ruteforespørsler på domenet ditt spesifikt til ditt sett med filer.
5. Å lage nettstedet.
Nå kommer vi til «skriv litt HTML» -delen. Å lage et nettsted har varierende vanskelighetsgrader – fra å vise tekst «Hello World» i Arial for å opprette en Facebook eller Google. Vanligvis en int eraktiv applikasjon som krever data og inneholder tilstand er vanskelig å lage.
Det du kommer til å gjøre, kommer sannsynligvis til å lage et statisk nettsted (en haug med den samme teksten / bildene som blir servert til alle hver gang). Dette er mye lettere. Jeg vil sannsynligvis ikke og kan ikke skrive en fullstendig opplæring for dette, men det studenter vanligvis gjør er å lære og bruke følgende ting –
- HTML – dette er det faktiske innholdet i tekst / lenker / bilder / videoer
- CSS – dette gjør at innholdet ovenfor ser pent ut
- Javascript (JS) – dette gir dynamiske elementer og pene animasjoner. Anta at du vil lage en knapp som laster inn et bilde som ikke var t i HTML-en, eller legg til innhold dynamisk i HTML-en. Deretter bruker du JS. En kort historie – JS ble hacket tilbake på dagen på omtrent ti dager, og den inneholder mange feil, og kan være veldig ordentlig og uhåndterlig hvis du skriver mye av det. En nybegynner vil vanligvis bruke et bibliotek som jQuery for å gjøre det mindre ordrikt og enkelt (selv om jQuery i begynnelsen også kan se skremmende ut med alle sine $ tegn).
- Bootstrap – Bootstrap er et go-to Frontend-rammeverk laget av Twitter. Rå HTML kommer med ganske dårlige standardutseende ting. HTML-knappen er ikke til stede, og det å skrive CSS for det tar tid og eksperimentering (jeg mener, la oss være ekte – ingen vet virkelig «CSS). Bootstrap innebærer å laste ned noen filer, legge til en linje i HTML-en og kanskje lese noen dokumentasjon, og legge til noen CSS-klasser de gir – og voila! Ikke bare ser nettstedet ditt så mye penere ut, men det kan også gjøres kompatibelt for mobil (igjen, en ikke-triviell innsats).
6. Sette nettstedet ditt på nettet (distribuere) Når du er ferdig med å opprette og teste nettstedet ditt lokalt (på din egen datamaskin) ved å aktivere din lokale vert (lokal webserver – google det.Du trenger kanskje ikke dette for statiske nettsteder), og når du tester og blander deg med CSS-en din ved hjelp av de svært nyttige Chrome Developer Tools, og er fornøyd med utdataene dine, kan du gå videre til Digital Ocean, zip opp nettstedet ditt og sende det til server. Hvis du gjorde alt riktig, vent noen sekunder og gå til firstnamelastname.me , så ser du innholdet ditt. Og alle andre burde også kunne.
7. Gjør det flotte nettstedet ditt søkbart (SEO)
Et siste trinn er SEO – søkemotoroptimalisering. Målet er å forhåpentligvis ha et uvanlig navn, og gjøre nettstedet ditt til de beste resultatene når noen googler navnet ditt. Dette kan ta litt tid (men det kan gjøres til nå økonomiske kostnader). Det er mange måter å gjøre dette på, og du kan Google for dem alle. Det er måter å knytte Facebook til den, din gamle G + -konto du aldri bruker til den, og legge til egendefinerte metadata for å vises i Google-søk osv. Til slutt, i løpet av flere uker, med mindre navnet ditt er ekstremt vanlig eller dessverre det samme som en kjent person, bør du være en av de beste få resultatene på Google.
Diverse ting du bør vite
Om å ta snarveier til å lage en pen side: Avhengig av hvor mye arbeid du vil legge ned på nettstedet ditt, kan du alltid hente en praktisk bootstrap-mal online eller håndlaget dine egne CSS-klasser hvis du vil ha en unikt utseende, eller til og med ha det enkelt og gå etter grunnleggende HTML / CSS (det er det et stort antall akademikere gjør). For eksempel Jon Kleinbergs hjemmeside .
Om ikke å måtte vite PHP og andre fancy ting: Fordi du designer et statisk nettsted, er det ingen kunnskap om fancy ting som å lage en backend, lage mange sider og ha databaser. Ja, jeg snakker med deg, alle folk som ikke ønsker å bruke PHP og MySQL uten god grunn (selv om du hadde behov for det, prøv å holde deg borte fra PHP). Det er en rekke flotte backend-rammer der ute, ment for å lage andre typer kompliserte nettsteder fra Ruby on Rails (i Ruby) til Django (i Python) til Spill av! (i Java & Scala) lette som CherryPy (i Python) eller Flaske (i Python). Det er faktisk rammer for omtrent alle språk du kan forestille deg – Sammenligning av nettapplikasjonsrammer , men ikke brenne deg ved å bruke / lære om dem ennå.
Om andre ting du bør vurdere å legge til på nettstedet ditt: Andre ting du kanskje vil gjøre for ditt personlige nettsted –
- Komprimer bildene dine hvis du bruker mange av dem, nettstedet ditt vil ta lang tid å laste den.
- Bruk sosiale plugins fra Facebook / Quora / Twitter
- Legg til Google Analytics (dette er faktisk nesten et must). Google Analytics lar deg blant mange andre ting se hvor mange som besøker nettstedet ditt, hvor de kommer fra, etc. Det er en fin motivator (forhåpentligvis) for å oppdatere nettstedet ditt og holde det oppdatert. I tillegg er det veldig enkel å bruke – det innebærer bare å kopiere og lime inn noen kodelinjer på siden din.
- Miniser skriptene dine. Mye av et JS og CSS av et nettsted kan fremdeles være synlige for alle som besøker nettstedet ditt. Hvis du tror du har gjort noe veldig interessant som du vil skjule, minify JS / CSS. Ellers ødelegger det formålet med å ha et privat lager. I tillegg gjør det nettstedet ditt raskere.
- Krypter HTML-en din . Igjen, hvis du virkelig ikke vil at folk skal se hvordan du har laget nettstedet ditt, er det måter å kryptere HTML på, slik at selv om du klikker på «Vis kilde» -knappen, vil nettsiden din ikke avsløre noe interessant.
Når du skriver dette svaret: Mange spør om hvordan man lager sitt eget nettsted. Jeg trodde det ville være nyttig å skrive en kort (diskutabel), lett forståelig liten opplæring for å hjelpe alle. Det er virkelig en av de enkle tingene du må tenke deg på. Åh, og nevnte jeg at det nå er gratis?