Skip to content

A collection of Vanilla JavaScript projects focused on DOM manipulation, offering hands-on experience and showcasing foundational web development techniques.

Notifications You must be signed in to change notification settings

Nanahawaw/javascript-DOM-projects

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

58 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation


Vanilla JavaScript DOM Projects 🚀

This repository is a collection of over 20 projects focusing on the Document Object Model (DOM) manipulation using pure, vanilla JavaScript. These projects are inspired by and built upon the foundational work by John Milga. Whether you're a beginner wanting to learn, or an experienced developer looking to brush up on your skills, this set of projects offers something for everyone.

📌 Table of Contents

🛠 Getting Started

To start with these projects:

  1. Clone this repository:
    git clone https://github.com/Nanahawaw/vanilla-js-dom-projects.git
  2. Navigate to the specific project you're interested in.
  3. Open the index.html file in your preferred browser.
  4. Dive into the script.js file to understand the JavaScript logic behind it.

📜 Projects List

Here are the projects you'll find in this repository:

  1. color-flipper - generates a random color code
  2. counter - every time a button is clicked, an event listener triggers a function that modifies the counter's value and updates its color.
  3. Review - Generate and display random user reviews with a simple click
  4. Navbar - solution for implementing a navbar toggle using vanilla JavaScript
  5. Sidebar - a dynamic sidebar that provides users with intuitive navigation and enhances the user experience.
  6. Modal - a stylish and interactive modal that offers a modern touch to any web application, ensuring enhanced user engagement.
  7. Questions - FAQ Interactions & DOM Traversal
  8. Menu - create an interactive menu display where items are rendered dynamically using JavaScript

Note: Each project has its own README that provides more information about the specific project and its functionality.

💡 Contributing

Contributions are always welcome! Whether it's improving the documentation, adding new features, or proposing new projects, your input is valuable. Here's how to start:

  1. Fork this repository.
  2. Create a new branch with a descriptive name.
  3. Make your changes.
  4. Push your branch and open a pull request.

For major changes, please open an issue first to discuss your proposed change.

🙌 Acknowledgments

  • A special thanks to John Milga for his original work and inspiration behind these projects.

About

A collection of Vanilla JavaScript projects focused on DOM manipulation, offering hands-on experience and showcasing foundational web development techniques.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published