Staattisen sivuston isännöinti pilvessä neljässä vaiheessa

Staattiset sivustot voivat isännöidä kaikenlaisia ​​verkkosivustoja henkilökohtaisesta salkustasi, yrityksen aloitussivulle tai jopa blogiin.

Staattisten sivustojen tärkein etu on, että niitä on helppo hallita. Ne ovat myös erittäin kustannustehokkaita. Staattisten sivustojen kanssa et tarvitse monimutkaisia ​​sisällönhallintapalveluja (CMS), jotka toimivat koko ajan palvelimilla (vaikka sinulla ei olisi liikennettä).

Tässä viestissä opit staattisen verkkosivuston isännöimisestä AWS-pilvessä neljässä vaiheessa AWS-vahvistuksen ja reitin 53 avulla. Ja mikä parasta? Se ei maksa sinulle miltei mitään kuukaudessa.

Mikä on staattinen verkkosivusto?

Staattiset verkkosivustot ovat verkkosivustoja, jotka palvelevat tallennuspalvelimelta tai sisällönjakoverkosta (CDN). HTML-tiedostojen luomisen ei tarvitse olla käynnissä olevaa palvelinta.

Nämä verkkosivustot on valmiiksi rakennettu HTML-tiedostoina, jotka tallennetaan jonnekin Internetiin ja joita sitten käytetään sellaisenaan.

Staattisilla sivustoilla voi olla dynaamista sisältöä, mutta sitä käsitellään asiakaspuolella JavaScriptiä tai joitain kolmannen osapuolen integraatioita API: n avulla.

Joitakin staattisen sivuston käytön etuja ovat:

  • Ne on helppo skaalata
  • Jos käytät CDN: ää, latausajat ovat nopeita
  • Ne ovat kustannustehokkaita
  • Niitä on helppo ylläpitää

Esimerkiksi henkilökohtainen verkkosivustoni on hyvä esimerkki staattisesta sivustosta:

Marcian henkilökohtainen verkkosivusto

Mikä on AWS?

AWS on lyhenne sanoista Amazon Web Services ja se on yleisimmin käytetty pilvialusta. Siinä on paljon erilaisia ​​palveluja, jotka auttavat sinua kehittämään ja isännöimään sovelluksiasi.

AWS: llä on myös palvelinkeskuksia ympäri maailmaa, ja miljoonat asiakkaat käyttävät sitä.

Pilvien käyttö sovelluksissasi pienentää kustannuksia, auttaa sinua tulemaan ketterämmäksi ja antaa sinun innovoida nopeammin kuin jos käyttäisit omia paikan päällä olevia palvelimia.

Vaihe 1 - Määritä AWS-tilisi

Ensimmäinen vaihe tässä prosessissa on hankkia AWS-tili. Aiot isännöidä staattista sivua pilvessä, ja sinulla on oltava voimassa oleva AWS-tili.

Jos olet juuri luomassa tiliäsi, ilmaisen tason pitäisi olla riittävä tähän projektiin. Ilmainen taso antaa sinulle pääsyn moniin AWS-palveluihin ilmaiseksi ensimmäisten 12 kuukauden ajan.

Saat esimerkiksi 5 Gt ilmaista tallennustilaa. Se on hienoa, koska tarvitsemme tallennustilaa staattisen sivuston tallentamiseksi pilveen.

Muista, että AWS-tilin saaminen on ilmaista, jos et käytä mitään palveluita. Sinua ei veloiteta tilin luomisesta, ja jos et käytä tiliä, mitään ei veloiteta.

Voit luoda AWS-tilin seuraamalla tämän videon ohjeita:

Vaihe 2 - Luo staattinen sivustosi ja määritä se AWS Amplifyllä

Juuri nyt kun olet lukenut kyseisen otsikon, saatat miettiä, mikä on AWS Amplify?

AWS Amplify on avoimen lähdekoodin kehys, joka tarjoaa ominaisuuksia, jotka auttavat sinua luomaan pilvipohjaisia ​​verkko- ja mobiilisovelluksia. Siinä on 4 komponenttia:

  • Vahvista CLI
  • Amplify-kirjastot
  • - Vahvista käyttöliittymän komponentit ja
  • Vahvista konsoli.

Vahvista CLI auttaa sinua määrittämään kaikki palvelut, joita tarvitset pilvitaustan luomiseen sovelluksellesi komentoriviliittymän avulla.

Kirjastojen avulla voit integroida asiakassovelluksesi suoraan taustapalveluihin.

Amplify UI -komponentit ovat erityisesti React-, React Native-, Angular-, Ionic- ja Vue-käyttöliittymäkirjastoja, jotka auttavat sinua kehittämään pilvipohjaisen sovelluksesi helposti.

Lopuksi, Amplify Console on AWS-palvelu, joka tarjoaa git-pohjaisen työnkulun jatkuvaa käyttöönottoa varten ja täyden pinon verkko- ja mobiilisovellusten isännöimiseksi.

Tässä viestissä emme aio käyttää kaikkia AWS Amplify -ominaisuuksia, vaan vain konsolia. Mutta suosittelen, että tutustut oppaisiin monimutkaisempien sovellusten luomisesta AWS Amplify -sovelluksella.

Luo staattinen sivusto

Sinulla on nyt kaikki mitä tarvitset staattisen sivuston aloittamiseen. Tässä esittelyssä mikä tahansa staattinen HTML toimii. Loin juuri tiedoston nimeltä index.html ja lisäsin tämän koodin sen sisälle:

Hello Foobar

This is my super simple site

Lataa se AWS Amplify Consoleen

Kun meillä on staattinen sivusto, seuraava askel on siirtyä AWS-konsolin AWS Amplify -palveluun.

AWS Amplify -palvelun etsiminen AWS-konsolista

Kun palvelu avautuu, näet jotain tällaista:

AWS Amplify -konsoli

Napsauta Yhdistä sovellus -painiketta ja sitten sinulle näytetään tämä sivu:

Vaihtoehdot olemassa olevan projektin käyttöönottoon

Sitten voit valita Ota käyttöön ilman Git-palveluntarjoajaa ja jatka.

Sinulle esitetään sivu sovelluksen manuaaliseen käyttöönottoon. Siellä valitset sovelluksen nimen ja ympäristön nimen ja voit sitten vetää sovelluskansion selaimeen.

Manuaalisen käyttöönoton aloittaminen AWS Amplifyssä

Kun sovellus on ladannut, näet viestin, jonka mukaan "Käyttöönotto on suoritettu loppuun".

Nyt verkkosivustoasi isännöidään pilvessä. Siirry verkkotunnustekstin alla olevaan linkkiin . Se vie sinut juuri käyttöönotetulle staattiselle sivustollesi.

Vaihe 3 - Osta verkkotunnus verkkosivustollesi

Nyt on aika hankkia verkkotunnus verkkosivustollesi. Tämän verkkotunnuslinkin jakaminen ei ole kovin käytännöllistä, ja verkkotunnus voi olla yksinkertaisempi tapa nimetä verkkosivustosi.

Tätä varten sinun on mentävä AWS-tilisi sisään palvelulle nimeltä Route53.

Huoltoreitin 53 etsiminen AWS-konsolista

Kun reitti 53 avautuu, voit siirtyä linkille, joka sanoo Rekisteröi verkkotunnus , ja tällainen sivu ilmestyy.

Täällä sinun on valittava verkkotunnus. Verkkotunnuksia laskutetaan vuosittain, ja niillä on erilaiset kustannukset päättymisestä riippuen (kuten .com, .net ja niin edelleen).

Kun olet valinnut verkkotunnuksen, voit lisätä sen kortille. Noudata sitten Route53: n ohjeita.

Vaihe 4 - Määritä toimialue AWS Amplify -sovelluksessa

Nyt kun sinulla on verkkotunnus, on aika palata AWS Amplify -sovellukseesi - juuri määrittämäsi.

Napsautat vasemmalla Verkkotunnuksen hallinta -linkkiä ja tämä sivu avautuu:

Verkkotunnuksen lisääminen sivustoosi

Verkkotunnuksen tekstiruutu ehdottaa verkkotunnus juuri rekisteröitynyt. Valitse se, hyväksy kaikki oletusmääritykset ja napsauta sitten Tallenna .

Sen jälkeen sinut ohjataan sivulle, jossa toimialue ja SSL-varmenne määritetään. Sinun ei tarvitse tehdä mitään tässä vaiheessa, odota vain, kunnes kaikki on määritetty. Se vie jonkin aikaa, joten ole kärsivällinen.  

Nyt olet valmis, joten voit siirtyä uuteen verkkotunnukseesi ja nähdä staattisen sivusi.

Kuinka päivittää tämä sivusto

Nyt joka kerta, kun sinun on muutettava jotain staattisessa sivustossasi, sinun on mentävä AWS-vahvistukseen ja päivitettävä tiedostot. Periaatteessa pudotat vain hakemiston Amplify-sovellukseen.

Staattisen sivuston päivittäminen

Johtopäätös

Nyt sinulla on staattinen sivusto, jota isännöidään pilvessä. Tämä sivusto on erittäin skaalautuva ja luotettava. Sivustoa isännöidään AWS CDN -nimellä AWS CloudFormation, joten tämä tekee sivustostasi erittäin nopean käyttäjillesi.

Ylläpidon kokonaiskustannukset, kun AWS-tilisi on yli 12 kuukautta, on noin 0,50 USD - 4 USD kuukaudessa, riippuen siitä, kuinka suuri sivustosi on ja kuinka paljon liikennettä saat.

Toinen vuotuinen kustannuksesi sinulla on verkkotunnus, joka voi alkaa 9 dollaria USD vuodessa.

Ja jos haluat tehdä siitä hieman automatisoidun, suosittelen tarkastelemaan automaattisia AWS Amplify -asennuksia Githubin avulla.

Kiitos lukemisesta.

Olen Marcia Villalba, AWS: n kehittäjäasianajaja ja FooBar-nimisen YouTube-kanavan isäntä. Minulla on yli 250 opetusohjelmaa Serverless-, AWS- ja ohjelmistosuunnittelijakäytännöistä.

  • Twitter: //twitter.com/mavi888uy
  • Youtube: //youtube.com/foobar_codes