Panggih Sedulur Apps
š Tech Stack
- Framework: Next.js (App Router)
- Styling: Tailwind CSS
- Form & Validation: React Hook Form + Zod
- Database: Supabase
- Language: TypeScript
šÆ Main Categories & Logic Flow
- Sports
- Arts
- Reasoning
- Nature Enthusiasts
- Social & Discipline
Questionnaire Implementation Flow:
- Biodata Submission: Users fill out a form at /kuisioner/biodata, which is persistently stored in the browser session (localStorage).
- Level 1 Questions: Users answer 5 initial questions that determine the base score for each category.
- Branching Logic: The system detects the top 2 categories from the level 1 scoring results. Then, it intelligently displays follow-up questions (levels 2 and 3) sequentially, specifically for those top categories.
- Recommendation Calculation: The best UKM recommendations are generated by combining:
- Answers from the branching logic (most specific to their interests)
- Pre-filter rules from the biodata (Religion, KIP-K, Faculty)
- Fallback scoring if the branching flow does not yield a specific recommendation.
- Data Storage: All test results and detailed UKM recommendations are recorded in the student_results table in the Supabase database.
- Result Page: Users are immediately redirected to /kuisioner/result to interactively view their recommendation results.
š Implementation Structure
- Data & Validation:
- lib/schema.ts (Data structure validation using Zod)
- lib/questions.ts (Question bank and branching logic scenarios)
- data/UkmLogic.ts (Specific recommendation algorithms per UKM)
- Interactive Components:
- BiodataForm.tsx (Handling interactive user forms)
- QuestionCard.tsx & ProgressBar.tsx (Interactive test UI)
- UkmCard.tsx (Visualizing detailed recommendation results)
- Backend & Database:
- lib/supabase.ts (Supabase client configuration and integration)
- Reliable asynchronous synchronization.
š Development Status
- ā End-to-end flow (biodata -> test -> result) is 100% functional.
- ā Interactive branching question feature runs smoothly.
- ā Data storage system is integrated real-time with the Supabase backend.
- ā Neat and localized routing under the /kuisioner prefix.
