Denne veiledningen viser deg hvordan du kan opprette en enkel blogg ved hjelp av en statisk nettstedgenerator som er veldig rask og enkel å bruke.
Hva er en SSG?
SSG, eller Static Site Generator, er en webapplikasjon som konverterer det dynamiske innholdet på en webside til statisk innhold som vanligvis lagres lokalt. Statiske nettstedgeneratorer krever ikke databaser og backends, og eliminerer dermed behovet for å lære å kode. Det fokuserer hovedsakelig på å skrive og presentere innholdet.
SSG vs. CMS
Den mest populære måten å lage nettsteder og administrere innhold på er å bruke CMS eller Content Management-systemer som WordPress, Drupal, Joomla, etc.
CMS-systemer fungerer ved å lage og administrere innhold direkte ved hjelp av et interaktivt grensesnitt. Siden data i et CMS blir hentet fra databasen, er CMS-er veldig sakte ettersom innholdet hentes og serveres som dynamisk innhold. CMS-systemer er også utsatt for sikkerhetsproblemer ettersom de er avhengige av eksterne plugins skrevet av andre utviklere for å øke funksjonaliteten.
På den annen side fungerer statiske nettstedgeneratorer ved å lage innhold offline offline som tekstredigerere og gjengir den endelige sidevisningen etter publisering. Siden innholdet er gjengitt lokalt, uten behov for en database, gjengis siden raskere, og lasthastighetene er utrolig raske.
Statiske generatorer er laget av forhåndskompilert kode som fungerer som en motor for å gjengi det publiserte innholdet.
Hvordan lage en statisk blogg med Hexo
Et av de populære valgene for å bygge et statisk sted er Hexo.
Hexo er en enkel, rask og kraftig SSG-applikasjon skrevet i NodeJS. Selv om det er andre valg for å bygge et statisk nettsted, lar Hexo deg tilpasse nettstedet ditt og integrere forskjellige verktøy.
La oss se på hvordan vi kan sette opp et enkelt statisk nettsted med Hexo.
Installere Hexo
Før vi kan bygge et nettsted, må vi sette opp hexo-krav og installere det. For dette krever vi NodeJS og git.
Start med å oppdatere systemet:
sudo apt-get oppdateringsudo apt-get oppgradering
Når du har oppdatert systemet, installerer du git
sudo apt-get install gitDeretter installerer du nodejs fra nodesource ved hjelp av kommandoen:
krølle -sL https: // deb.nodesource.no / oppsett_14.x | sudo -E bash -apt-get install -y nodejs
Når du har installert Nodejs, kan vi fortsette å installere hexo ved hjelp av kommandoen:
npm installer -g hexo-cliJobber med Hexo
Når du har installert hexo, kan du opprette et nettsted og publisere innhold. La oss se på hvordan vi kan jobbe med Hexo. Husk at dette er en rask, enkel guide. Se dokumentasjonen for å lære mer.
Opprette et nettsted
For å opprette et nytt hexo-nettsted, bruk kommandoen nedenfor:
hexo init HexoSitecd HexoSite
npm installere
Forstå Hexo Directory-strukturen
Når du har initialisert et nytt Hexo-nettsted, får du en katalogstruktur som den nedenfor:
-rw-r - r-- 1 cs cs 0 8. feb 20:51 _config.landskap.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. februar 20:51 pakke-lås.json drwxr-xr-x 1 cs cs 4096 8. feb 20:51 stillas 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 filen er _config.yml inneholder alle innstillingene for nettstedet ditt. Sørg for å endre det før du distribuerer nettstedet ditt, fordi det vil inneholde standardverdier.
Den neste filen er pakken.json-fil som inneholder NodeJS-applikasjonsdata og konfigurasjoner. Her finner du installerte pakker og deres versjoner.
Du kan lære mer om pakken.json fra ressurssiden nedenfor:
https: // docs.npmjs.com / cli / v6 / configuring-npm / package-json
Opprette en blogg
For å lage en enkel blogg i hexo, bruk kommandoen:
hexo ny blogg “Hello World Blog”Når du er opprettet, kan du arkivere markdown-filen under / source / _posts-katalogen. Du må bruke Markdown markup språk for å skrive innhold.
Opprette en ny side
Å lage en side i Hexo er enkelt; bruk kommandoen:
hekso ny side “Side-2”Sidekilden ligger under / kilde / Side-2 / indeks.md
Genererer og serverer innhold
Når du publiserer innholdet ditt på hexo, må du kjøre programmet for å generere det statiske innholdet.
Bruk kommandoene nedenfor:
$ hexo generererINFO Validerende konfigurasjon
INFO Start behandlingen
INFO Filer lastet inn i 966 ms
INFO generert: arkiv / indeks.html
INFO generert: Side-2 / indeks.html
INFO generert: arkiv / 2021 / indeks.html
INFO generert: indeks.html
INFO generert: arkiv / 2021/02 / indeks.html
INFO generert: js / script.js
INFO generert: fancybox / jquery.fancybox.min.css
INFO generert: 2021/02/08 / Hello-World-Post / index.html
INFO generert: css / stil.css
INFO generert: 2021/02/08 / hallo-world / index.html
INFO generert: css / fonts / FontAwesome.otf
INFO generert: css / fonts / fontawesome-webfont.woff
INFO generert: css / fonts / fontawesome-webfont.eot
INFO generert: fancybox / jquery.fancybox.min.js
INFO generert: css / fonts / fontawesome-webfont.woff2
INFO generert: js / jquery-3.4.1.min.js
INFO generert: css / fonts / fontawesome-webfont.ttf
INFO generert: css / bilder / banner.jpg
INFO generert: css / fonts / fontawesome-webfont.svg
INFO 19 filer generert i 2.08 s
For å betjene applikasjonen, kjør kommandoen:
$ hexo server INFO Validerende config INFO Start behandling INFO Hexo kjører på http: // localhost: 4000 . Trykk Ctrl + C for å stoppe.Konklusjon
Denne raske og enkle introduksjonen har vist deg hvordan du bruker det statiske nettstedet Hexo. Hvis du trenger mer informasjon om hvordan du arbeider med Hexo, kan du se hoveddokumentasjonen nedenfor:
https: // hekso.io / docs