VanillaVerse is an open, beginner-friendly collection of fun and educational Vanilla JavaScript projects — designed to help developers learn, experiment, and contribute safely to real projects without the overhead of frameworks.
It’s a hands-on learning space for exploring front-end fundamentals, collaborating with others, and contributing meaningfully to open source — all using just HTML, CSS, and JS.
Perfect for Hacktoberfest, first-time contributors, and anyone who wants to sharpen their web basics in a supportive community environment.
- ⚡ Pure HTML, CSS, and JavaScript – no frameworks, no build steps, just clean code.
- 🧭 Central Hub Page – browse, search, and filter through small projects in one place.
- 🧩 Project Stubs – each project starts with runnable code and clearly marked TODOs for contributors.
- 🌍 Instant Deployment Ready – easily host on GitHub Pages or any static site platform.
- 💬 Collaborative & Safe Space – encourages good coding practices and respectful contributions.
- Clone or fork the repository.
- Open the project in VS Code (or your favorite editor).
- Run a local HTTP server for testing (recommended: Live Server extension).
- Open
index.html
in your browser.
Right-click index.html
→ “Open with Live Server”
That’s it! You’ll see the VanillaVerse Hub, listing all available mini-projects.
vanillaverse/
│
├── index.html # Central hub listing all projects
├── assets/ # Shared CSS/JS for the hub
├── data/projects.json # List of project entries used by the hub
├── projects/ # Individual mini-project folders
│ └── example/
│ ├── index.html
│ └── main.js # Each includes TODOs for contributors
└── .github/ # Issue templates and deploy workflow
We welcome and encourage first-time contributors! 🧡
To get started:
-
Read the following guidelines:
CODE_OF_CONDUCT.md
CONTRIBUTING.md
-
Visit the hub page and choose a project that interests you.
-
Check the project’s
main.js
or README for TODO comments. -
Make your improvements, open a PR, and celebrate your contribution! 🎉
If you’re stuck or unsure, open a discussion or issue — we’re here to help.
Each project includes beginner-friendly TODOs, such as:
- ✨ Adding a new feature (levels, themes, sound effects, accessibility, etc.)
- 🐛 Fixing bugs (keyboard navigation, animation glitches, bounds checks)
- 🎨 Improving UX/UI (colors, layouts, interactions, or transitions)
Look for GitHub issues labeled good first issue
or help wanted
— they’re perfect for newcomers.
VanillaVerse emphasizes safe experimentation and clean coding practices:
- No external libraries or dependencies.
- No private data or risky scripts.
- Clear contribution guidelines to ensure a respectful environment for all contributors.
Our goal: make learning and contributing to open source a positive, inclusive, and safe experience.
This project is licensed under the MIT License — see LICENSE
for full details.
Built with 💛 by: