FlowFight

เจ้าของผลงานเล่าไว้แบบนี้

https://project-rpg-flowchart.web.app/ # FlowFight — Flowchart Battle RPG เกม RPG เพื่อการศึกษาที่ผู้เล่นสร้าง **Flowchart** เพื่อควบคุม hero ในการต่อสู้ ไม่ใช่แค่กด Attack — คุณต้องออกแบบ algorithm ด้วยกล่องลาก-วาง! **v0.28.0** | [เล่นออนไลน์](https://project-rpg-flowchart.web.app/) | สำหรับระดับ **ปวช.–ปวส.** (สอศ.) --- ## สารบัญ - [Requirements](#requirements) - [ติดตั้งและรันในเครื่อง](#ติดตั้งและรันในเครื่อง) - [ตั้งค่า Firebase](#ตั้งค่า-firebase) - [Deploy](#deploy) - [Tech Stack](#tech-stack) - [โครงสร้างโปรเจกต์](#โครงสร้างโปรเจกต์) - [เอกสารอื่น ๆ](#เอกสารอื่น-ๆ) - [Team](#team) - [License](#license) --- ## Requirements - Node.js v18+, npm v9+ - บัญชี [Firebase](https://firebase.google.com) (ฟรี Spark plan ได้) --- ## ติดตั้งและรันในเครื่อง ```bash cd flowfight npm install cp .env.example .env # ใส่ Firebase config (ดูหัวข้อถัดไป) npm run dev # http://localhost:5173 ``` --- ## ตั้งค่า Firebase ### 1. สร้าง Firebase Project 1. [Firebase Console](https://console.firebase.google.com) → **Add project** 2. **Project Settings** → **Your apps** → Web (`</>`) → คัดลอก config ### 2. เปิด Authentication **Authentication** → **Sign-in method** → เปิด **Google** และ/หรือ **Email/Password** ### 3. สร้าง Firestore Database **Firestore Database** → **Create database** → Start in test mode → Region: `asia-southeast1` ### 4. ใส่ config **4a.** copy `.firebaserc.example` → `.firebaserc` แล้วแก้ project ID **4b.** copy `.env.example` → `.env` แล้วใส่ค่าจาก Firebase Console: ```env

โดย AfdolRatchanon · ดูโพสต์ต้นทาง