dom-projects

dom-projects is an open-source web app that helps you learn frontend development faster with a hands-on practice style. It is a collection of projects that you can use to learn HTML, CSS and JavaScript

22 articles 100 View on GitHub ↗
22 articles
How to Organize and Structure a Vanilla JavaScript Project with Multiple Modules

Organize vanilla JavaScript projects with multiple modules by treating features as self-contained folders and using ES modules. Learn to build scalable and maintainable codebases.

how-to-guide
Mar 4, 2026
How to Use CSS Transforms and Transitions for Smooth Animations

Master smooth CSS animations using transform and transition properties. Learn to create GPU-accelerated visual changes and seamless state interpolations with JavaScript class toggles. Explore examples from the jisan-mia/dom-pro...

tutorial
Mar 4, 2026
How to Create a Random User Generator Using the randomuser.me API

Build a random user generator with vanilla JavaScript. Fetch user data from the randomuser.me API and dynamically display profiles on your webpage.

tutorial
Mar 4, 2026
How to Implement a Weather App with External API Integration

Learn to implement a weather app with external API integration using JavaScript Fetch API and OpenWeatherMap. Display live weather data dynamically with vanilla JS.

tutorial
Mar 4, 2026
How to Handle Keyboard Events for Keyboard-Accessible Web Apps

Learn to handle keyboard events for accessible web apps. Filter repeats, whitelist keys, and map inputs to actions for full keyboard navigation and assistive technology support.

how-to-guide
Mar 4, 2026
How to Create Responsive Navigation with Proper Event Handling in the DOM-Projects Repository

Learn to build responsive navigation with event handling in the DOM-Projects repo. Use flexbox, media queries, and classList toggle for seamless mobile adaptation.

tutorial
Mar 4, 2026
How to Implement a Quiz App with Timer and Score Tracking in Vanilla JavaScript

Learn to build a quiz app with timer and score tracking using vanilla JavaScript CSS and HTML Explore the jisan-mia/dom-projects repository for a full example.

tutorial
Mar 4, 2026
How to Convert Text to Morse Code and Vice Versa Using JavaScript: A Complete Guide

Learn to convert text to Morse code and back using JavaScript. This guide explains bidirectional mapping and lookup tables with a practical example from jisan-mia/dom-projects.

how-to-guide
Mar 4, 2026
How to Filter Array Data and Render Dynamic Content in the DOM: A Complete Guide

Master filtering array data and rendering dynamic DOM content. Learn to use Array.prototype.filter() and forEach() to build interactive web applications effectively.

tutorial
Mar 4, 2026
How to Use LocalStorage for Persistent Data Storage in Vanilla JavaScript

Learn to use localStorage for persistent data storage in vanilla JS. Store key-value pairs, serialize objects with JSONstringify and retrieve them with JSONparse for seamless data persistence.

how-to-guide
Mar 4, 2026
How to Implement a Testimonial Slider with Navigation Controls in Vanilla JavaScript

Learn to build a vanilla JavaScript testimonial slider with navigation. This guide uses HTML CSS and JS to create a dynamic slider with easy controls. Perfect for web developers.

how-to-guide
Mar 4, 2026
How to Consume REST APIs and Handle Async/Await in Vanilla JavaScript: 7 Patterns from dom-projects

Learn to consume REST APIs and handle async await in vanilla JavaScript. Explore 7 patterns from the dom-projects repository for efficient asynchronous operations and error handling.

tutorial
Mar 4, 2026

Have a question about this repo?

These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:

Share the following with your agent to get started:
curl -s "https://instagit.com/install.md"
Works with
Claude Codex Cursor VS Code OpenClaw Any MCP Client

Maintain an open-source project? Get it listed too →