Denne vejledning viser dig, hvordan du kan oprette en simpel blog ved hjælp af en statisk stedgenerator, der er meget hurtig og nem at bruge.
Hvad er en SSG?
SSG, eller Static Site Generator, er en webapplikation, der konverterer det dynamiske indhold på en webside til statisk indhold, der normalt er gemt lokalt. Statiske webstedsgeneratorer kræver ikke databaser og backends, hvilket eliminerer behovet for at lære at kode. Det fokuserer primært på at skrive og præsentere indholdet.
SSG vs. CMS
Den mest populære måde at oprette websteder og administrere indhold på er at bruge CMS eller indholdsstyringssystemer som WordPress, Drupal, Joomla osv.
CMS-systemer fungerer ved at oprette og administrere indhold direkte ved hjælp af en interaktiv grænseflade. Da data i et CMS hentes fra databasen, er CMS'er meget langsomme, da indholdet hentes og serveres som dynamisk indhold. CMS-systemer er også tilbøjelige til sikkerhedssårbarheder, da de er afhængige af eksterne plugins skrevet af andre udviklere for at øge funktionaliteten.
På den anden side arbejder statiske webstedsgeneratorer ved at oprette indhold offline medier såsom teksteditorer og gengiver den endelige sidevisning efter offentliggørelse. Da indholdet gengives lokalt uden behov for en database, gengives siden hurtigere, og indlæsningshastighederne er utroligt hurtige.
Statiske webstedsgeneratorer er lavet af præ-kompileret kode, der fungerer som en motor til at gengive det offentliggjorte indhold.
Sådan opbygges en statisk blog med Hexo
Et af de populære valg for at opbygge et statisk sted er Hexo.
Hexo er en enkel, hurtig og kraftfuld SSG-applikation skrevet i NodeJS. Selvom der er andre valg til at opbygge et statisk sted, giver Hexo dig mulighed for at tilpasse dit websted og integrere forskellige værktøjer.
Lad os se på, hvordan vi kan oprette et simpelt statisk sted med Hexo.
Installation af Hexo
Før vi kan bygge et websted, skal vi oprette hexokrav og installere det. Til dette kræver vi NodeJS og git.
Start med at opdatere dit system:
sudo apt-get opdateringsudo apt-get opgradering
Når du har opdateret dit system, skal du installere git
sudo apt-get install gitDernæst skal du installere nodejs fra nodesource ved hjælp af kommandoen:
krølle -sL https: // deb.nodesource.com / setup_14.x | sudo -E bash -apt-get install -y nodejs
Når du har installeret Nodejs, kan vi fortsætte med at installere hexo ved hjælp af kommandoen:
npm installer -g hexo-cliArbejde med Hexo
Når du har installeret hexo, kan du oprette et websted og udgive indhold. Lad os se på, hvordan vi arbejder med Hexo. Husk, at dette er en hurtig, enkel guide. Se dokumentationen for at lære mere.
Oprettelse af et websted
For at oprette et nyt hexo-sted skal du bruge kommandoen nedenfor:
hexo init HexoSitecd HexoSite
npm installation
Forståelse af Hexo Directory-struktur
Når du først har initialiseret et nyt Hexo-websted, får du en katalogstruktur som den nedenfor:
-rw-r - r-- 1 cs cs 0 8. feb 20:51 _config.landskab.yml-rw-r - r-- 1 cs cs 2439 8. feb 20:51 _config.yml drwxr-xr-x 1 cs cs 4096 8. feb 20:51 node_modules
-rw-r - r-- 1 cs cs 615 8. februar 20:51 pakke.json
-rw-r - r-- 1 cs cs 56716 8. feb 20:51 pakke-lås.json drwxr-xr-x 1 cs cs 4096 8. feb 20:51 stilladser drwxr-xr-x 1 cs cs 4096 8. feb 20:51 kilde drwxr-xr-x 1 cs cs 4096 8 feb 20:51 temaer
Den første fil er _config.yml indeholder alle indstillingerne for dit websted. Sørg for at ændre det, før du implementerer dit websted, fordi det indeholder standardværdier.
Den næste fil er pakken.json-fil, der indeholder NodeJS-applikationsdata og konfigurationer. Her finder du installerede pakker og deres versioner.
Du kan lære mere om pakken.json fra ressource siden nedenfor:
https: // docs.npmjs.com / cli / v6 / configuring-npm / package-json
Oprettelse af en blog
For at oprette en simpel blog i hexo skal du bruge kommandoen:
hexo ny blog “Hello World Blog”Når du er oprettet, kan du arkivere markdown-filen under / source / _posts-biblioteket. Du bliver nødt til at bruge Markdown markup sprog til at skrive indhold.
Oprettelse af en ny side
Oprettelse af en side i Hexo er enkel; Brug kommandoen:
hexo ny side “Side-2”Sidekilden er placeret under / source / Page-2 / index.md
Generering og visning af indhold
Når du først har udgivet dit indhold på hexo, skal du køre applikationen for at generere det statiske indhold.
Brug nedenstående kommandoer:
$ hexo generererINFO Validerende konfiguration
INFO Start behandlingen
INFO Filer indlæst i 966 ms
INFO genereret: arkiver / indeks.html
INFO genereret: Side-2 / indeks.html
INFO genereret: arkiver / 2021 / indeks.html
INFO genereret: indeks.html
INFO genereret: arkiver / 2021/02 / indeks.html
INFO genereret: js / script.js
INFO genereret: fancybox / jquery.fancybox.min.css
INFO genereret: 2021/02/08 / Hello-World-Post / index.html
INFO genereret: css / stil.css
INFO genereret: 2021/02/08 / hej-verden / indeks.html
INFO genereret: css / skrifttyper / FontAwesome.otf
INFO genereret: css / fonts / fontawesome-webfont.woff
INFO genereret: css / fonts / fontawesome-webfont.eot
INFO genereret: fancybox / jquery.fancybox.min.js
INFO genereret: css / fonts / fontawesome-webfont.woff2
INFO genereret: js / jquery-3.4.1.min.js
INFO genereret: css / fonts / fontawesome-webfont.ttf
INFO genereret: css / billeder / banner.jpg
INFO genereret: css / fonts / fontawesome-webfont.svg
INFO 19 filer genereret i 2.08 s
For at tjene applikationen skal du køre kommandoen:
$ hexo server INFO Validerende konfiguration INFO Start behandling INFO Hexo kører på http: // localhost: 4000 . Tryk på Ctrl + C for at stoppe.Konklusion
Denne hurtige og enkle introduktion har vist dig, hvordan du bruger det statiske Hexo-sted. Hvis du har brug for flere oplysninger om, hvordan du arbejder med Hexo, henvises til hoveddokumentationen nedenfor:
https: // hexo.io / docs