Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/VasquezRivero92/HabboCafe/llms.txt

Use this file to discover all available pages before exploring further.

This guide walks you from a fresh machine to a fully working local instance of HADOS, including a configured Firebase backend and your first Dado (tournament group).
1

Clone the repository and install dependencies

HADOS uses Vite as its build tool and Node.js for the static production server. Clone the repository and install all JavaScript dependencies with npm.
git clone https://github.com/VasquezRivero92/HabboCafe.git
cd HabboCafe
npm install
After installation you will have all production and development dependencies available, including React 19, Firebase SDK 12, and Lucide React icons.
Node.js 18 or later is required. The project uses ES modules ("type": "module" in package.json), so avoid Node versions older than 16.
2

Create a Firebase project

HADOS relies on Firebase Authentication and Firestore. You need a free Firebase project before you can run the app.
  1. Go to console.firebase.google.com and click Add project.
  2. Give your project a name (e.g. habbocafe-local) and complete the setup wizard.
  3. In the left sidebar, open Build → Firestore Database and click Create database. Choose Start in production mode and pick a region close to your users.
  4. In the left sidebar, open Build → Authentication and click Get started. Under the Sign-in method tab, enable the Email/Password provider.
HADOS uses Email/Password authentication exclusively. If you skip enabling this provider you will see the error auth/operation-not-allowed when any user tries to register.
3

Configure src/firebase.ts

Back in the Firebase Console, go to Project settings (the gear icon) and scroll down to Your apps. If no web app exists yet, click the Web icon (</>) to register one. Firebase will display a config object — copy the values into src/firebase.ts.The file is already structured correctly; you only need to replace the placeholder values:
src/firebase.ts
import { initializeApp } from 'firebase/app';
import { getFirestore } from 'firebase/firestore';
import { getAuth } from 'firebase/auth';

const firebaseConfig = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_PROJECT_ID.firebaseapp.com",
  projectId: "YOUR_PROJECT_ID",
  storageBucket: "YOUR_PROJECT_ID.firebasestorage.app",
  messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
  appId: "YOUR_APP_ID",
  measurementId: "YOUR_MEASUREMENT_ID"
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
export const db = getFirestore(app);
export const auth = getAuth(app);
The measurementId field is optional and only used if you enable Google Analytics for your Firebase project. If you did not set up Analytics, you can safely omit it or leave it as an empty string.
All seven config fields (apiKey, authDomain, projectId, storageBucket, messagingSenderId, appId, measurementId) are sourced directly from your Firebase project’s web app settings — never commit real values to a public repository.
4

Start the development server

With Firebase configured, start the Vite development server:
npm run dev
Vite will print a local URL (typically http://localhost:5173). Open it in your browser and you will see the HADOS login screen.
VITE v8.x.x  ready in Xms

  ➜  Local:   http://localhost:5173/
  ➜  Network: http://192.168.x.x:5173/
The login page shows the HADOS TORNEOS logo and two form modes: Iniciar Sesión (Login) and Regístrate aquí (Register). No accounts exist yet in your fresh Firestore, so the next step is to create the Global Admin account.
5

Register as Global Admin

The Global Admin is the platform owner and is the only role that can create new Dados. To register with this elevated role you need the secret platform code.
  1. On the login screen, click Regístrate aquí to switch to the registration form.
  2. Check the Registrar como Administrador Global checkbox that appears at the top of the form.
  3. Fill in an email address and a password (minimum 6 characters).
  4. In the Código Secreto Global field that appears, enter the secret code:
GLOBAL2026
  1. Click Registrarse. HADOS will create a Firebase Auth user and a matching Firestore document in the users collection with role: "global_admin".
The secret code GLOBAL2026 is hardcoded in src/App.tsx. In a production deployment you should treat this value as a credential and avoid exposing it in public source code. Change it before deploying to a shared environment.
After successful registration, click Inicia sesión and sign in with your new credentials. You will land on the main dashboard with the Panel Global tab visible in the navigation.
6

Create your first Dado

With a Global Admin session active, navigate to the Panel Global tab in the top navigation bar.
  1. In the Crear Nuevo Ambiente (Dado) section, type a name for your first tournament group in the Nombre del Dado field (e.g. Dado Principal).
  2. Click Generar Dado.
HADOS will write a new document to the dados Firestore collection. The Dado immediately appears in the Listado de Dados table below.From this table you can also assign a Dado Admin by selecting any registered user from the dropdown next to the Dado row. Once assigned, that user gains access to the Panel Dado tab where they can configure rules, schedules, prize amounts, and start tournament cycles.
To add players to your new Dado, switch to it in the navbar dropdown, open the Torneo activo tab, and click Crear Usuario. Enter the player’s Habbo username and their avatar will be fetched automatically from habbo.es.

Available Scripts

ScriptCommandDescription
Development servernpm run devStarts Vite HMR dev server on localhost:5173
Production buildnpm run buildRuns TypeScript compiler then Vite bundler into dist/
Production previewnpm run previewServes the dist/ folder with Vite’s built-in preview server
Lintnpm run lintRuns oxlint across the source files

Production Serving

For production deployments, the repository includes server.js — a plain Node.js HTTP server that serves the dist/ folder and falls back to index.html for any unmatched route (SPA fallback routing).
npm run build
node server.js
The server reads the PORT or SERVER_PORT environment variables, defaulting to 8080 if neither is set.

Build docs developers (and LLMs) love