Skip to content

Skylar-Lorena/Sample-Problems-JavaScript

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

28 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Fun JavaScript Projects

Overview

This project consists of three fun JavaScript projects designed to test your knowledge in JavaScript and DOM manipulation. Each folder will contain a different implementation of a problem, and the home page will consist of pages/sections that link to each folder with a problem.

Level of Knowledge Required

  • Basic to Intermediate knowledge of JavaScript
  • Familiarity with DOM manipulation

Topics Covered

  • Accessing properties in objects
  • Working with input values in the DOM
  • Using the Date object and switch statement

Problems for the Next Three Days

Day 1: Random Quotes Generator

Problem Description: This problem involves creating a random quotes generator. When the “Generate Quote” button is pressed, it should display a new quote along with the author who said it. You'll need to access properties on an object embedded inside an Array.

Pseudo Code:

  • Create an array of objects, each representing a quote with its author.
  • Write a function to generate a random number within the array's length.
  • Use the random number to access a quote and its author from the array.
  • Update the DOM to display the random quote and author when the button is clicked.

Why This Project: This project challenges your understanding of object properties, arrays, and DOM manipulation. It's a fun way to practice accessing and displaying dynamic content on a web page.

Day 2: Message Submission

Problem Description: In this problem, you'll create a message submission form. When the “Submit” button is clicked, the inputted message should be displayed in the “Last Message Delivered” section. You need to select the input element's value from the DOM.

Pseudo Code:

  • Select the input element using JavaScript.
  • Write a function to handle the click event of the submit button.
  • Retrieve the value of the input element when the button is clicked.
  • Update the DOM to display the submitted message.

Why This Project: This project focuses on interacting with user input and updating the DOM based on user actions. It helps reinforce your knowledge of event handling and DOM manipulation.

Day 3: Day of the Week Application

Problem Description: For the final day, you'll create a day of the week application. It should display the current day of the week along with a corresponding quote. You can use the JavaScript Date object and a switch statement for this.

Pseudo Code:

  • Create an array of quotes, each associated with a specific day of the week.
  • Use the Date object to get the current day of the week.
  • Write a switch statement to match the day and display the corresponding quote.
  • Update the DOM to show the day and quote dynamically.

Why This Project: This project integrates JavaScript's Date object and conditional statements, enhancing your skills in working with date-related functionalities and decision-making in programming.


Prepared by Lorenah M. for fun JavaScript projects. Each folder contains a different implementation of the problem, and the home page consists of pages/sections linking to each folder with a problem.

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

About

This repository provides a series of interactive JavaScript projects designed to test and enhance your knowledge in core JavaScript concepts and DOM manipulation. Each project tackles a specific challenge, offering practical exercises to solidify your understanding.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors