# 👾 codebeater 👾

Codebeater is a programming language quiz game inspired by the storytelling and visual style of Undertale.
Players take on the role of an underground warrior who battles monsters through a series of programming case studies instead of traditional combat.

Each encounter presents a unique coding-related challenge answering correctly deals damage and advances the story.
The more consistently players solve these programming problems, the faster they gain points and climb the leaderboard.

Blending education with adventure, Codebeater transforms learning programming concepts into an engaging and competitive game experience.

An Undertale-inspired coding quiz where logic is your weapon ⚔️

## Contributors 👥

| Name            | NRP        | Role                    | Responsibility                         |
| --------------- | ---------- | ----------------------- | -------------------------------------- |
| **Y Marcel**    | 5803025050 | Designer Assets         | Assets, Quizzes, questions, narratives |
| **Matthew F**   | 5803025047 | PM & Frontend Developer | Documentations and UI/UX               |
| **C Bramantyo** | 5803025046 | Backend Developer       | API, DB connection, logic              |
| **Owen C**      | 5803025005 | IT Supports             | Help when needed                       |

## ⚙️ Tech Stack

**Frontend**: HTML, CSS, JavaScript

**Backend**: PHP

**Database**: MySQL

**Server**: Apache

**Containerization**: docker compose / desktop

**Tools**: phpMyAdmin, Git, readme.so, git-eng.ukwms.ac.id, notion, vscode

**Designs**: Asprite

## 📋 Core Features (MVP Scope)

- **User Authentication** Built with PHP and MySQL, allowing users to register, log in, and securely store session data.

- **Quiz Engine** Core gameplay where users answer questions pulled from the database, automatically scored and recorded.

- **Story Integration** Each question is connected to an underground warrior storyline that evolves as the player progresses.

- **Leaderboard System** Displays top player scores in real time, promoting engagement and friendly competition.

- **Profile Page** Shows user details, total score, and gameplay statistics for tracking individual progress.

- **UI/UX Basic Design** Simple pixel-art inspired layout ensuring smooth navigation and lightweight performance.

- **Database Integration** Well-structured MySQL schema for users, quizzes, and results, managed via a modular db.php connection.

- **Dockerized Environment** Fully containerized setup using Docker for consistent deployment with PHP–Apache, MySQL, and phpMyAdmin.

## 🚀Installation & Setup

#### A. Tanpa Docker 🌐

1. Pastikan sudah menginstall:

   - PHP ≥ 8.0
   - MySQL ≥ 8.0
   - Apache / XAMPP

2. Buat database:
   ```bash
   mysql -u root -p
   CREATE DATABASE quizgame;
   USE quizgame;
   SOURCE dump.sql;
   ```
3. Letakkan folder proyek di:

   - Windows (XAMPP): htdocs/quizgame

   - Linux (Apache): /var/www/html/quizgame

4. Akses di browser: http://localhost/8080

#### B. Menggunakan Docker ⛴️

1. Pastikan sudah menginstall:
   - Docker
   - Docker Compose
2. Jalankan perintah di root folder proyek:
   ```bash
    docker-compose up -d
   ```
3. Setelah semua container aktif:
   - Akses aplikasi: http://localhost:8080
   - Akses phpMyAdmin: http://localhost:8081
4. Untuk menghentikan container:
   ```bash
   docker-compose down
   ```
