• Persistent
  • Enthusiastic
  • Solution
  • Patient
  • Attentive
Please Wait
2022Programming
JavaScript SmallProjects
JavaScript is a high-level programming language that is commonly used for web development. It allows developers to add interactivity, dynamic content, and behaviour to websites.
01

Project Challenge


Objective

Since JavaScript is a popular programming language used for web development, I wanted to experiment with special effects, adding dynamic behavior. I decided to focus on the small functions that make up a website, such as fields, buttons, navigation bars, and scroll effects.


02

Design Approach


Objective

I made the decision to create small projects that are geared towards interaction. As Javascript was predominately used for user validation, I began creating a basic form. I added listeners to validate the name, postcode entry, and the phone entry. To avoid an invalid result, I used expressions to make sure that the data entered matches the same value.


03

Continued


Objective

The next login screen, I implemented animation. When the user highlights each field, an animation becomes active that has a small effect on the email and password fields. I created a div tag named form-control and named it as form-control. This meant that I could use the querySelector, which selects elements from the document object model (DOM) using the CSS selector syntax. I proceeded to add functionality to FAQ boxes and a background slider.


The Drink Water project was created to motivate users to drink more water. Each serving represents 250 ml. When the user reaches 3 litres, the jug fills up to complete. The sound board project generates a sound according to the button selected by the user. Incremental calculator is a feature that I notice on many web pages. This is the reason why I wanted to produce it.


Next Project
DOM Projects