An EXPERIMENTAL idea for a web based editor for Hugo.
UPDATE: Check a better project using Cockpit Hugo, builti by @iakta.
THIS IS IN APLHA STATE.
I stumbled upon on the Cockpit CMS, which is built in PHP and uses SQLite (or MongoDB) as database. I've found it very neat, as it has custom fields and other cool stuff and appears to be very fast.
But I wondered if I could adapt it as an editor for Hugo, a static site generator built in Go. As a matter of fact, it worked better than expected. :)
I put together a quick demo video to show my approach and how things worked. I used Cockpit's PHP API to create the .md files for Hugo.
The project's code is all here, but you will need to install Hugo on your machine, of course. You also need to have the requirements for running Cockpit:
- PHP >= 5.4
- PDO SQLite (or MongoDB)
- GD extension
- mod_rewrite enabled (on apache)
- Cockpit dashboard: https://raw.githubusercontent.com/sjardim/Hugopit/master/cockpit-screenshot.png
- Hugo website: https://raw.githubusercontent.com/sjardim/Hugopit/master/hugo-screenshot.png
Although Cockpit appears to have great performance, it still depends on a server running PHP. With this solution, you can have the UX of a web based editor and use Hugo to create a static site that can run everywhere (Github pages, S3, etc). Nothing beats this approach in security (no files and database to worry about).
You can't import Hugo content to it, unless you make such code. This was an experiment and only works on creating new content.
- Download this repo contents
- Create a new hugo site:
hugo new site mysite
- Replace
mysite
folder contents with the contents you just downloaded - Run hugo server --watch
Note: I recorded the screen on my ultra wide monitor wich has a proportion of 21:9. I noticed after that it wasn't the best of ideas, specially if you watch it on a small monitor.