Everyday Calculator
Use a reusable function to calculate the capacity of a Ferris wheel.
CIS166AA · JavaScript Programming · 2022
Learning JavaScript by making the browser respond.
This curated lab modernizes my original coursework into eight focused demonstrations—from functions and objects to DOM events, validation, and browser APIs.
Run the exercises// Start with a value
const curiosity = "How does this work?";
// Turn it into behavior
function practice(idea) {
return test(idea)
.debug()
.improve();
}
practice(curiosity);Course progression
From expressions to interaction.
- 01FunctionsReusable calculations and return values
- 02ObjectsProperties, methods, and computed results
- 03ConditionalsDecision-making and random outcomes
- 04Arrays & loopsStructured data and repeated operations
- 05The DOMReading and changing page content
- 06EventsResponding to user behavior
- 07ValidationChecking input and communicating errors
- 08Browser APIsUsing capabilities with user permission
Interactive coursework
Eight small ideas you can run.
Each exercise preserves the concept of the original assignment while improving its accessibility, feedback, and code structure.
Homework Snapshot
Create a classroom object and calculate its submission rate.
Number Window
Generate a value from 1–100. Values between 50 and 75 win.
Grade Translator
Loop through structured student data and convert numeric grades.
Page Auditor
Query this document to count headings, paragraphs, links, and controls.
Event Monitor
Interact with the field and watch focus, input, copy, and keyboard events.
Range Validator
Validate a number from 5–15 and return a useful inline message.
Permission-Aware Location
Request approximate browser coordinates only after the visitor chooses.
Looking back
The assignments were small. The habits became foundational.
This course taught me to break a problem into values, decisions, and visible outcomes. The original work also shows how much my approach has changed: I now favor semantic elements, modern JavaScript, inline feedback, permission-aware APIs, and interfaces that work without disruptive alerts.
The lab is not presented as advanced application architecture. It is an honest record of the fundamentals that support my next step into React and TypeScript.