Jauna vēsture

Kā ieviest Hugo blogu GitHub lapās ar darbībām

autors Oleg Pustovit5m2025/04/30
Read on Terminal Reader

Pārāk ilgi; Lasīt

Es izveidoju vieglu tehnisko emuāru, izmantojot Hugo statiskai vietņu ģenerācijai, Caddy vietējai SSL un GitHub lapām bezmaksas hostingam.
featured image - Kā ieviest Hugo blogu GitHub lapās ar darbībām
Oleg Pustovit HackerNoon profile picture

Pēc gadiem, veidojot programmatūru un rakstot tehnisko dokumentāciju, es nolēmu izveidot emuāru, lai dalītos ar savu pieredzi un palīdzētu citiem līdzīgos ceļojumos.

Platformas izvēle

Lai gan izveidot savu Markdown-to-HTML publicēšanas skriptu ir ideja nākotnei, mana tūlītējā prioritāte bija ātri iegūt blogu tiešsaistē.


Mūsdienās, es nedomāju, ka ir grūtības, lai izveidotu personīgo tīmekļa vietni. Ir plašas iespējas, kas palīdz šajā centienā. es sākšu ar sarakstu alternatīvas, kas nāk prātā:


  • CMS (piemēram, WordPress, Content Hub, Joomla utt.): Lai gan platformas, piemēram, WordPress ir spēcīgas, tās jutās pārspīlēti statiska satura emuāram.


  • Jekyll: Šī programmatūra šķiet perfekta un to plaši izmanto citi izstrādātāji, lai hostētu emuārus, bet, ņemot vērā manu pieredzes trūkumu ar Ruby, es izvēlējos to neizmantot.


  • Hugo ir rakstīts Go un izmanto pazīstamo sintaksi Go veidnes (ja jūs gadās kodēt daudz Go), bet rādot lapas Markdown (līdzīgi Jekyll).


  • 11ty, Astro, Hexo un citas Node.js balstītas alternatīvas. Tas ir izvēles jautājums, bet personīgi es nolēmu samazināt Node.js rīku izmantošanu. Lai gan ir daudz spēcīgu rīku, Node.js ekosistēma ir pazīstama ar straujām izmaiņām, kas bieži vien noveda pie tā, ka es nevarēju palaist vecos projektus, kuriem dabiski bija daudz veco atkarību.

Izveidojiet Hugo

Pēc tam, kad esmu izveidojis ievērojamu daudzumu dokumentācijas par maniem iepriekšējiem ar programmatūru saistītiem projektiem, es jūtos ļoti pārliecināts, izmantojot Markdown un termināla balstītu teksta redaktoru manam rakstīšanai.

Izmantojiet GitHub repozitoriju

Iepriekš es jau biju izveidojis GitHub Pages tīmekļa vietni ar vietas turētāja failiem un tam pievienojis domēnu, tāpēc, lai populētu failus esošajā repo, jums ir jāievada šāds komandu:

hugo new site . --force


Tas aizpildīs pašreizējo repozitorijas direktoriju ar failiem, kas nepieciešami, lai palaistu Hugo vietni. Pēc tam bija nepieciešams iestatīt tēmu un citus parametrushugo.tomlPēc tam, kad viss ir iestatīts, ir iespējams palaist serveri, ievadot komandu:hugo server

Servera darbība attīstības režīmā

Šajā brīdī tīmekļa vietne ir pieejama nolocalhostTā kā es izstrādāju attālā mākoņa VM, piekļuve vietējam Hugo serverimlocalhostBija nepieciešams droši pakļaut localhost instanci ārpasaulei - šādām vajadzībām tiek izmantots apgriezts proxy.


Kaut arī slodzes balanceri un apgrieztie proxies, piemēram, Nginx, ir diezgan izplatīti un populāri, es izvēlējosCaddylai apkalpotu manu dev tīmekļa vietni, jo tas bez pūlēm izveido SSL sertifikātus (izmantojot Let's Encrypt).CaddyTas ir darīts arCaddyfile, kur domēna interesēm jūs rakstāt areverse_proxyPaziņojums ar nepieciešamo ostu:

test-blog-domain.com {
	reverse_proxy localhost:1313
}

Pēc Caddy uzsākšanas ar iepriekšminēto konfigurāciju izstrādes vietne būs pieejama nohttps://test-blog-domain.com(Ņemot vērā to, kaADNS ierakststest-blog-domain.comir aizpildīta ar VM publisko IP adresi).

Pievienot tēmu

Hugo ir vairākas bezmaksas tēmas, kas ir publiski pieejamas GitHub. Kas ir nepieciešams, lai instalētu vienu, ir klonēt repozitoriju ar tēmu un pēc tam atjauninātthemeParametrs irhugo.tomlEs izvēlējos tēmu, ko sauccactusPēc instalēšanas man ir izveidošanas kļūda, kas sūdzas, ka Google Analytics async veidne nav atrodama:

Error: error building site: render: failed to render pages: render of "/" failed: "/home/user/projects/nexo-tech.github.io/themes/cactus/layouts/_default/baseof.html:3:3": execute of template failed: template: index.html:3:3: executing "index.html" at <partial "head.html" .>: error calling partial: execute of template failed: html/template:partials/head.html:47:16: no such template "_internal/google_analytics_async.html"
make: *** [Makefile:2: up] Error

Atbildi uz šādu jautājumu var atrastgithubHugo kopiena ir aktīva, un daudzām problēmām, ieskaitot šo Google Analytics kļūdu, GitHub ir esoši patches vai diskusijas.


Pēc tam, kad tika fiksēti citi amortizācijas brīdinājumi, vietne sāka darboties:

Tīmekļa vietnes ieviešana CDN: GitHub lapas

Pastāv daudzi veidi, kā ieviest statisku tīmekļa vietni, un vairumā gadījumu ir nepieciešams hostings vai serveris. Parasti tie nav bezmaksas vai tiem ir ierobežots plāns; tomēr ir izņēmumi, piemēram, GitHub lapās.


Zinot, ka personīgie GitHub konti ir ļoti ierobežoti uzglabāšanas artefaktu telpā, un ir garlaicīgi pārvaldīt šo uzglabāšanas telpu, es izvēlējos vienkāršāku risinājumu, kurā statiskās tīmekļa vietnes aktīvi tiks atjaunināti iepriekš definētā git filiālē (gh-pagesPar laimi, iractionsīpaši Hugo, tieši šim nolūkam:


  • Shohei Ueda akcijas-hugo.Vienkāršs veids, kā izveidot Hugo GitHub darbību vidē
  • Arī Shohei Ueda, šī darbība nospiež statiskos aktīvus uz norādīto filiāli.


Šeit ir kods no GitHub darbību darba plūsmas, kas ieviesīs Hugo uz gh-lapu. Ņemiet vērā, ka, ja ir nepieciešams pielāgots domēns, CNAME fails ir jāpārliecinās parpublic directory before running the gh-pagesTurklāt jūsu repozitorijas darba plūsmas atļaujām jābūt iestatītām uz "Lasīt un rakstīt" (var atrastSettings > Actions > GeneralTātad )

name: Build and Deploy Hugo
on:
  push:
    branches:
      - main  
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout repo
        uses: actions/checkout@v3
      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: 'latest'
          extended: true
      - name: Build site
        run: hugo --minify
      - name: Add CNAME file
        run: cp CNAME public/CNAME
      - name: Deploy to GitHub Pages
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./public
          publish_branch: gh-pages

Pēc izvietošanas pabeigšanas vietne jāuzlādē uz GitHub CDN. Pārliecinieties, ka izveidojat GitHub lapas filiālei, kas satur iebūvētus artefaktus gadījumā, ja vietne nedarbojas.


Ar Hugo izveidošanu un izvietošanu es tagad varu koncentrēties uz to, kas ir svarīgi - dalīties ar tehniskajām ieskatiem no manas pieredzes.

Saistītie resursi

  • Repository šajā tīmekļa vietnē
  • Hugo ātrs sākums
  • DNS iestatījumu konfigurēšana GitHub lapām
  • Kaktusu tēma Hugo
  • Google Analytics ieviešana Hugo
  • Caddy reverse proxy ātrā uzsākšana


Trending Topics

blockchaincryptocurrencyhackernoon-top-storyprogrammingsoftware-developmenttechnologystartuphackernoon-booksBitcoinbooks