photolio

A self-hosted light weight web gallery to show my photography work on my web page.

This service is not a CMS. By passing a storage location via the config, it is used to list and dispaly images in this storage location as well as generating and serving thumbnails and metadata of the images.

In the defines storage location, two directories are creates. content and thumbnails. The thumbnails directory contains pre-generated thumbnails of the images. The content directory contains the images. You can put your images in sub-directories to visually group them together in the frontend.

Example:

content/
    Crete 2023/
        DSC07476.png
        DSC07477.png
        DSC07478.png
    Prague 2021/
        DSC06231.png
        DSC06232.png
    DSC04176.png
    DSC04177.png

Demo

Here you can find the deployment of my gallery.

firefox_xTVdJoUcUq.mp4

Setup

If you want to set up this service for yourself, please consider the following steps to get started.

Backend Setup

You can use the provided Docker image to run the backend service.

$ docker pull ghcr.io/zekrotja/photolio-backend:latest

It can either be configured via a config file you can pass via the --config flag (see config.dev.toml as example) or via environment variables.

Environment Variable	Options	Default
PH_STORAGE_LOCATION	Location to diskpath where images are saved	data
PH_SERVER_PORT	Port on which the webserver listens	80
PH_SERVER_ADDRESS	Address/Host on which the webserver listens	0.0.0.0
PH_SERVER_ALLOWEDORIGIN	Allowed Origin for cors header	*
PH_CACHE_TYPE	Cache Provider (redis or memory)	memory
PH_CACHE_CACHELOCATION	Disk location for cache (only memory cache provider)	none
PH_CACHE_REDISADDRESS	Connection URL for redis (only redis cache provider)	none

Frontend

The front end is a simple React SPA listing and displaying the images by fetching the data via the backend service. If you want to host the provided frontend, please clone or fork the repository and enter your own information in the "about" and "contact" routes or remove them, if desired.

You can either build the web app and serve it by building the provided Dockerfile or by statically building the web app and run it behind a web server like NGINX or Apache2. Alternatively, you can also update the configuration in the Web App Pages workflow and serve the web application via GitHub Pages.

On building the web app - either directly, via Docker or via GitHub Actions - make sure to set the REACT_APP_API_ROOT_URL environment variable to the URL of your backend instance.

You can also implement your own frontend, if you want. Here you can find a brief API documentation for the backend.

Build

• frontend

docker build -f Dockerfile.Webapp -t fjolsvin/photolio-webapp .

• backend

docker build -f Dockerfile.backed -t fjolsvin/photolio-backend .

• Push images

docker push fjolsvin/photolio-webapp