ChronoFrame: Silky photo display and management app

In the age of massive photo management and browsing, ChronoFrame offers an elegant and silky solution.
It is a modern photo display and management application that not only has a smooth interface, but also supports multiple image formats and large-size rendering, allowing photographers, designers, and bloggers to easily manage their image files.

Core features

Smart photo management

  • Easily upload and browse images through the web interface
  • Automatically extract EXIF information (time, camera parameters, geolocation, etc.)
  • Locations can be explored on the map, and reverse geocoding recognition is supported
  • Support multi-format: JPEG, PNG, HEIC/HEIF
  • Generate efficient thumbnails with ThumbHash technology that loads smoothly

Modern technology stack

  • Nuxt 4: SSR/SSG support available
  • TypeScript: Guaranteed type safety
  • TailwindCSS: Build modern interfaces quickly
  • Drizzle ORM: Strongly typed database operations

Flexible storage

  • Support for various backends such as local file system and S3
  • Configurable CDN accelerates image loading speed

Deployment method

Recommended use of Docker images:

docker run -d --name chronoframe -p 3000:3000 
 -v $(pwd)/data:/app/data --env-file .env 
 ghcr.io/hoshinosuzumi/chronoframe:latest

It is also possible to deploy with one click using Docker Compose :

services:
 chronoframe:
 image: ghcr.io/hoshinosuzumi/chronoframe:latest
 ports:
 - "3000:3000"
 volumes:
 - ./data:/app/data
 env_file:
 - .env

Usage Guide

  • Default Login Account:
     Email[email protected]
     PasswordCF1234@!
  • After logging in, go to /dashboard Upload photos
  • The system automatically generates thumbnails and labels the shooting locations

Development and Build

  • Ambient :Node.js 18+, PNPM 9+
  • Development Commands:pnpm install pnpm dev
  • Production build:pnpm build pnpm preview

The project has a clear structure and is divided into app/modules such as ,server/packages/ , , and can be easily expanded by developers.

Open source and contribution

  • Pull requests are welcome
  • Follow the TypeScript + ESLint + Prettier specification
  • License: MIT
  • Author: Timothy Yin (HoshinoSuzumi).

Official website: bh8.ga
Show gallery: lens.bh8.ga

Github:https://github.com/HoshinoSuzumi/chronoframe/

Tubing:

Scroll to Top