Edge computing med Cloudflare Workers og Deno · leksjon

Workers Sites og Pages

Drift statiske nettsteder og enkeltsideapplikasjoner direkte på Cloudflares edge ved hjelp av Workers Sites og Pages.

Leksjon 1 av 411 trinn

Workers Sites og Pages er en gratis leksjon i Edge computing med Cloudflare Workers og Deno på CoddyKit. Dette er leksjon 1 av 4. Du kan lese hele leksjonen gratis nedenfor – og deretter øve praktisk i nettleseren med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i Edge computing med Cloudflare Workers og Deno, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i Edge computing med Cloudflare Workers og Deno inneholder totalt 4 leksjoner.

Host statiske nettsteder på edge

Velkommen! I denne leksjonen skal De utforske hvordan De kan hoste statiske nettsteder og Single Page Applications (SPA-er) direkte på Cloudflares globale edge-nettverk.

Det betyr at innholdet på nettstedet leveres fra steder som fysisk ligger nærmere brukerne, noe som gir svært korte lastetider og en bedre brukeropplevelse.

Introduksjon til Workers Sites

Cloudflare Workers Sites er en funksjon som lar Dem distribuere statiske ressurser, som HTML, CSS, JavaScript og bilder, direkte til Cloudflare edge ved hjelp av Wrangler CLI.

  • Det passer perfekt for enkle statiske nettsteder.
  • Det fungerer svært godt for Single Page Applications (SPA-er) bygget med rammeverk som React, Vue eller Svelte.
  • De får kraften fra Workers til å legge til dynamisk logikk ved behov.

Fordeler med hosting på edge

Hosting av innhold på edge gir flere viktige fordeler:

  • Svært høy ytelse: Innholdet leveres fra det nærmeste datasenteret.
  • Global rekkevidde: Nettstedet er tilgjengelig over hele verden med lav forsinkelse.
  • Innebygd sikkerhet: Utnytter Cloudflares nettverk for DDoS-beskyttelse og WAF.
  • Automatisk SSL: Gratis, administrerte SSL-sertifikater for sikre forbindelser.

Den første HTML-filen for Workers Site

La oss opprette en svært enkel index.html-fil. Dette blir hovedsiden for Workers Site.

Opprett en ny mappe (for eksempel my-static-site) og legg filen i den:

<!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>

Distribuere et Workers Site

For å distribuere det statiske nettstedet bruker De Wrangler CLI. Sørg først for at Wrangler er installert og konfigurert.

Gå til prosjektmappen (for eksempel my-static-site) og bruk kommandoen wrangler pages deploy. Denne kommandoen hjelper Dem med å distribuere de statiske ressursene.

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

Introduksjon til Cloudflare Pages

Selv om Workers Sites er utmerket for raske distribusjoner, tilbyr Cloudflare Pages en mer omfattende plattform for JAMstack- og fullstack-applikasjoner.

Pages integreres direkte med Git-repositoriet (GitHub, GitLab) og tilbyr automatiske bygg- og distribusjonsprosesser.

Funksjoner i Pages: CI/CD og forhåndsvisninger

Cloudflare Pages effektiviserer utviklingsarbeidsflyten:

  • Git-integrasjon: Kobler seg til repoet for automatiske distribusjoner ved push.
  • Byggprosesser: Bygger automatisk frontend-rammeverket (React, Vue, Next.js osv.).
  • Forhåndsvisningsdistribusjoner: Hver pull request får en unik URL for forhåndsvisning.
  • Egendefinerte domener: Koble enkelt til eget domene.

Workers Sites sammenlignet med Pages: Viktige forskjeller

Begge leverer statisk innhold fra edge-nettverket, men dekker ulike behov:

  • Workers Sites: Enklere, manuelle distribusjoner via Wrangler CLI. Egner seg for grunnleggende statiske nettsteder eller når De ønsker mer kontroll over logikken i Worker-skriptet.
  • Cloudflare Pages: En komplett CI/CD-plattform med Git-integrasjon, automatiske bygg og forhåndsvisningsdistribusjoner. Ideell for moderne JAMstack-nettsteder og SPA-er.

SPA-er og ruting på klientsiden

Workers Sites og Pages egner seg perfekt for Single Page Applications (SPA-er). SPA-er bruker ofte ruting på klientsiden, noe som betyr at serveren alltid leverer den samme index.html-filen, mens JavaScript håndterer navigeringen.

Cloudflare Pages håndterer dette automatisk. For Workers Sites kan det være nødvendig med et lite Worker-skript for å sikre at alle baner faller tilbake til index.html.

Test kunnskapene

De har lært om to kraftige måter å drifte webapplikasjoner på edge-nettverket. La oss se om De kan skille mellom dem.

Oppsummering: Edge-drift av webapplikasjoner

I denne leksjonen utforsket vi hvordan Cloudflare gjør det mulig å drifte statiske nettsteder og SPA-er på edge-nettverket. Vi gikk gjennom:

  • Workers Sites: For enkle statiske distribusjoner via Wrangler.
  • Cloudflare Pages: En plattform med omfattende funksjonalitet, Git-integrasjon og CI/CD for JAMstack-applikasjoner.
  • De imponerende fordelene ved edge-drift, som hastighet og global rekkevidde.

Edge-drift bringer innholdet nærmere brukerne og sørger for en rask, sikker og svært tilgjengelig webopplevelse.

Gratis å komme i gang

Lær deg Edge computing med Cloudflare Workers og Deno med en AI-veileder – gratis

Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.

Kurs
12
Leksjoner
47

Ofte stilte spørsmål

Er leksjonen «Workers Sites og Pages» gratis?

Ja – hele teksten i «Workers Sites og Pages» er gratis å lese her på nettet. For å øve interaktivt med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt, og for å låse opp resten av Edge computing med Cloudflare Workers og Deno-kurset, kan du oppgradere til CoddyKit PRO. Kurset i Edge computing med Cloudflare Workers og Deno inneholder totalt 4 leksjoner.

Hva lærer jeg i «Workers Sites og Pages»?

Drift statiske nettsteder og enkeltsideapplikasjoner direkte på Cloudflares edge ved hjelp av Workers Sites og Pages. Du øver på Edge computing med Cloudflare Workers og Deno med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.

Trenger jeg erfaring for å begynne med Edge computing med Cloudflare Workers og Deno?

Ingen tidligere erfaring er nødvendig. Edge computing med Cloudflare Workers og Deno på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 1 av 4.

Hvor lang tid tar leksjonen «Workers Sites og Pages»?

De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.

Kan jeg skrive og kjøre kode i denne Edge computing med Cloudflare Workers og Deno-leksjonen?

Ja. Alle Edge computing med Cloudflare Workers og Deno-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.

Alle leksjonene i dette kurset

  1. Workers Sites og Pages
  2. Integrering av frontend-rammeverk
  3. Databaseproxyer med Deno
  4. Gjengivelse på serversiden på edge
← Tilbake til Edge computing med Cloudflare Workers og Deno