Volume 10, Issue 3, March– 2025 International Journal of Innovative Science and Research Technology

ISSN No:-2456-2165 https://doi.org/10.38124/ijisrt/25mar859

Development of a Dynamic Newspaper Cost

Calculator with Persistent Data Storage,
Responsive Design, and Excel Integration
A Comprehensive Solution for Managing Newspaper
Subscription Costs
Manasij Mandal1
1
Department of Computer Science and Engineering Berhampore, West Bengal, India

Publication Date: 2025/03/25

Abstract: This paper presents the development of a Dynamic Newspaper Cost Calculator, a web-based application
designed to calculate the monthly cost of subscribing to newspapers based on user-selected dates. The application features
a responsive design, persistent data storage using local Storage, and integration with Excel for offline data management.
The project addresses the need for a tool that allows users to track their newspaper subscription costs dynamically while
ensuring that their selections persist even after refreshing the page. The application is built using HTML, CSS,
and JavaScript, with a focus on responsiveness, usability, and data persistence. Additionally, the project includes an Excel-
based solution for users who prefer offline calculations. This paper outlines the design, implementation, and functionality
of the application, along with the challenges faced and solutions adopted during development.

Keywords: Newspaper Cost Calculator, Persistent Data Storage, Responsive Design, Excel Integration, Web Application

How to Cite: Manasij Mandal (2025). Development of a Dynamic Newspaper Cost Calculator with Persistent Data Storage,
Responsive Design, and Excel Integration. International Journal of Innovative Science and Research Technology, 10(3),
1049-1052. https://doi.org/10.38124/ijisrt/25mar859

I. INTRODUCTION II. EASE OF USE

In today’s digital age, managing subscriptions and  Selecting a Template

tracking expenses has become increasingly important. The application was designed with simplicity and
Newspapers, despite the rise of digital media, remain a usability in mind. The user interface is intuitive, allowing
popular source of information for many individuals. users to easily select dates, view calculated costs, and
However, calculating the monthly cost of newspaper manage their subscriptions. The responsive design ensures
subscriptions can be cumbersome, especially when that the application works seamlessly across different
subscriptions vary based on delivery days and pricing. To devices, providing a consistent user experience [1].
address this issue, a Dynamic Newspaper Cost
Calculator was developed. This application allows users to  Maintaining the Integrity of the Specifications
select specific dates for newspaper delivery, calculates the The application adheres to modern web development
total cost based on predefined pricing rules, and ensures that standards, ensuring compatibility with all major browsers.
user selections persist even after refreshing the page. The use of local Storage for data persistence ensures that
user selections are saved locally, eliminating the need for a
The application is designed to be responsive, ensuring backend server [2]. The Excel-based solution provides an
compatibility across various devices, including desktops, offline alternative for users who prefer traditional tools [3].
tablets, and mobile phones. It leverages localStorage to store
user data, enabling seamless data persistence without the III. PREPARE YOUR PAPER
need for a backend server. Additionally, the project includes
an Excel-based solution for users who prefer offline  Before Styling
calculations. This paper provides a detailed overview of the Before implementing the application, the requirements
application’s design, implementation, and functionality, were carefully analyzed, and the core features were defined.
highlighting its unique features and the technologies used. The application was designed to be modular, with separate
components for the calendar, cost calculation, and data

IJISRT25MAR859 www.ijisrt.com 1049

Volume 10, Issue 3, March– 2025 International Journal of Innovative Science and Research Technology
ISSN No:-2456-2165 https://doi.org/10.38124/ijisrt/25mar859
persistence. The Excel-based solution was developed in  ₹6 for other days.
parallel, ensuring compatibility with the web application [4].  The total cost for both newspapers is calculated and
displayed in real-time [13].
IV. METHODOLOGY
Data Persistence
 The Development of the Dynamic Newspaper Cost The localStorage API was used to store user selections
Calculator Followed a Structured Approach, as Outlined and calculated costs. The data is saved under a unique key
Below: for each month, ensuring that the selections for one month
do not interfere with those for another [14].
 Requirement Analysis
The first step involved understanding the user  Responsive Design
requirements and defining the core features of the The application was designed to be responsive using
application. Key requirements included: CSS media queries. The layout adjusts dynamically based
on the screen size, ensuring optimal usability on desktops,
 A dynamic calendar for date selection. tablets, and mobile devices [15].
 Cost calculation based on delivery days.
 Persistent storage of user selections.  Excel Integration
 A responsive and visually appealing design. An Excel-based solution was developed for users who
 An Excel-based solution for offline calculations [5]. prefer offline calculations. The Excel sheet includes:

 Technology Stack  A dynamic calendar for date selection.

The application was built using the following  Checkboxes for marking delivery dates.
technologies:  Formulas for calculating the total cost based on selected
dates [16].
 HTML: For structuring the web page [6].
 CSS: For styling and responsive design [7]. V. KEY FEATURES
 JavaScript: For dynamic functionality and data
persistence [8].  The Dynamic Newspaper Cost Calculator includes the
 LocalStorage: For storing user data locally in the following key features:
browser [9].
 Excel: For offline data management and cost calculation  Dynamic Calendar:
[10].
Automatically generates dates based on the selected month
 Design and Implementation and year [17].
The application was designed with a focus on Allows users to select specific dates for newspaper delivery
simplicity and usability. The implementation process [18].
involved the following steps:
 Cost Calculation:
 Dynamic Calendar
The calendar was implemented using HTML tables  Calculates the total cost based on predefined pricing
and JavaScript. The Date object in JavaScript was used to rules [19].
generate the dates dynamically based on the selected month  Displays the cost for both newspapers and the grand total
and year. The calendar includes: [20].

 A dropdown for selecting the month.  Data Persistence:

 An input field for entering the year.
 A table displaying the dates, with Sundays highlighted  Uses localStorage to store user selections and calculated
[11]. costs [10].
 Ensures that data persists even after refreshing the page
 Checkbox Functionality [17].
Each date in the calendar is represented as a table cell
(<td>). When a user clicks on a date, the cell is toggled  Responsive Design:
between checked and unchecked states. The checked dates
are stored in localStorage to ensure persistence [12].  Adapts to different screen sizes and devices [15].
 Provides a seamless user experience across platforms
 Cost Calculation [11].
The cost calculation logic is implemented in
JavaScript. The application checks whether a selected date is  User-Friendly Interface:
a Sunday and applies the appropriate pricing:
 Includes clear visual feedback for selected dates [14].
 ₹7 for Sundays.  Displays calculated costs in real-time [18].

IJISRT25MAR859 www.ijisrt.com 1050

Volume 10, Issue 3, March– 2025 International Journal of Innovative Science and Research Technology
ISSN No:-2456-2165 https://doi.org/10.38124/ijisrt/25mar859
 Excel Integration:  A responsive and visually appealing design [19].
 An Excel-based solution for offline calculations [16].
 Provides an offline solution for date selection and cost
calculation [10]. VIII. CONCLUSION
 Includes dynamic formulas for automatic cost calculation
[17]. The Dynamic Newspaper Cost Calculator is a practical
and user-friendly tool for managing newspaper
VI. CHALLENGES AND SOLUTIONS subscriptions. By leveraging modern web technologies such
as HTML, CSS, and JavaScript, the application provides a
 During the Development Process, Several Challenges seamless experience for users [20]. The use
Were Encountered and Addressed: of localStorage ensures that user data persists, while the
responsive design ensures compatibility across devices [12].
 Dynamic Date Generation The inclusion of an Excel-based solution further enhances
Generating dates dynamically based on the selected the application’s versatility [12]. This project demonstrates
month and year required careful handling of the Date object the potential of web-based applications to solve real-world
in JavaScript. The solution involved calculating the first and problems efficiently and effectively [19].
last days of the month and populating the calendar
accordingly [18]. FUTUREWORK.
 Future Enhancements to the Application Could Include:
 Data Persistence
Ensuring that user selections persist after refreshing  Backend Integration:
the page was a key requirement. The localStorage API was Storing user data on a server for cross-device
used to store the data, with a unique key for each month to synchronization [14].
avoid conflicts [15].
 Advanced Features:
 Responsive Design Allowing users to customize pricing rules [13]. Adding
Creating a responsive design that works well on all support for multiple newspapers [10].
devices required the use of CSS media queries and flexible
layouts. The application was tested on various screen sizes  Mobile App Development:
to ensure compatibility [11]. Converting the web application into a mobile app
using frameworks like React Native or Flutter [20].
 Real-Time Cost Calculation
Updating the cost in real-time as users select or  Enhanced Excel Features:
deselect dates required efficient event handling and state Adding macros for advanced automation [20].
management in JavaScript. The solution involved Integrating with cloud services for data synchronization
recalculating the cost whenever a date is toggled [9]. [20].

 Excel Integration REFERENCES

Developing an Excel-based solution required the use
of dynamic formulas and conditional formatting. The [1]. MDN Web Docs. (n.d.). LocalStorage. Retrieved
solution involved creating a calendar with checkboxes and from https://developer.mozilla.org/en-
formulas for cost calculation [14]. US/docs/Web/API/Window/localStorage .
[2]. W3Schools. (n.d.). JavaScript Date Object. Retrieved
VII. RESULTS AND DISCUSSION from https://www.w3schools.com/js/js_dates.asp.
[3]. Google Developers. (n.d.). Responsive Web Design
The Dynamic Newspaper Cost Calculator successfully Basics. Retrieved
meets the objectives outlined in this paper. The application from https://developers.google.com/web/fundamental
provides a user-friendly interface for selecting dates and s/design-and-ux/responsive .
calculating subscription costs. The use [4]. Microsoft Excel Documentation. (n.d.). Excel
of localStorage ensures that user selections persist, Formulas and Functions. Retrieved
enhancing the overall user experience [13]. The responsive from https://support.microsoft.com/en-us/excel.
design ensures that the application works seamlessly across [5]. Flanagan, D. (2011). JavaScript: The Definitive
different devices [20]. The Excel-based solution provides an Guide. O'Reilly Media.
offline alternative for users who prefer traditional tools [12]. [6]. Duckett, J. (2014). HTML and CSS: Design and
Build Websites. John Wiley & Sons .
 Key outcomes of the Project Include: [7]. Duckett, J. (2014). JavaScript and JQuery: Interactive
Front-End Web Development. John Wiley & Sons .
 A fully functional web-based application for calculating [8]. Meyer, E. (2006). CSS: The Definitive Guide.
newspaper subscription costs [16]. O'Reilly Media.
 A dynamic calendar that adapts to user inputs [9]. [9]. Freeman, A., & Robson, E. (2012). Head First HTML
 Persistent data storage using localStorage [18]. and CSS. O'Reilly Media.

IJISRT25MAR859 www.ijisrt.com 1051

Volume 10, Issue 3, March– 2025 International Journal of Innovative Science and Research Technology
ISSN No:-2456-2165 https://doi.org/10.38124/ijisrt/25mar859
[10]. Resig, J. (2006). Pro JavaScript Techniques. Apress .
[11]. Crockford, D. (2008). JavaScript: The Good Parts.
O'Reilly Media .
[12]. Zakas, N. C. (2012). Professional JavaScript for Web
Developers. Wrox .
[13]. Keith, J., & Sambells, J. (2006). DOM Scripting:
Web Design with JavaScript and the Document
Object Model. Apress .
[14]. Gustafson, A. (2008). Adaptive Web Design: Crafting
Rich Experiences with Progressive Enhancement.
New Riders .
[15]. Marcotte, E. (2011). Responsive Web Design. A
Book Apart .
[16]. Frain, B. (2012). Responsive Web Design with
HTML5 and CSS3. Packt Publishing .
[17]. Clarke, A., & Holzschlag, M. E. (2007).
Transcending CSS: The Fine Art of Web Design.
New Riders .
[18]. Keith, J. (2010). HTML5 for Web Designers. A Book
Apart .
[19]. Cederholm, D. (2010). CSS3 for Web Designers. A
Book Apart .
[20]. Keith, J., & Andrew, R. (2011). HTML5 and CSS3:
Develop with Tomorrow's Standards Today.
Pragmatic Bookshelf .

IJISRT25MAR859 www.ijisrt.com 1052