Search Results for: JavaScript

In my Web Application Development course, I designed and built a Project Management Calculator, a web-based tool that helps users estimate key project metrics such as total tasks, expected completion time, required budget, and overall cost breakdown. I developed the application using HTML for structure, CSS and Bootstrap for responsive styling, and JavaScript/jQuery for interactive functionality and dynamic calculations. Throughout this project, I strengthened my skills in front-end development, event handling, form validation, and creating user-friendly interfaces. I also gained experience in organizing code for easy maintaining and ensuring that the application responds smoothly across different screen sizes. This project allowed me to combine technical problem-solving with simple design to deliver a functional, real-world utility.

In this final project for MIS2402 (Web App Development), we were asked to use AI to create two special-purpose calculators. A “special purpose” calculator is a web application that takes one or more inputs and generates a useful result. The first calculator was the same for all students– a loan repayment calculator. For the second one, I chose to create “The Meal Prep Macro Calculator”. It’s an online special purpose calculator that can help users to quickly plan out their daily food intake using their chosen calorie goal and percent of macros as the basis for determining grams of protein, carbohydrates and fat to be consumed in a given day. Many individuals who plan their meals or follow some form of structured diet struggle with figuring out how many grams of protein, carbohydrates and fat to consume on a daily basis. They may also struggle with dividing those totals up among all of their meals they plan to eat in a day. The calculator removes this problem. The user would just have to enter their total daily calorie needs, the amount of their total daily calories they want to be from protein, carbs, and fat, and the number of meals they will be consuming each day. After, the Meal Prep Macro Calculator will automatically compute their total daily grams of protein, carbohydrates and fat, and their grams per meal. The calculator assumes that the user will distribute these grams evenly among their meals, which makes the Meal Prep Macro Calculator useful for individuals looking for consistent and balanced portions throughout their day. Users can benefit from this calculator and would want to use it to:

• plan their daily nutrients
• support fitness and health goals
• decreases errors in calculating their nutrient intake

This project helped me to better understand writing HTML and JavaScript code and how AI can play a role in creating the web application.

For this project, I created a special-purpose web calculator that estimates the electricity cost of running a PC or any electronic device. This project was completed for MIS 2402 as part of a hands-on activity designed to help students build web applications using HTML, CSS, JavaScript, jQuery, and Bootstrap. The calculator allows users to enter a device’s power consumption in watts, daily usage hours, electricity rate, and number of days, and it automatically computes the total energy used, the monthly cost, and the estimated yearly cost. This project helped me strengthen my skills in building responsive user interactions, ensuring accurate inputs, and creating a tool with real everyday value.

For my Web Development coursework, I designed and implemented a Daily Water Intake Calculator using HTML, CSS, JavaScript, jQuery, and Bootstrap. This project involved building a fully responsive interface and creating a calculation tool that determines an individual’s recommended daily water intake based on weight and activity level. I was responsible for the full development process, including UI structure, layout design, user input validation, and implementing the calculation logic using JavaScript. Through this project, I strengthened my front-end development skills, gained hands-on experience manipulating the DOM with jQuery, and improved my ability to create user-friendly interfaces with Bootstrap. This work helped me build confidence in translating real-world requirements into functional web applications.

Built two fully functioning JavaScript based calculators, a loan repayment calculator and a daily calorie intake calculator. User friendly tools like HTML, CSS, Bootstrap and jQuery aided in the making of these calculators.

With an interactive design and being user friendly, they were able to accurately compute financial information like loan payments and manage people’s health like advising on a specific amount of calories to maintain based on your specific body composition.

Understood how to validate user input and prevent missing values through custom form error handling.

Gained confidence in using A.I tools as coding partners to generate, edit and troubleshoot functional web applications.

 

For this final project, I used an AI chat tool to help me design and build two special-purpose web calculators using HTML, CSS, JavaScript, jQuery, and Bootstrap, then deployed them on the MIS demo server. For Part 1, I followed the required AI prompt to generate a loan repayment calculator, copied the AI-generated code into my index.html file in my finalproject folder, and then debugged and refined it so it worked correctly at:

https://misdemo.temple.edu/tuq10109s/finalproject/

I made sure it calculates the monthly payment, total amount paid, and total interest for a loan, validates user input, avoids JavaScript alert() and prompt(), and displays helpful error messages and results in a clean Bootstrap layout.

 

For Part 2, I created my own unique special-purpose calculator and hosted it at:

https://misdemo.temple.edu/tuq10109s/finalproject/nbacalc/.

Instead of reusing a class example, I edited the AI prompt to build a recovery and risk assessment tool for ACL injuries. My custom calculator collects information about a person’s ACL injury and uses that input to estimate where they are in the recovery process, how appropriate their current training load is for that stage, the risk level of their knee, and suggestions on how to move forward. I again tested and adjusted the code to ensure it responds appropriately to both good and bad input and presents clear, user-friendly feedback. Overall, the project showed that I can combine my own coding skills with AI-generated code to design, deploy, and refine practical web applications.

This project was developed entirely by an AI and consists of a single-page web application featuring two distinct, interactive financial tools: a Loan Repayment Calculator and a custom Bond Price Calculator. The Loan Repayment Calculator determines the monthly payment and total interest paid for a standard loan, given the principal, term, and APR. The Bond Price Calculator computes the present value (current market price) of a bond and its market status as a premium, discount, or par bond, based on its face value, coupon rate, and current market yield. The entire application is self-contained within a single HTML file, which includes all necessary HTML for structure, CSS for custom styling, Bootstrap 5 for a responsive layout, and client-side JavaScript with jQuery to handle user input, perform all financial calculations, and dynamically update the DOM with the results.

I created a completely functional advertising website for Luxe Lashitude Lounge, a fictional cosmetic firm, as part of my Management Information Systems class. This project, which was funded by Temple University’s MIS2402 course, demonstrated my proficiency with HTML, Bootstrap, jQuery, and JavaScript in front-end web development. With this tool, customers can quickly create customized promotional offers by entering promo codes, minimum spend requirements, and unique discount amounts. Along with emphasizing service options and implementing a responsive design for mobile users, I also organized the information to resemble a professional salon setting. I gained practical experience using client-side scripting to create interactive features, designing flexible layouts, and ensuring a seamless user experience while working on this project. It also made me realize how crucial it is to design with the user in mind, which has a significant impact on maintaining brand engagement.

Our assignment for the MIS2402 PRO Points Project was to design a multi-page website for a made-up business. We had to include HTML, CSS, JavaScript, jQuery, and Bootstrap, and the website needs to have at least one interactive cost calculator

For my Project, I created a multi-page website for an imaginary business called Pixel Ice Cream. It is hybrid gaming café and ice cream shop. The website includes multiple pages (Home, About us, Menu, Gaming  info, and a calculator). It also features images, links, and business details like hours, services, and pricing.

One page contains an interactive cost estimate calculator that lets users input the number of scoops, shakes, and gaming hours, along with selecting a package type (basic, deluxe, premium). The calculator uses several pricing values based on the bundle selected and automatically determines the overall cost based on the user’s preferences. Upon clicking the “Calculate” button, the user’s total is updated. 

https://misdemo.temple.edu/tuq28418h/PROPOINT

I developed a business website called Indigo Trans, a fictional freight and transportation company, as part of my coursework for MIS 2402 at Temple University’s Fox School of Business. The website features a freight cost estimator built with HTML, CSS, JavaScript, and Bootstrap. I handled the entire project, including designing the layout, coding the interactive features, and making the site user-friendly. Through this project, I strengthened my skills in web development and front-end design. This experience helped me better understand how web technologies can support business operations and improve customer engagement.