Dojo

Dependency-light mini projects for training concepts across JS, TS, and more.

A collection of self-contained projects — games, UI experiments, utilities, and algorithm implementations — for practicing modern frontend and core JavaScript. Pick a folder, read the code, run it, break it, rebuild it.

---

📋 Table of Contents

• 🎯 Projects
• 🚀 Quick Start
• 💻 Tech Stack
• 📚 Learning Path
• 🤝 Contributing
• 📝 License

---

🎯 Projects

🎮 Games

#	Project	Type	Difficulty	Status	View
1	Flappy Bird	2D Game	Intermediate	✅	→
2	Tic Tac Toe	Strategy	Beginner	✅	→
3	Snake	Classic	Intermediate	✅	→
4	Rock Paper Scissors	Casual	Beginner	✅	→
5	Guess The Word	Word Game	Intermediate	✅	→
6	Memory Cards	Puzzle	Beginner	✅	→
7	Ping Pong	Arcade	Beginner	✅	→

🎨 UI / UX

#	Project	Type	Difficulty	Status	View
1	Animated Pricing Cards	Component	Intermediate	✅	→
2	Cars Showcase	Gallery	Intermediate	✅	→
3	Gradient Color Generator	Tool	Beginner	✅	→
4	Typing Animation	Effect	Intermediate	✅	→

🔧 Utilities

#	Project	Type	Difficulty	Status	View
1	Calculator	App	Beginner	✅	→
2	Palindrome Checker	Tool	Beginner	✅	→
3	Virtual Piano	Interactive	Intermediate	✅	→
4	Smart Search Playground	Tool	Advanced	✅	→
5	State & Logic Engine	State Control	Intermediate	✅	→
6	Virtualized List Engine	DOM	Intermediate	✅	→
7	Search Query Engine	Engine	Intermediate	✅	→
8	Undo / Redo Engine	Engine	Intermediate	✅	→
9	Command Palette Engine	Engine + UI	Intermediate	✅	→
10	Local File System & Data	CLI	Intermediate	✅	→
11	Todo API	API	Beginner	✅	→
12	Password Generator	Algorithm	Beginner	✅	→
13	Reactive System	System	Intermediate	✅	→
14	Virtual DOM	Algorithm	Intermediate	✅	→
15	Event Emitter	Algorithm	Intermediate	✅	→
16	LRU Cache	Data Structure	Intermediate	✅	→
17	Sliding Window Analyzer	Algorithm	Intermediate	✅	→
18	File System Scanner	Algorithm	Intermediate	✅	→
19	Course Scheduler	Algorithm	Intermediate	✅	→
20	Priority Queue	Algorithm	Intermediate	✅	→
21	Promise Scheduler	Algorithm	Intermediate	✅	→
22	State Machine	Algorithm	Intermediate	✅	→
23	Dependency Injection Container	Algorithm	Intermediate	✅	→
24	Template Engine (AST)	Algorithm	Intermediate	✅	→
25	Advanced Template Engine (AST)	Algorithm	Advanced	⏳	—
26	Smart Search & Scroll	Algorithm	Advanced	✅	→
27	Global Message Bus	Algorithm	Advanced	✅	→
28	Form Validation Pipeline	Algorithm	Advanced	✅	→
29	Background Image Processor	Algorithm	Advanced	✅	→
30	API Response Cache	Algorithm	Advanced	✅	→
31	Unified Query Runner	Algorithm	Advanced	✅	→

⚙️ Deep JavaScript Foundations

#	Project	Concept	Difficulty	Status	View
1	Custom bind / call / apply	Polyfills	Advanced	✅	→
2	Object.create polyfill	Prototypal inheritance	Advanced	✅	→
3	Execution Order Visualizer	Event loop	Advanced	✅	→
4	Custom Lazy Evaluation	Core concepts	Advanced	✅	→

🛍 Data Structures & Algorithms

#	Project	Type	Difficulty	Description	Status	View
1	Undo / Redo Manager	Data Structure	Advanced	Command-stack history (mini-Redux style)	✅	→
2	Mini Router	Data Structure	Advanced	Path-to-component trie with nested routes	✅	→
3	Custom HashMap	Data Structure	Advanced	Map-like with any key type and bucket chaining	✅	→

Adding a project? See CONTRIBUTING.md.

---

🚀 Quick Start

git clone https://github.com/arxja/dojo.git
cd dojo
pnpm install # installs every project in the workspace at once

Then open any project. Most are plain HTML/CSS/JS and need no build step:

cd projects/Flappy-Bird

open index.html # macOS
start index.html # Windows
xdg-open index.html # Linux

Projects that use a bundler or a server (Vite, Next.js, Express, Bun) have their own README with the exact commands. Dependencies are shared at the workspace root, so installing a new project is always just pnpm install at the top.

Projects that use a bundler or a server (Vite, Next.js, Express, Bun) have their own README with the exact commands.

---

💻 Tech Stack

HTML · CSS · JavaScript · TypeScript · React · Next.js · Motion · Tailwind CSS · Vite · Express · Bun · Node.js

---

📚 Learning Path

🟢 Beginner — DOM basics, events, simple state

Tic Tac Toe · Rock Paper Scissors · Memory Cards · Calculator · Palindrome Checker · Password Generator · Todo API · Gradient Color Generator

🟡 Intermediate — games, animation, small engines

Snake · Flappy Bird · Ping Pong · Guess The Word · Virtual Piano · Typing Animation · Animated Pricing Cards · Cars Showcase · Virtual DOM · Event Emitter · LRU Cache · State Machine

🔴 Advanced — core JS internals and algorithms

Custom bind / call / apply · Prototype chain inheritance · Event loop visualizer · Template Engine (AST) · Virtualized List · Command Palette · DI Container · API Response Cache · Unified Query Runner

---

🤝 Contributing

The short version:

1. Fork, branch, add your project under projects/<name>/ with its own README.md.
2. Add an entry to the table in Projects.
3. Commit with a conventional prefix (feat:, fix:, docs:, …) and open a PR.

Full guidelines live in CONTRIBUTING.md.

---

📝 License

MIT — free to use for learning, portfolios, and personal projects.

---

Made with ❤️ by arxja

⬆ Back to top