A.R.I. - Learn JavaScript is an interactive game designed to test and improve your JavaScript skills.
Built with Next.js + TypeScript and Tailwind CSS, it features a modern interface, smooth animations, and multiple coding levels where you can write and execute real code in the browser.
- Game introduction and legend
- Level descriptions and overview
- Start button to begin a new game
- Continue button to resume progress
- Player progress is saved in Local Storage, so you can pick up where you left off
-
🧩 Level 1 — Quiz
- Single correct answer per question
- 1 attempt to answer correctly
-
✍️ Level 2 — Text Input
- Answer questions directly using a text input
- 2 attempts per question
- Correct answer shown after wrong attempt for learning
-
💻 Levels 3–5 — Coding Challenges (Monaco Editor)
- Live coding environment to write and execute JavaScript
- 3 attempts to solve each challenge
- Correct answer shown after wrong attempt to help analyze mistakes
-
📊 End-of-game statistics
- Summary of correct and incorrect answers for all levels
-
🎨 Modern UI & Animations
- Clean, responsive design
- React Lucid for vector icons
- ReactBits for animated backgrounds
- Framer Motion for UI animations
-
⚡ Fast and responsive
- Optimized for desktop and mobile
A.R.I. is designed for those who want hands-on practice rather than just reading theory.
Each level gradually increases in difficulty, from quizzes with a single attempt to live coding challenges with multiple tries.
After an incorrect answer (in Levels 2–5), the correct solution is shown, allowing players to analyze mistakes, learn, and remember the right answer.
The game tracks your progress and shows end-of-game statistics, helping you learn efficiently and stay motivated.
- Next.js + TypeScript
- Tailwind CSS
- Monaco Editor
- React Lucid (icons)
- ReactBits (animated backgrounds)
- Framer Motion (UI animations)