Reunalaskenta Cloudflare Workersilla ja Denolla · Oppitunti

Workers Sites ja Pages

Isännöi staattisia sivustoja ja yhden sivun sovelluksia suoraan Cloudflaren reunalla Workers Sitesin ja Pagesin avulla

Oppitunti 1/411 vaihetta

Workers Sites ja Pages on ilmainen Reunalaskenta Cloudflare Workersilla ja Denolla-oppitunti CoddyKitissä. Tämä on oppitunti 1/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu Reunalaskenta Cloudflare Workersilla ja Denolla-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Reunalaskenta Cloudflare Workersilla ja Denolla-kurssilla on yhteensä 4 oppituntia.

Staattisten sivustojen isännöinti reunalla

Tervetuloa! Tässä oppitunnissa tutustumme siihen, kuinka staattiset verkkosivustot ja Single Page Application (SPA) -sovellukset voidaan isännöidä suoraan Cloudflaren maailmanlaajuisen reunaverkon kautta.

Tämä tarkoittaa, että sivuston sisältö tarjotaan fyysisesti lähempänä käyttäjiä sijaitsevista paikoista, mikä nopeuttaa latausaikoja huomattavasti ja tekee käyttökokemuksesta sujuvamman.

Workers Sites -toiminnon esittely

Cloudflare Workers Sites on ominaisuus, jonka avulla staattiset resurssit, kuten HTML, CSS, JavaScript ja kuvat, voidaan julkaista suoraan Cloudflaren reunalle Wrangler CLI:n avulla.

Se sopii täydellisesti yksinkertaisille staattisille verkkosivustoille.
Se toimii erinomaisesti Single Page Application (SPA) -sovelluksissa, jotka on rakennettu esimerkiksi Reactilla, Vuella tai Sveltellä.
Voitte hyödyntää Workereiden tehoa dynaamisen logiikan lisäämiseen tarvittaessa.

Reunaisännöinnin edut

Sisällön isännöinti reunalla tarjoaa useita keskeisiä etuja:

Erittäin nopea suorituskyky: Sisältö tarjotaan lähimmästä datakeskuksesta.
Maailmanlaajuinen kattavuus: Sivustonne on saatavilla kaikkialla maailmassa pienellä viiveellä.
Sisäänrakennettu tietoturva: Hyödyntää Cloudflaren verkkoa DDoS-suojaukseen ja WAF-suojaukseen.
Automaattinen SSL: Maksuttomat, hallinnoidut SSL-varmenteet turvallisia yhteyksiä varten.

Ensimmäisen Workers Site -sivuston HTML

Luodaan erittäin yksinkertainen index.html-tiedosto. Se toimii Workers Site -sivustomme pääsivuna.

Luokaa uusi kansio (esimerkiksi my-static-site) ja sijoittakaa tämä tiedosto sen sisään:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Hello Edge!</title>
  <style>
    body { font-family: sans-serif; text-align: center; margin-top: 50px; }
  </style>
</head>
<body>
  <h1>Welcome to the Edge!</h1>
  <p>This site is hosted by Cloudflare Workers.</p>
</body>
</html>

Workers Site -sivuston julkaiseminen

Staattisen sivuston julkaisemiseen käytätte Wrangler CLI:tä. Varmistakaa ensin, että Wrangler on asennettu ja määritetty.

Siirtykää projektihakemistoon (esimerkiksi my-static-site) ja käyttäkää komentoa wrangler pages deploy. Tämä komento auttaa julkaisemaan staattiset resurssinne.

wrangler pages deploy ./ --project-name my-edge-app

# Or, if you have a build step:
# npm run build && wrangler pages deploy ./dist --project-name my-edge-app

Cloudflare Pages -toiminnon esittely

Workers Sites sopii erinomaisesti nopeisiin käyttöönottoihin, mutta Cloudflare Pages tarjoaa kattavamman alustan JAMstack- ja full-stack-sovelluksille.

Pages integroituu suoraan Git-tietovarastoosi (GitHub, GitLab) ja tarjoaa automaattiset koonti- ja käyttöönottoputket.

Pagesin ominaisuudet: CI/CD ja esikatselut

Cloudflare Pages sujuvoittaa kehitystyönkulkuasi:

Git-integraatio: Yhdistää palvelusi tietovarastoon ja ottaa muutokset automaattisesti käyttöön push-komennon jälkeen.
Koontiputket: Kokoaa frontend-kehyksesi automaattisesti (React, Vue, Next.js jne.).
Esikatselukäyttöönotot: Jokainen pull request saa yksilöllisen esikatselu-URL-osoitteen.
Mukautetut verkkotunnukset: Voit yhdistää helposti oman verkkotunnuksesi.

Workers Sites ja Pages: keskeiset erot

Molemmat isännöivät staattista sisältöä reunalla, mutta palvelevat eri tarpeita:

Workers Sites: Yksinkertaisemmat, manuaaliset käyttöönotot Wrangler CLI:n avulla. Sopii perusmuotoisille staattisille sivustoille tai tilanteisiin, joissa haluat hallita Worker-skriptin logiikkaa tarkemmin.
Cloudflare Pages: Täysimittainen CI/CD-alusta, joka integroituu Gitiin ja tarjoaa automaattiset koonnit sekä esikatselukäyttöönotot. Ihanteellinen moderneille JAMstack-sivustoille ja SPA-sovelluksille.

SPA-sovellukset ja asiakaspuolen reititys

Workers Sites ja Pages sopivat erinomaisesti Single Page Application (SPA) -sovelluksille. SPA-sovelluksissa käytetään usein asiakaspuolen reititystä, mikä tarkoittaa, että palvelin palauttaa aina saman index.html-tiedoston ja JavaScript käsittelee navigoinnin.

Cloudflare Pages hoitaa tämän automaattisesti. Workers Sites -sivustossa saatat tarvita pienen Worker-skriptin, joka varmistaa kaikkien polkujen palautuvan tiedostoon index.html.

Testaa tietosi

Olet oppinut kaksi tehokasta tapaa isännöidä verkkosovelluksia reunalla. Katsotaan, osaatko erottaa ne toisistaan.

Vastaa interaktiivisessa oppitunnissa

Kertaus: verkkosovellusten reunaisännöinti

Tässä oppitunnissa tutustuimme siihen, miten Cloudflare mahdollistaa staattisten sivustojen ja SPA-sovellusten isännöinnin reunalla. Käsittelimme seuraavat aiheet:

Workers Sites: Yksinkertaiset staattiset käyttöönotot Wranglerin avulla.
Cloudflare Pages: Monipuolinen alusta, jossa on Git-integraatio ja CI/CD-tuki JAMstack-sovelluksille.
Reunaisännöinnin merkittävät hyödyt, kuten nopeus ja maailmanlaajuinen tavoitettavuus.

Reunalla isännöinti tuo sisältösi lähemmäs käyttäjiä ja varmistaa nopean, turvallisen ja erittäin käytettävän verkkokokemuksen.

Aloita maksutta

Opi Reunalaskenta Cloudflare Workersilla ja Denolla tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit: 12
Oppitunnit: 47

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”Workers Sites ja Pages” ilmainen?

Kyllä – oppitunnin ”Workers Sites ja Pages” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko Reunalaskenta Cloudflare Workersilla ja Denolla-kurssin, päivitä CoddyKit PROhon. Reunalaskenta Cloudflare Workersilla ja Denolla-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Workers Sites ja Pages”?

Isännöi staattisia sivustoja ja yhden sivun sovelluksia suoraan Cloudflaren reunalla Workers Sitesin ja Pagesin avulla Harjoittelet Reunalaskenta Cloudflare Workersilla ja Denolla-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Reunalaskenta Cloudflare Workersilla ja Denolla-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Reunalaskenta Cloudflare Workersilla ja Denolla-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 1/4.

Kuinka kauan ”Workers Sites ja Pages”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Reunalaskenta Cloudflare Workersilla ja Denolla-oppitunnilla?

Kyllä. Jokainen Reunalaskenta Cloudflare Workersilla ja Denolla-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

← Takaisin: Reunalaskenta Cloudflare Workersilla ja Denolla