Dr. A. Q.
Khan Institute of Computer Sciences and Information
Technology Kahuta
BSCS-VI Web Design and Development Spring-2025
Instructor: Zafar Iqbal Khan ASSIGNMENT-2
Topics: JavaScript MS Power Point Total Marks: 20
Distribution Date: 01/05/2025
CLO-2, PLO-2 Due Date: 08/05/2025
*************************************************************************
Q. #.1: Case Study 1: Interactive Weather Dashboard Using JavaScript
A local startup needed a web-based weather dashboard to help users check real-time weather
conditions for different cities. The solution was developed using JavaScript along with the
OpenWeatherMap API. JavaScript was used to send API requests, parse the JSON responses, and
dynamically update the DOM with current temperature, humidity, and weather icons. The
interface included a search bar, recent search history, and responsive design for mobile devices.
This project demonstrated how JavaScript enables asynchronous data fetching and user
interaction, making it an essential language for creating real-time applications.
Q. #.2: Case Study 2: Online Quiz Application with Timed Questions
An educational institution wanted a web-based quiz system that could test students' knowledge
with a time limit per question. JavaScript was used to implement the logic for loading questions,
validating answers, and keeping track of the score. A countdown timer was implemented for each
question using setInterval(), and DOM manipulation allowed instant feedback without refreshing
the page. After the quiz ended, the total score and correct answers were displayed. This project
showcased JavaScript’s capability to manage application state, time-sensitive functions, and
dynamic UI updates.
Q. #.3: Case Study 2: Case Study 3: To-Do List with Local Storage
A productivity tool was designed for employees to manage their daily tasks. The project was built
using HTML, CSS, and JavaScript. JavaScript handled all the interactive functionality, including
adding new tasks, marking them as complete, editing, and deleting. The application used the
localStorage API to save tasks so they would persist even after the page was refreshed. This
demonstrated how JavaScript can be used for client-side data storage and simple state
management, making it suitable for lightweight task management applications without requiring a
server backend.
Q. #.4: Case Study 4: E-Commerce Shopping Cart
A small online retailer required a simple shopping cart system for their static website. JavaScript
was used to manage the cart logic: users could add products, adjust quantities, remove items, and
see a live update of the total cost. The cart state was stored in an array of objects and persisted
using localStorage. The EventListener and DOM manipulation techniques allowed the cart to
update dynamically as users interacted with it. This case study highlighted JavaScript’s role in
enhancing user experience and functionality in front-end web development.
GOOD LUCK