Web Development Test #1
Marks: 20
Question 1: Build a Multi-Page Web Application
(12 Marks Total)
You are tasked with building a mini web application with two pages using Node.js, HTML, CSS,
and JavaScript. Instructions are broken into smaller parts:
Part A: Set Up the Server (6 Marks)
Create a Node.js app that sets up a basic web server running on localhost:3000.
Configure two routes:
1. / --> Display the homepage.
2. /about --> Display the about page.
Ensure an appropriate response is sent for any invalid route (404 Page Not
Found message).
Question 2: Interactive Counter Application
(8 Marks Total)
Create a simple Counter Application using HTML, CSS, and JavaScript. The app lets the user
increase, decrease, or reset a counter.
Part A: Create the Layout (2 Marks)
Build an HTML layout for the counter app. Include:
1. A heading for the app title (e.g., "Counter App").
2. A counter display (<p> tag) to show the current count (start from 0).
3. Three buttons labeled Increase, Decrease, and Reset.
Part B: Add Styling with CSS (2 Marks)
Use CSS to style the counter app. Include:
1. A centered layout (use Flexbox or Grid).
2. Styled buttons (rounded corners and hover effects).
3. A unique color scheme.
Part C: Add JavaScript for Functionality (4 Marks)
Write JavaScript to make the buttons functional:
1. Clicking Increase increments the counter by 1.
2. Clicking Decrease decrements the counter by 1 (minimum value: 0).
3. Clicking Reset sets the counter back to 0.
Ensure that the counter value updates dynamically on-screen as the user interacts with
the buttons.