Riley Meyers 9/10/25

Car Inventory Management

A web application for managing car inventory with efficiency ratings and age calculations. Built with HTML, CSS, JavaScript, and Node.js.

The application uses Flexbox for layout and demonstrates element, ID, and class selectors in CSS.

Technical Achievements

• Single Page Application: Implemented a SPA that updates the UI without page refresh
• Edit Functionality: Added the ability to modify existing car data
• Server-side Derived Fields: Added efficiency rating and age calculations on the server

Design Achievements

• User Testing: Conducted with two classmates
  • Classmate 1: Joe
    • Problems: Initially confused about if efficiency only related to MPG.
    • Comments: Suggested color-coding efficiency ratings.
    • Changes: Would add explanation for efficiency.
  • Classmate 2: Mike
    • Problems: None just very clear and basic.
    • Comments: Wanted to be able to sort the table by different columns.
    • Changes: Would add sorting/filtering.

Instructions to Use

1. Fill in the form with car details (model, year, MPG)
2. Click "Add Car" to add the car to the inventory
3. To edit a car, click the "Edit" button next to the car
4. To delete a car, click the "Delete" button next to the car

Deployment

This application is deployed on Render at: https://a2-rileymeyers.onrender.com