Skip to content

Latest commit

 

History

History
98 lines (76 loc) · 4.08 KB

README.md

File metadata and controls

98 lines (76 loc) · 4.08 KB
Raw

JavaScript 10-Day Challenge Projects

Welcome to the JavaScript 10-Day Challenge! This challenge is designed to help beginners enhance their JavaScript skills by building ten different projects over the course of ten days. Each day, you will work on a new project that focuses on various aspects of JavaScript development, gradually increasing in complexity as you progress through the challenge!😄🤟

You can check it all live here!!🔥

https://khushi2706.github.io/Javascript-projects-for-beginner/

Project List:

Day 1: Character and Words Counter

  • Description: Build a simple web application that counts the number of characters and words in a given text input.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Input field for entering text
    • Display for character count
    • Display for word count

Day 2: Speech to Text

  • Description: Develop a web application that converts spoken words into text using browser-based speech recognition.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Button to start/stop speech recognition
    • Display area to show the transcribed text

Day 3: To-Do List

  • Description: Create a to-do list application that allows users to add, remove, and mark tasks as complete.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Input field for adding new tasks
    • List to display tasks
    • Checkbox to mark tasks as complete
    • Button to delete tasks

Day 4: Quotes Generator

  • Description: Build an application that generates random quotes and displays them to the user.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Array of pre-defined quotes
    • Button to generate and display a random quote

Day 5: Menu List

  • Description: Develop a menu list application that showcases various food items with descriptions.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Display of food items with images and descriptions
    • Filter options to categorize food items (e.g., appetizers, main courses, desserts)

Day 6: Form Validation

  • Description: Implement form validation to ensure that user-submitted data meets specified criteria.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Input fields with validation rules (e.g., required fields, email format)
    • Error messages for invalid input

Day 7: Recipe

  • Description: Create a recipe application that allows users to view and search for recipes.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Display of recipes with images and instructions
    • Search functionality to filter recipes by name or ingredients

Day 8: Movie App

  • Description: Build a movie application that fetches data from an API and displays information about movies.
  • Technologies: HTML, CSS, JavaScript, API (e.g., OMDB API)
  • Features:
    • Search bar to search for movies
    • Display of movie details (title, year, plot, etc.)

Day 9: Budget App

  • Description: Develop a budget tracking application that helps users manage their expenses and incomes.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Input fields for adding expenses and incomes
    • Display of total budget, expenses, and remaining balance
    • Visualization of budget data (e.g., charts)

Day 10: Portfolio

  • Description: Create a personal portfolio website to showcase your projects and skills.
  • Technologies: HTML, CSS, JavaScript
  • Features:
    • Home page with introduction and profile picture
    • Projects section with descriptions and links
    • Contact form for inquiries

Getting Started

  • Each project folder contains the necessary files (HTML, CSS, JavaScript) to get started.
  • Open the index.html file in your web browser to view and interact with the project.
  • Follow the instructions provided in the comments of the code to implement additional features or make modifications.

Happy Coding!

Start your journey to becoming a JavaScript pro by completing these ten projects. Feel free to customize and expand upon each project to further challenge yourself and improve your skills. Good luck, and happy coding! 🚀