Building a Hexo-Based Blogging Platform
Hexo is a Node.js-based static blog framework that deploys nicely to GitHub Pages. Markdown is fast, but the surrounding workflow felt clunky.
Previously both source and static site lived in GitHub. Posting a new article meant:
- Open an editor (VS Code, Vim, WebStorm…)
- Run
hexo new 'postname' - Write content
- Commit & push:
git add . && git commit -m 'add post' && git push
Wait a few minutes for Travis CI, refresh the site, done. Only step 3 is creative—the rest is repetitive, and it assumes every machine has the repo and environment set up. Switching laptops meant jotting ideas down and waiting until I got back home. Not great.
Time to apply the DRY principle and build a tool of my own.
Architecture
I picked the stack I’m most comfortable with:
- Frontend: Angular
- UI: Bootstrap
- Backend: Express.js
- Serving static files: Nginx
Features
- Authentication (login/logout)
- Post list & keyword search
- Dual-pane editor (write + preview)
- Publish Markdown + regenerate Hexo static files
Project Structure
Everything lives in one repo, but frontend and backend are still cleanly separated. That makes future steps—mobile app, storing Markdown in MongoDB, etc.—easier.
Implementation Notes
There were plenty of details: rendering Markdown previews, autosave frequency, running shell commands via Node, serving generated pages with Nginx, and so on. Not covering every line of code here, but those were the interesting bits.
Result
Now I just open the web page, write, and publish. This very article was composed in the new editor. With responsive design, I can draft from mobile as well. It’s still rough around the edges, but iteration is the fun part.
