Skip to content

A collection of JavaScript DOM mini-projects to enhance JavaScript skills and explore DOM manipulation. Includes projects like a Todo List, Quiz App, Weather App, Calculator, QR Code Generator, Music Player, and more. Perfect for beginners and those looking to practice frontend development.

Notifications You must be signed in to change notification settings

chbappy-cse/JavaScript-DOM-mini-projects

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

JavaScript DOM Mini Projects

This repository contains a collection of JavaScript DOM-based mini-projects to help improve JavaScript skills and learn more about the Document Object Model (DOM).

Projects List

1. Social Media Website (Like Facebook)

A basic social media interface with post creation, likes, and comments using JavaScript and DOM manipulation.

2. JavaScript Weather App

Fetches real-time weather data using an API and displays temperature, humidity, and conditions.

3. Todo List

A dynamic to-do list application that allows adding, editing, and deleting tasks with local storage support.

4. Quiz App

A multiple-choice quiz application with score tracking and question randomization.

5. Random Password Generator

Generates a secure random password based on user-selected criteria (length, symbols, numbers, uppercase, lowercase).

6. Password Hide and Show

A simple toggle functionality to show or hide the password input field in forms.

7. Notes App

A simple note-taking app where users can add, edit, and delete notes with local storage functionality.

8. Age Calculator

Calculates age based on the user's date of birth input and displays it dynamically.

9. JavaScript Calculator App

A basic calculator with arithmetic operations using JavaScript.

10. Quote Generator App

Fetches and displays random motivational or inspirational quotes dynamically.

11. QR Code Generator

Generates a QR code based on user input text or URL using a QR code API.

12. Notification Toast

Displays custom toast notifications for user alerts with auto-dismiss functionality.

13. Music Player

A simple music player with play, pause, next, previous, and volume controls.

14. Stopwatch

A functional stopwatch with start, stop, and reset buttons.

15. Popup

A modal popup that displays content when triggered and can be closed by clicking outside or on the close button.

16. Form Validation

Validates user inputs in a form (e.g., email format, password strength, required fields) using JavaScript.

17. Horizontal Scrolling Slide Gallery

A smooth horizontal scrolling gallery that users can navigate using buttons or drag interactions.

18. Email Subscription

A simple email subscription form where users can enter their email to subscribe to a newsletter, with validation and local storage.

More Coming Soon...

Stay tuned for more exciting JavaScript projects!

Installation & Usage

  1. Clone the repository:
    git clone https://github.com/chbappy-cse/JavaScript-DOM-mini-projects.git
  2. Open the project folder in your code editor.
  3. Open any project .html file in a browser to see it in action.

Technologies Used

  • HTML
  • CSS
  • JavaScript (DOM Manipulation)
  • APIs (for Weather App, QR Code Generator, and Quote Generator)

Contributions

Feel free to contribute by adding new features, fixing bugs, or optimizing the existing code.

License

This project is licensed under the MIT License.

About

A collection of JavaScript DOM mini-projects to enhance JavaScript skills and explore DOM manipulation. Includes projects like a Todo List, Quiz App, Weather App, Calculator, QR Code Generator, Music Player, and more. Perfect for beginners and those looking to practice frontend development.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published