Hugo

Can a website with image uploading support be built with Hugo?

This is a question translated from

I want to build a simple website that consists merely of image upload and download functionalities. Uploaded images would be processed before users can download them. Is that possible in Hugo?

My answer:

A pure Hugo solution is not possible, since Hugo is a static site generator.

:thought_balloon: Hugo + Staticman is possible in theory.

  1. Configure Staticman comment form (tutorial) and Continuous Integration. (Require a GitHub/GitLab account.)
  2. Prepare Hugo template for image processing.
  3. :envelope_with_arrow: Encode: prepare a JavaScript to base64 encode image.
  4. :outbox_tray: Upload: in the Staticman comment form, type in an <img> element with the base64 string obtained from the previous step. Submit the form.
  5. :eyes: Download: wait for a moment / approve the pull/merge request. Continuous integraton will call Hugo to execute template code for image processing. Processed image will be displayed in the “comment”, as the screenshot below illustrates.

I really like staticman, but I think there are more use cases. For example, someone creates a search and expects a new page with their search terms, have those cached and served by Hugo and not use CI for that. i can understanding waiting 10 seconds for a page to go through an automatic approval process for like adding a new job to a job board, but being able to search the site is really important from even people that have JavaScript turned off IMO.