MIS 7375 – Homework 4
Nikki Safarova | May 8, 2026
What the Website Does
My website is a patient registration system called MediForm Medical Clinic. The form allows users to enter personal information, contact details, health visit reasons, vaccination and insurance information, and account credentials. The website performs live JavaScript validation for all required fields and provides immediate feedback when invalid data is entered. The form also includes a review section where users can verify all entered information before final submission.
For Assignment 4 requirements, I implemented multiple advanced JavaScript and browser storage features. I used the Fetch API in two different ways: first, to dynamically load the list of U.S. states from a separate JSON file, and second, to retrieve live weather data from the OpenWeather API and display it in the page header. I also added an iframe on the page that displays a custom “Daily Health Tips” section with responsive health information cards.
To satisfy the content protection requirement, I implemented both a fixed header and fixed footer so important page elements always remain visible while scrolling. For cookie usage, the website remembers the user’s first name and displays a personalized “Welcome back” message when they revisit the page. A “Start as new user” option was also implemented to clear cookies and reset the form. In addition, local storage is used to automatically save and restore non-sensitive form information so users do not lose progress when refreshing or reopening the page.
For the time-based event requirement, I implemented a live updating date and clock in the header and also added a session timeout popup. If the user stays inactive for too long, the website displays a warning countdown and automatically resets the form for security purposes.
What I Am Particularly Happy With
- Live Weather Integration: I liked integrating the OpenWeather API into the header because it made the page feel more dynamic and modern instead of looking like a static HTML form.
- Cookies + Local Storage: The combination of cookies and local storage makes the website behave more like a real patient registration system by remembering users and restoring form progress automatically.
- Session Timeout Popup: The inactivity timeout feature gives the website a more realistic medical portal feel and adds a small security element by resetting the form after inactivity.
- Real-Time Validation: Every important field validates immediately while typing, which improves usability and prevents many submission errors.
- Modern UI Design: I am happy with the cleaner medical-themed design, including the gradient section headers, weather widget, and responsive health tips cards.
What I Did Not Yet Fully Get Working
- Mobile Responsiveness: I did not fully optimize the layout for smaller mobile devices because the assignment focused more on JavaScript functionality than responsive design.
- Server-Side Processing: The project is fully client-side and does not use a backend database or server-side validation for secure patient information storage.