🥇Kuidas teha Cloudflare'i töötajate saitidel staatilist veebisaiti

Tere! Minu nimi on Dima, ma olen Wrike'i SysOpsi meeskonna tehniline juht. Selles artiklis räägin teile, kuidas 10 minuti ja 5 dollariga kuus muuta veebisait kasutajale võimalikult lähedale ning selle kasutuselevõtt automatiseerida. Artiklil pole peaaegu midagi pistmist meie meeskonnas lahendatavate probleemidega. See on pigem minu isiklik kogemus ja muljed minu jaoks uue tehnoloogia tundmaõppimisest. Püüdsin samme võimalikult detailselt kirjeldada, et juhised oleksid kasulikud ka erinevate kogemustega inimestele. Loodan, et naudite. Mine!

Niisiis, võib-olla olete juba leidnud lihtsa ja odava viisi veebisaidi hostimiseks. Võib-olla isegi tasuta, nagu siin kirjeldatud suurepärane artikkel.

Kuid järsku on teil ikkagi igav ja soovite puudutada uut vaprat tehnoloogiamaailma? Oletame, et mõtlete juurutamise automatiseerimisele ja soovite oma saiti nii palju kui võimalik kiirendada? Selles artiklis me kasutame Hugo, kuid see on valikuline.

Kasutame automatiseerimiseks Gitlab CI/CD-d, aga kuidas on kiirendusega? Juurutame saidi otse Cloudflare'i kasutades Töötajate saidid.

Mida on vaja alustamiseks:

Gitlab (teie enda või hägune)
Konto Cloudflare'is
Paigaldatud nodejs/npm

1. osa: Hugo installimine

Kui teil on Hugo juba installitud või kui eelistate mõnda muud staatilist saidi generaatorit (või ei kasuta seda üldse), võite selle osa vahele jätta.

Laadige Hugo alla saidilt https://github.com/gohugoio/hugo/releases
Paigutame Hugo käivitatava faili vastavalt ühele punktis määratletud failist PATH viise
Uue saidi loomine: hugo new site blog.example.com
Muutke praegune kataloog vastloodud kataloogiks: cd blog.example.com
Valige kujundusteema (https://github.com/budparr/gohugo-theme-ananke/releases või mida iganes)
Loome esimese postituse: hugo new posts/my-amazing-post.md
Lisage loodud faili sisu: content/posts/my-mazing-post.md.
Kui kõik on tehtud, muutke mustandi väärtuseks vale
Staatiliste failide genereerimine: hugo -D

Nüüd asub meie staatiline sait kataloogis ./avalik ja valmis teie esimeseks käsitsi kasutuselevõtuks.

2. osa: Cloudflare'i seadistamine

Vaatame nüüd Cloudflare'i algset seadistust. Oletame, et meil on saidi domeen juba olemas. Võtame näiteks blog.example.com.

1. samm: looge DNS-i kirje

Esmalt valige meie domeen ja seejärel menüüelement DNS. Loome ajaveebi A-kirje ja märgime selle jaoks mõne fiktiivse IP (see on ametlik soovitus, kuid nad oleksid võinud selle natuke ilusamaks muuta).

2. samm: Cloudflare'i märk

Minu profiil -> API märgid sakk-> Loo Token -> Loo kohandatud märk

Siin peate piirama märgi kontode ja tsoonidega, kuid jätma pildil loetletud lubade jaoks valiku Redigeerimine.

Salvestage žetoon tuleviku jaoks, vajame seda kolmandas osas.

3. samm: hankige konto ja tsoonikood

Domeen → Ülevaade → [parem külgriba]

Need on minu omad, ära kasuta neid palun :)

Salvestage need märgi kõrvale, vajame neid ka kolmandas osas.

4. samm: aktiveerige töötajad

Domeen → Töötajad → Töötajate haldamine

Valime ainulaadse nime ja tariifi Töötajad → Piiramatu (täna 5 dollarit kuus). Soovi korral saate hiljem tasuta versioonile üle minna.

3. osa: esimene kasutuselevõtt (käsitsi juurutamine)

Tegin esimese käsitsi juurutamise, et teada saada, mis seal tegelikult toimub. Kuigi kõike seda saab teha lihtsamalt:

Installige wrangler: npm i @cloudflare/wrangler -g
Läheme meie ajaveebi kataloogi: cd blog.example.com
Käivitage wrangler: wrangler init — site hugo-worker
Looge wrangleri konfiguratsioon (sisestage luba, kui seda küsitakse): wrangler config

Proovime nüüd vastloodud failis muudatusi teha wrangler.toml ( siin võimalike seadete täielik loend):

Märkige arvestuslik ja tsooniline
Muuda tee millegi sellise juurde *blog.example.com/*
Märkige vale eest töötajaddev
Muuda ämbriks ./public (või kus asub teie staatiline sait)
Kui teil on teel rohkem kui üks domeen, peaksite tööskriptis tee parandama: Workers-site/index.js (vt funktsiooni käepideSündmus)

Suurepärane, on aeg sait meeskonna abil juurutada wrangler publish.

4. osa: juurutamise automatiseerimine

See juhend on kirjutatud Gitlabi jaoks, kuid see kajastab automatiseeritud juurutamise olemust ja lihtsust üldiselt.

1. samm: looge ja konfigureerige meie projekt

Looge uus GitLabi projekt ja laadige üles sait: kataloog blog.example.com kogu sisuga peab asuma projekti juurkataloogis
Seadsime muutuv CFAPITOKEN siin: Seaded → CI / CD → Muutujad

2. toiming. Looge fail .gitlab-ci.yml ja käivitage esimene juurutamine

Looge fail .gitlab-ci.yml juurtes järgmise sisuga:

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 #

Käivitame esimese juurutamise käsitsi (CI/CD → Torujuhtmed → Käivita torujuhe) või pühendudes põhiharule. Voila!

Järeldus

Noh, ma võisin seda veidi alahinnata ja kogu protsess võttis veidi üle kümne minuti. Kuid nüüd on teil kiire sait automaatse juurutamisega ja värskete ideedega selle kohta, mida saate töötajatega veel teha.

Cloudflare'i töötajad Hugo GitLab Ci

Allikas: www.habr.com

Kuidas teha Cloudflare'i töötajate saitidel staatilist saiti