< NodeJS

Hexo

Szerző: Sallai András

Copyright © 2022, Sallai András

Szerkesztve: 2024

Licenc: CC Attribution-Share Alike 4.0 International

Web: https://szit.hu

Bevezetés

A hexo egy blog keretrendszer, ahol Markdown-ban készítjük a weblapokat, a postokat.

Dokumentáció:

https://hexo.io/docs/ (2022)

Telepítés

npm install hexo-cli -g

Projekt készítése

mkdir app01
cd app01
hexo init

Fejlesztői szerver futtatása

hexo server

Post létrehozása

A legegyszerűbb dolog, post létrehozása. A new al-paranccsal hozhatunk létre új postot. A new után adjuk meg a milyen fájlnéven szeretnénk tárolni.

hexo new valami

Esetleg megadhatjuk a fájlnévben az aktuális dátumot vagy annak egy részét:

hexo new 2024-03-29_1_Valami

Egy ehhez hasonló tartalmú fájlt kapunk:

--- title: Valami date: 2024-03-29 06:37:42 tags: --- ## Leírás

A weboldat ha frissítjük megjelenik a post.

Terv

Ha csak tervezzük a post létrehozását:

hexo new draft valami

Létrejön egy a source/_drafts könyvtár, benne a valami.md fájl.

Ha szeretnénk a terveket látni a fejlesztői szerveren:

hexo server --draft

A terv publikálása:

hexo publish valami

A valami post átkerül a source/_posts könyvtárba.

Oldal létrehozása

hexo new page mas

Létrejön egy source/mas könyvtár benne egy index.md fájl.

source/mas/index.md

A böngészőben így érhető el:

http://localhost:4000/mas/

Layout

Az előző fejezetben a new paranccsal postot hoztunk létre. De létrehozhatunk tervezett postot, másként megnevezve: draft. De létrehozható oldal is, amit page-nek nevezünk. A post, a page és a draft lehetőségeket nevezzük Layout-nak.

Három layout van:

post - source/_posts

page - source

draft - source/_drafts

Alapértelmezett layout a post. Ez megváltoztatható a _config.yml fájlban:

default_layout: post

A hexo new szintaktikája:

hexo new [layout] <title>

A layout megadása nem kötelező. Ha nem adjuk meg, a fenti beállítás érvényesül.

Fejrészek

A fejrészek --- 3 darab kötőjel közzé írjuk:

--- title: JavaScript bevezetés date: 2024-03-29 06:28:14 tags: [JavaScript, HTML] ---

Megadhatók kulcsok: cím, dátum és tagek.

Scaffolds

Minden layout-nak van egy alapértelmezett tartalma, ezt nevezzük Scaffold-nak. Ezek a scaffolds könyvtárban találhatók és átírhatók.

--- title: {{ title }} tags: author: Nagy János --- Alapértelmezett tartalom.

Készíthetünk saját vázat.

--- title: {{ title }} tags: author: Nagy János --- Alapértelmezett tartalom.

Használat:

hexo new akarmi ujpost

Tagek és kategóriák

A tagek létrehozása lehetővé teszi, hogy csoportosítsuk a postokat.

---
title: valami
date: 2024-03-29 06:28:14
tags: [tag1]
---

A csoportosításra használhatunk kategóriákat is:

--- title: bali date: 2024-03-29 06:28:14 tags: [tag1, tag2] categories: - [kat1] - [kat2] ---

Alkategória:

--- title: bali date: 2024-03-29 06:28:14 tags: [tag1, tag2] categories: - [kat1, kat1.1] - [kat2] ---

Téma (kinézet)

Válasszunk témát:

https://hexo.io/themes/index.html

A témák általában letölthetők a git clone paranccsal. A letöltést themes könyvtárba végezzük el.

git clone utvonal themes/valami

git clone https://github.com/lotabout/hexo-theme-noise themes/noise

Olvassuk el a GitHub-os oldalt, mert lehet a telepítéshez még szükséges valami. A noise számára például kell két csomag:

npm install hexo-renderer-less --save
npm install hexo-renderer-pug --save

Végül a _config.yml fájlban beállítjuk és kész.

A szervert ha fut, újra kell indítani.

Oldal generálása public könyvtárba

hexo generate

Létrejön egy public könyvtár, ami feltölthető tárhelyre.

app01/
|-public/
|-source/

Deploy

GitHub

Telepítsük a hexo-deployer-git csomagot:

npm install hexo-deployer-git --save

Ha tudjuk hol lesz állítsuk be a _config.yml fájlt:

url: https://valaki.github.io/valami/
# ... deploy: type: git repo: https://github.com/valaki/valami.git branch: master

A GitHub webhelyen:

Settings

Pages

Source: Deploy from a branch

Branch: master /(root)

Ha le van generálva a weblap:

hexo clean && hexo deploy

Ugyanaz npm parancsokkal:

npm run clean
npm run deploy

Hivatalos dokumentum:

https://hexo.io/docs/one-command-deployment (2024)