Voluptek

All your media. One collection.

Voluptek is an invite-only social media platform for tracking, organizing, and sharing media across video games, books, music, movies, and TV shows.

The goal of the project is simple: bring the experience of rating, collecting, and discussing media into one connected place instead of scattering it across multiple specialized platforms.

Why Voluptek?

Most media platforms focus on only one category. You might track books in one place, music in another, games somewhere else, and movies on yet another site.

Voluptek is built to solve that fragmentation by giving users a single app where they can:

• discover media from multiple trusted databases
• build personal collections and lists
• rate and comment on items
• keep track of what they want to watch, read, listen to, or play
• connect with other users around shared tastes

Current Status

Voluptek is currently in Alpha 1.

At this stage, the app includes:

• invite-only onboarding
• registration request flow
• admin approval flow
• email-based account completion
• Firebase authentication
• media search across multiple external databases
• dedicated detail pages for supported media types

This alpha focuses on laying down the core architecture before the more social and community-driven features are added.

Features

Already implemented

• Firebase integration
• Authentication and account creation flow
• Invite-based registration
• Search across external databases
• Detail pages for media items
• React + TypeScript SPA architecture
• Tailwind-based UI
• Bilingual groundwork with i18n support

Planned

• rating system
• comments on items
• activity feed
• media collections
• custom list system
• editable user profiles
• password reset and authentication improvements
• user-submitted or translated descriptions
• user-submitted media entries

Data Sources

Voluptek currently relies on four main databases:

• IGDB for video games
• Discogs for music
• Open Library for books
• TMDB for movies and TV series

These services provide the metadata and media details that power the explore and detail pages.

Tech Stack

Frontend

• Vite 8
• React
• TypeScript
• Tailwind CSS
• React Router
• react-i18next

Backend

• Firebase
  • Authentication
  • Firestore
  • Cloud Functions
  • Hosting

Other tools

• Nodemailer for invite emails
• external media APIs and databases
• Tailwind via the PostCSS workaround for Vite 8 compatibility

Architecture Overview

Voluptek is split into two main parts:

Client app

The frontend is a Vite + React single-page app responsible for:

• routing
• internationalized UI
• authentication state
• explore/search experience
• media detail pages
• account-related pages

Firebase backend

Firebase handles the backend workflows, including:

• authentication
• Cloud Functions
• registration request approval
• invite token generation
• email sending
• external database proxy calls
• Firestore persistence

Getting Started

This project uses a frontend app at the repository root and Firebase Functions in a separate functions/ workspace.

1. Clone the repository

git clone <your-repo-url>
cd voluptek

2. Install dependencies

At the root:

npm install

In the functions directory:

cd functions
npm install
cd ..

3. Configure environment variables

Create the environment files required by the frontend and Firebase Functions.

You will need configuration for things such as:

• Firebase client config
• Firebase project selection
• external API credentials
• app base URL
• admin email allowlist
• SMTP credentials for invite emails

Typical backend values include:

• APP_BASE_URL
• ADMIN_EMAILS
• SMTP_HOST
• SMTP_PORT
• SMTP_USER
• SMTP_PASS
• MAIL_FROM
• INVITE_TTL_HOURS

Use your local or deployed app URL for APP_BASE_URL depending on the environment you are running.

4. Start the Frontend

npm run dev

5. Start Firebase emulators (optional, recommended for local backend testing)

firebase emulators:start

Or, for functions only:

cd functions
npm run serve

Project Structure

voluptek/
├── src/                # React app source
│   ├── components/     # Reusable UI components
│   ├── pages/          # Route-level pages
│   ├── lib/            # API helpers, Firebase helpers, utilities
│   ├── i18n/           # Translation setup and locale files
│   └── ...
├── functions/          # Firebase Cloud Functions
│   ├── src/
│   │   ├── registration.ts
│   │   ├── externalDb.ts
│   │   └── index.ts
│   └── ...
├── public/             # Static assets
└── ...

Invite-Only Registration Flow

Voluptek currently uses an invite-only onboarding system.

The flow works like this:

1. A user submits a registration request.
2. An admin reviews the request.
3. If approved, a one-time invite link is emailed to the user.
4. The user completes account creation using that link.
5. A Firebase Auth user and profile document are created.

This approach keeps the early alpha controlled while the platform is still being actively built and tested.

Development Notes

One of the biggest technical changes in the project was migrating from Astro to a Vite 8 SPA.

The original version ran into friction with Firebase hosting and database-driven pages. Moving to Vite 8 made the app a better fit for dynamic routing, authentication, and client-side interaction, even though it introduced extra migration work around translations, routing, and page conversion.

Because Tailwind does not yet fully support the latest Vite 8 workflow in the same way as older setups, the project currently uses the PostCSS Tailwind setup as a workaround.

Roadmap

• user ratings
• comment threads
• activity feed
• collection pages
• custom list builder
• richer profiles
• account settings
• submission and moderation tools
• multilingual description improvements
• broader social features

Philosophy

Voluptek is not just a database browser.

It is meant to become a place where people can celebrate the stories, sounds, and worlds that bring them joy, while keeping their media life organized in one open, connected platform.

Author

Built by Gab Savard.

License

This project is currently under active development. Add a license here when you are ready to define reuse terms.