Daily Character Challenge: A new character to guess every 24 hours
Progressive Hints: Unlock hints after a certain number of guesses:
- Origin (after 5 guesses)
- Devil Fruit (after 10 guesses)
- Affiliations (after 15 guesses)
Character Comparison: See how your guesses match up against the daily character with visual feedback
History Tracking: Keep track of your guesses and attempts
Responsive Design: Play on desktop or mobile with Tailwind CSS
Database: SQLite with Drizzle ORM for persistent data storage

Tech Stack

Frontend: Svelte 5 with SvelteKit
Styling: Tailwind CSS with Forms and Typography plugins
Backend: Node.js with Better Auth for authentication
Database: SQLite with Drizzle ORM
Scraping: Cheerio for web scraping One Piece data
Build: Vite with TypeScript

Getting Started

Prerequisites

Node.js (see .npmrc for engine requirements)
npm or similar package manager

Installation

npm install

Environment Variables

Create a .env file based on .env.example:

DATABASE_URL=file:local.db
ORIGIN=http://localhost:5173
BETTER_AUTH_SECRET=your-secret-here

Development

Start the development server:

npm run dev

Open http://localhost:5173 in your browser.

Database

Initialize the database:

npm run db:migrate

View the database:

npm run db:studio

Data Management

Import Character Data

Scrape and import One Piece character data:

npm run scrape
npm run db:import

Set Daily Mode Characters

Configure which characters appear in daily mode:

# Edit scripts/daily-characters.json with desired character IDs
npm run db:set-daily-mode

Project Structure

src/
├── lib/
│   ├── server/
│   │   ├── db/
│   │   │   ├── schema.ts         # Database schema
│   │   │   └── index.ts          # Database client
│   │   ├── daily-character.ts    # Daily character logic
│   │   └── auth.ts               # Authentication
│   └── assets/                    # Static assets
├── routes/
│   ├── +page.svelte              # Home page
│   ├── +page.server.ts           # Home server logic
│   ├── daily/
│   │   ├── +page.svelte          # Daily game page
│   │   ├── +page.server.ts       # Daily game server logic
│   │   └── +server.ts            # API endpoints
│   └── +layout.svelte            # App layout
scripts/
├── scrape-onepiece.ts            # Web scraper for One Piece data
├── import-json.ts                # Import scraped data to database
├── set-daily-mode.ts             # Configure daily mode characters
└── daily-characters.json         # List of daily mode character IDs
scraped-data/
├── characters.json               # Scraped character data
├── arcs.json                     # Scraped arc data
└── devil-fruits.json             # Scraped devil fruit data

Building

Create a production build:

npm run build

Preview the production build:

npm run preview

Code Quality

Linting

npm run lint

Formatting

npm run format

Type Checking

npm run check

Watch mode:

npm run check:watch

Database Schema

Main Tables

character: One Piece characters with stats (bounty, haki, devil fruit, etc.)
arc: Story arcs with chapter ranges
devilFruit: Devil fruits with types (Paramecia, Zoan, Logia)
characterHistory: Daily game attempts and wins
characterScrapeValidation: Validation data for scraped characters

See drizzle.config.ts and drizzle/0000_graceful_master_mold.sql for details.

Game Rules

You have unlimited guesses to find the daily character
Each guess shows you how close you are on various attributes:
- Green: Exact match
- Yellow: Partial match (e.g., both have Haki but different types)
- Red: No match
Attributes displayed: Character, Status, Gender, Affiliations, Haki types, Bounty, Height, Origin, Arc, Devil Fruit type
Hints unlock progressively:
- Origin: Always available
- Devil Fruit: After 5 guesses
- Affiliations: After 10 guesses

API Endpoints

POST /daily: Submit a daily game result

Contributing

Feel free to fork and submit pull requests for new features or improvements.

License

This project is for educational purposes and fan use of the One Piece franchise.