Hexo merupakan sebuah framework untuk membuat blog. Penggunaannya relatif simple, imo satu tingkat diatas wordpress lah untuk kerumitannya.

Getting Started with Hexo

Requirements

Aplikasi yang yang dibutuhkan ada dibawah. Silahkan install terlebih dahulu

  1. NodeJS
  2. Git
  3. Atom (Optional)
  4. Cmder (Optional)

Install Hexo

Buka Cmd as Administrator, setelah jalankan perintah berikut

1
npm install -g hexo-cli

Tunggu sampai proses download selesai. Jika sudah selesai, kita bisa check version hexo yang terinstal pada komputer dengan menggunakan

1
hexo -v

Setelah menjalankan perintah diatas, akan keluar seperti tulisan berikut

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
hexo: 3.8.0
hexo-cli: 1.1.0
os: Windows_NT 10.0.17134 win32 x64
http_parser: 2.8.0
node: 10.15.0
v8: 6.8.275.32-node.45
uv: 1.23.2
zlib: 1.2.11
ares: 1.15.0
modules: 64
nghttp2: 1.34.0
napi: 3
openssl: 1.1.0j
icu: 62.1
unicode: 11.0
cldr: 33.1
tz: 2018e

Buat project Hexo untuk Github Pages

Jalankan perintah berikut pada cmd. Untuk username, sesuaikan dengan username pada github kalian.

1
2
3
hexo init username.github.io
cd username.github.io
npm install

Buat repository di Github

Buka Github, klik profile yang berada di kanan atas. Pilih Your repositories.

Create A new Repository

Klik tombol new untuk membuat repository baru

Create A new Repository

Berikan nama repository kalian sesuai dengan nama username.github.io, sebagai contoh punya saya, usernamenya cgranule. Nama repositorynya yaitu cgranule.github.io. Ini contoh ya.. jangan ikut username punya saya. hehehe

Create A new Repository

Setelah itu tinggal klik “Create Repository”

Jalankan server untuk melihat hasil tampilan

Jalankan perintah hexo server. Setelah itu buka browser kalian, dan buka link localhost:4000

Pro Tip : Install hexo-livereload buat otomatis reload

Jadi kalau kamu ngubah file, browser bakal otomatis ngereload sendiri. Jadi ngirit nekan tombol F5. Nih cara installnya

1
npm install hexo-livereload --save

Atur informasi untuk blog kamu

Kalian bisa ubah isi dari file “_config.yml”. Didalam file tersebut, ada beberapa settingan, jadi sesuaikan aja dengan kebutuhan

Gunakan Git untuk deploy

Kalian harus install dulu sih plugin hexo-deployer-git. Jalanin aja perintah

1
npm install hexo-deployer-git --save

Kalau udah, buka “_config.yml” nya, dibagian paling bawah, ada deployment, ubah deh settingannya, sesuaiin aja dengan punya kalian

1
2
3
4
deploy:
type: git
repo: https://github.com/damarindra/damarindra.github.io.git
branch: master

Pro Tip : Selalu jalankan perintah –watch

Jadi, kamu buka satu cmd lagi, nah itu untuk jalanin

1
hexo generate --watch

Fungsinya, bakal otomatis generate lagi kalau ada perubahan file dalam folder projectmu.

Buat blog post baru

Perintahnya kayak gini

1
hexo new post nama_post

Cara nulis blog post gimana?

Kalau mau video, bisa lihat disini
Kalau mau berbasis text, bisa kesini dan kesitu

Hapus aja hello-world.md

Iya serius, hapus aja, udah ga fungsi.

Deploy halaman ke github

Jalanin aja perintah ini

1
2
hexo clean
hexo deploy

Kalau udah, huehuehue, coba buka blog kamu, kalau punya saya ya yang kalian buka ini damarindra.github.io, kalau punya kalian, sesuaiin dengan username kalian. username.github.io. getoh.

Ganti tema

Cari dulu gih temanya disitu, kalau udah dapet download aja. Jangan lupa baca dokumentasinya.

Kalau udah didownload, taruh file temanya di folder themes. Jangan lupa di _config.yml diganti themes nya jadi tema yang udah kamu download tadi, misal nih nama foldernya light jadi ngeditnya kayak gini

1
2
3
4
# Extensions
## Plugins: http://hexo.io/plugins/
## Themes: http://hexo.io/themes/
theme: light

Buat page baru

Nah ini yang saya bingung dari awal, huehuehue, divideo juga saya bingung huehuehue. Jadi ada tipe page juga, contoh yang tipenya page itu about, links, dan semacamnya. Hahaha kalau mau implementasi about, tinggal jalanin aja perintah ini

1
hexo new page about

kalau tema kalian supportnya yang aboutme, ya berarti perintahnya

1
hexo new page aboutme

gitu sih. udah gampang, hahaha

Persingkat dengan “Read More”

tulis aja di blog kamu dengan tulisan ini .

Udah ah, gitu aja sih.. Makasih