Hvernig á að búa til kyrrstæða síðu á Cloudflare Workers Sites

Halló! Ég heiti Dima, ég er tæknilegur yfirmaður fyrir SysOps teymið hjá Wrike. Í þessari grein mun ég segja þér hvernig á að gera vefsíðu eins nálægt notandanum og mögulegt er og gera sjálfvirkan uppsetningu hennar á 10 mínútum og 5 dollurum á mánuði. Greinin hefur nánast ekkert með vandamálin sem við leysum innan teymisins að gera. Þetta er frekar persónuleg reynsla mín og tilfinningar af því að kynnast tækni sem er ný fyrir mér. Ég reyndi að lýsa skrefunum eins ítarlega og hægt var svo leiðbeiningarnar gætu nýst fólki með mismunandi reynslu. Ég vona að þú hafir gaman af. Farðu!

Hvernig á að búa til kyrrstæða síðu á Cloudflare Workers Sites

Svo kannski hefurðu þegar fundið auðvelda og ódýra leið til að hýsa vefsíðu. Kannski jafnvel ókeypis, eins og lýst er í þessu frábær grein.

En allt í einu leiðist þér enn og vilt snerta hinn hugrakka nýja tækniheim? Segjum að þú sért að hugsa um að gera sjálfvirkan dreifingu og vilt flýta síðunni þinni eins mikið og mögulegt er? Í þessari grein munum við nota Hugo, en þetta er valfrjálst.

Við notum Gitlab CI/CD fyrir sjálfvirkni, en hvað með hröðun? Við skulum dreifa síðunni beint í Cloudflare með því að nota Starfsmannasíður.

Hvað þarf til að byrja:

Part 1: Uppsetning Hugo

Ef þú ert nú þegar með Hugo uppsettan, eða ef þú vilt frekar annan kyrrstæðan vefstöð (eða notar alls ekki), þá geturðu sleppt þessum hluta.

  1. Sækja Hugo frá https://github.com/gohugoio/hugo/releases

  2. Við setjum Hugo keyrsluskrána í samræmi við eina af þeim sem eru skilgreindar í PATH leiðir

  3. Að búa til nýja síðu: hugo new site blog.example.com

  4. Breyttu núverandi möppu í þá nýstofnaða: cd blog.example.com

  5. Veldu hönnunarþema (https://github.com/budparr/gohugo-theme-ananke/releases eða hvað sem er)

  6. Við skulum búa til fyrstu færsluna: hugo new posts/my-amazing-post.md

  7. Bættu efni við búna skrána: content/posts/my-amazing-post.md.
    Þegar allt er búið skaltu breyta dröggildinu í rangar

  8. Búa til truflanir skrár: hugo -D

Nú er kyrrstæða síða okkar staðsett inni í möppu ./opinber og tilbúinn fyrir fyrstu handvirku dreifinguna þína.

Part 2: Setja upp Cloudflare

Nú skulum við líta á upphaflegu uppsetningu Cloudflare. Gerum ráð fyrir að við höfum nú þegar lén fyrir síðuna. Tökum sem dæmi blog.example.com.

Skref 1: Búðu til DNS færslu

Veldu fyrst lénið okkar og síðan valmyndaratriðið DNS. Við búum til A-skrá fyrir blogg og tilgreinum einhverja tilbúna IP fyrir hana (þetta er hið opinbera meðmæli, en þeir hefðu getað gert það aðeins fallegra).

Hvernig á að búa til kyrrstæða síðu á Cloudflare Workers Sites

Skref 2: Cloudflare Token

  1. Prófílinn minn -> API tákn flipi-> Búðu til tákn -> Búðu til sérsniðið tákn

Hvernig á að búa til kyrrstæða síðu á Cloudflare Workers Sites

Hér þarftu að takmarka táknið við reikninga og svæði, en skildu eftir Breyta valkostinn fyrir heimildirnar sem taldar eru upp á myndinni.

Geymdu táknið til framtíðar, við munum þurfa það í þriðja hluta.

Skref 3: Fáðu accountid og zoneid

lén Yfirlit → [hægri hliðarslá]

Hvernig á að búa til kyrrstæða síðu á Cloudflare Workers SitesÞetta eru mínar, ekki nota þær vinsamlegast :)

Vistaðu þau við hlið táknsins, við þurfum þau líka í þriðja hlutanum.

Skref 4: Virkjaðu starfsmenn

lén Starfsmenn Stjórna starfsmönnum

Við veljum einstakt nafn og gjaldskrá Starfsmenn → Ótakmarkað ($5 á mánuði í dag). Ef þú vilt geturðu síðar uppfært í ókeypis útgáfuna.

Hluti 3: Fyrsta dreifing (handvirk dreifing)

Ég gerði fyrstu handvirku dreifinguna til að komast að því hvað var í raun að gerast þarna. Þó að allt þetta sé hægt að gera einfaldara:

  1. Settu upp Wrangler: npm i @cloudflare/wrangler -g

  2. Við skulum fara í möppuna á blogginu okkar: cd blog.example.com

  3. Ræstu wrangler: wrangler init — site hugo-worker

  4. Búðu til stillingar fyrir Wrangler (sláðu inn táknið þegar spurt er): wrangler config

Nú skulum við reyna að gera breytingar á nýstofnuðu skránni wrangler.toml (hér fullur listi yfir mögulegar stillingar):

  1. Við gefum til kynna accountid og zoneid

  2. Breyting leið eitthvað eins og *blog.example.com/*

  3. Við gefum til kynna rangar í workersdev

  4. Breyttu fötu í ./public (eða hvar kyrrstæða vefsvæðið þitt er staðsett)

  5. Ef þú ert með fleiri en eitt lén í slóðinni, þá ættir þú að leiðrétta slóðina í vinnuhandritinu: workers-site/index.js (sjá fall höndlaEvent)

Frábært, það er kominn tími til að dreifa síðunni með því að nota teymið wrangler publish.

Hluti 4: Sjálfvirkni dreifingarinnar

Þessi handbók er skrifuð fyrir Gitlab, en hún fangar kjarna og vellíðan sjálfvirkrar dreifingar almennt.

Skref 1: Búðu til og stilltu verkefnið okkar

  1. Búðu til nýtt GitLab verkefni og hladdu upp síðunni: möppunni blog.example.com með öllu innihaldi verður að vera staðsett í rótarskrá verkefnisins

  2. Við settum breytilegt CFAPITOKEN hér: Stillingar CI / CDBreytur

Skref 2: Búðu til .gitlab-ci.yml skrá og keyrðu fyrstu dreifinguna

Búðu til skrá .gitlab-ci.yml í rótinni með eftirfarandi innihaldi:

stages:
  - build
  - deploy

build:
  image: monachus/hugo
  stage: build
  variables:
    GIT_SUBMODULE_STRATEGY: recursive
  script:
    - cd blog.example.com/
    - hugo
  artifacts:
    paths:
      - blog.example.com/public
  only:
    - master # this job will affect only the 'master' branch
  tags:
    - gitlab-org-docker #


deploy:
  image: timbru31/ruby-node:2.3
  stage: deploy
  script:
    - wget https://github.com/cloudflare/wrangler/releases/download/v1.8.4/wrangler-v1.8.4-x86_64-unknown-linux-musl.tar.gz
    - tar xvzf wrangler-v1.8.4-x86_64-unknown-linux-musl.tar.gz
    - cd blog.example.com/
    - ../dist/wrangler publish
  artifacts:
    paths:
      - blog.example.com/public
  only:
    - master # this job will affect only the 'master' branch
  tags:
    - gitlab-org-docker #

Við ræsum fyrstu dreifinguna handvirkt (CI/CD Leiðslur Keyra leiðslu) eða með því að skuldbinda sig til meistaraútibúsins. Voila!

Ályktun

Jæja, ég gæti hafa vanmetið það aðeins og allt ferlið tók rúmlega tíu mínútur. En nú ertu með hraðvirka síðu með sjálfvirkri uppsetningu og ferskum hugmyndum um hvað annað þú getur gert með Workers.

 Cloudflare starfsmenn    Hugo    GitLab Ci

Heimild: www.habr.com

Bæta við athugasemd