Ideal City App Image
React

React

TypeScript

TypeScript

Electron.js

Electron

Vite

Vite

MongoDB

MongoDB

Ideal City

Image Gallery

This application serves as an image gallery that complements a physical exhibit. Children can draw a picture on the table, take a photo of it, and add it to the gallery.

Ideal City Exhibition

The program includes a backend created using MongoDB. Since MongoDB is not primarily intended for storing images, the program allows setting a maximum image size in MB. The program then reduces the image quality until it reaches the desired size and stores it in the database. Currently, the image size is set to 0.3 MB in WebP format, which I believe is fully sufficient.

The program also includes a hidden admin menu that allows for deleting images (e.g., in case of inappropriate content) or preserving successful images. The storage works by setting a maximum number of images the gallery will keep on the backend. If this number is exceeded, the program automatically deletes the oldest image that does not have a preservation mark.

How to Access the Admin Menu

If you look at the image below, you will see three buttons in the lower-left corner labeled with numbers. You need to press these buttons in the order 1, 2, 3. Normally, these buttons are invisible; they are now highlighted in red.

Ideal City App Image

If you manage to press the buttons in the correct order, you will reach the login screen. Here, you need to enter the admin password.

Password: test

Ideal City App Image

After entering the correct password, you will access the admin menu. Here you can delete images in the gallery or determine which images will be retained in the gallery and which will be deleted when the gallery reaches its maximum capacity.

Ideal City App Image

The application is designed for a resolution of 1920x1080 and is not responsive. The web version may have a few issues, such as incorrect font loading. The backend is read-only in this version, so you don't have to worry about your photos being stored anywhere.

The initial loading of images may take a while.