About • Features • Tiers • Installation • Architecture Diagram
As a venue organizer, I wanted to create an app so people could post some pictures of them during the event and expose them to a central screen. Then give them the ability to download the picture. I wanted to make it open source so people could use it for their own events.
- Dynamic QR code generation
- Email sending
- Image moderation through IA
- Picture coverflow style
- Picture download (single or bulk)
- Picture upload
- PIN for easy access on external screen
- Internationalization
This project uses free Saas products to run:
- Backend API: Vercel
- Deployment: Vercel
- Email sender: Resend
- Image moderation: Sighengine
- Image optimization: Vercel
- Image storage: Cloudinary
- Mysql Database: Turso
- Redis Database: Upstash
- Make sure that you have nodeJS installed on your machine.
- Install the dependencies by running
npm install
. - Fill environment variables in a
.env.local
file at the root of the project. You can find the list of environment variables in the.env.local.example
file. - Run the development server by running
npm run dev
. - (optionnal ) If you want to preview the email template, go to
./component/react-email
, typenpm i
thennpm run dev
.
sequenceDiagram
User->>+Flybooth: generate a flybooth
par
Flybooth->>+Redis: create a short link
and
Flybooth->>+Flybooth: generate a QR code
end
User->>+Flybooth: add a picture
Flybooth->>+Cloudinary: upload the picture
Flybooth->>+Sightengine: moderation check
alt comport nudity
Sightengine->>Cloudinary: Delete image
end
User->>+Flybooth: add a message
Flybooth->>+Mysql: insert the message
User->>+Flybooth: access to gallery
Flybooth->>+Cloudinary: access to folder based on uuid
Cloudinary->>+Flybooth: list of pictures
User->>+Cloudinary: download a single picture
Cloudinary->>+User: give picture link
User->>+Flybooth: download multi picture
Flybooth->>+Cloudinary: generate an archive link
Cloudinary->>+User: give archive link
sequenceDiagram
User->>+Flybooth: join a flybooth
Flybooth->>+Redis: ask for the full uuid
Redis->>+Flybooth: give back the full uuid
Flybooth->>+User: redirect to the coverflow page
sequenceDiagram
Upstash->>+Flybooth: fetch delete-images endpoint
Flybooth->>+Cloudinary: delete all images older than 7 days