Aitcs: Muhammed Hazim Abhar Mohamed Azahar, Norhanim Selamat
Aitcs: Muhammed Hazim Abhar Mohamed Azahar, Norhanim Selamat
Aitcs: Muhammed Hazim Abhar Mohamed Azahar, Norhanim Selamat
4 (2023) 1577-1596
© Universiti Tun Hussein Onn Malaysia Publisher’s Office
AITCS
Homepage: http://publisher.uthm.edu.my/periodicals/index.php/aitcs
e-ISSN :2773-5141
DOI: https://doi.org/10.30880/aitcs.2023.04.02.089
Received 23 June 2023; Accepted 10 November 2023; Available online 30 November 2023
Abstract; Grocery stores play an important role in the community by providing goods
and services that people need every day. Acting as intermediaries between
wholesalers and customers, grocery stores facilitate the exchange of goods. Effective
management is essential to the store's success, as it can help create a positive work
environment, improve employee morale, and increase customer satisfaction.
Therefore, a grocery store management system was developed for Azzain Grocery
Store business. This system aims to streamline various business activities, including
inventory management, sales transaction management, and the generation of daily
sales reports. All management activities will be conducted digitally, utilizing a web-
based approach. The grocery store management system utilized Vue.js for the user
interface and Node.js for the backend. An iterative model was adopted, enabling
continuous development and improvement. The system's implementation is expected
to alleviate the burden on employees and managers, promoting smoother business
management. Future work focuses on integrating customer loyalty programs,
advanced data analytics for inventory forecasting, and support for online ordering and
delivery services.
1. Introduction
A grocery store is a shop that sells a variety of small items [1]. Grocery store businesses are common
among businessmen in Malaysia due to their simplicity and ease. Managing the vast amount of data and
records associated with the diverse range of goods sold in grocery stores is crucial for ensuring smooth
operations. Implementing technology, such as computerized systems, is necessary to alleviate the
workload on employees. Utilizing a computerized system offers numerous benefits for grocery store
businesses.
An effective business management system is the core of any business. It must be optimally managed
to ensure seamless daily operations. Kedai Runcit Azzain has already implemented a computerized
system for inventory management, allowing employees to record various aspects related to the store's
inventory, including the quantity of stock items.
[email protected]
2023 UTHM Publisher. All rights reserved.
publisher.uthm.edu.my/periodicals/index.php/aitcs
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
However, the existing system has encountered several recurring issues. One common problem is
inconsistent data, where items that are still in stock are mistakenly indicated as out of stock in the
system. Therefore, this study proposes the development of a system titled "Azzain Grocery Store
Management System".
Several objectives have been identified to ensure the effective functioning of the system. The
primary objective is to develop the "Azzain Grocery Store Management System," which aims to update
and improve the existing system by addressing the identified problems. The system will be designed
using an object-oriented approach, considering the specific needs of Azzain grocery stores. Utilizing
digital technology, the developed system will streamline various business management activities.
This article is divided into five parts. The first part provides an overview of the project's context.
The second part discusses the analysis of related works. The third section describes the process of
system development, including analysis and design. The fourth section addresses the system
implementation and testing methods used to validate the designed system. Finally, the fifth section
presents the conclusion of the article.
2. Related Work
This section describes the literature review carried out in the project. Several similar systems were
also studied and compared with the system proposed in the project.
2.1 Inventory Management
Typically, grocery stores sell a variety of everyday commodities, including uncooked dry foods such as
rice and wheat. Compared to wholesale markets or stores, grocery stores are smaller in size. Grocery
stores are often found in every town and housing estate to make shopping convenient for locals. The
retailer serves as the final link in the supply chain between the manufacturer and the customer [2].
The inventory management system is a business's most valuable asset. Customers may feel
dissatisfied if the goods they need are unavailable. Inventory refers to all the commodities, goods, and
supplies held by a company with the expectation of selling them and making a profit. Managing
inventory is an important component of any business. However, maintaining a large inventory comes
with its own risks, including storage costs, potential damage to goods, and the possibility of theft. To
mitigate these risks, accurate inventory management practices need to be implemented. Regularly
recording stock quantities can help prevent stock errors and other issues [3].
To ensure sufficient inventory and meet customer demands or address stock shortages, the
inventory management model identifies patterns and responds to them. Two types of inventory models
are commonly used: Re-Order Point (ROP) and Economic Order Quantity (EOQ). In inventory
management, ROP establishes a specific level at which stock should be replenished. Placing an order
when there is still ample stock on hand can lead to stock dumping and increased holding costs [4].
Conversely, if an order is placed when there is no stock on hand, sales cannot be made in the store until
the order is received. On the other hand, EOQ determines the appropriate stock order size for each
product that the company needs to purchase [5]. While ROP addresses the question of "When to Buy?",
EOQ handles the question of how much stock to buy.
2.2 The Technology Used
The storage, processing and transmission of information are all performed using digital equipment and
computers, collectively referred to as 'digital technology.' One branch of digital technology is web-
based technology. Web-based systems are networked applications accessible through the internet,
enabling individuals to connect with each other [6]. The three core languages used to build Azzain's
Grocery Store Management System on the World Wide Web (WWW) are HTML, CSS, and JavaScript.
1578
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
Barcodes and barcode scanners are also integral to the system being developed. A barcode is a
technological tool for visually representing data in a format that computers can understand. A one-
dimensional (1D) barcode consists of a series of unique numbers encoded using alternating black and
white bars. It is crucial to insert the correct barcode into the packaging following established standards
to ensure accurate barcode scanning by the barcode scanner [7].
An optical scanner, commonly known as a barcode scanner, can read a printed barcode and transmit
the decoded data to a computer. Barcode scanners work by emitting a laser beam across the barcode
and analyzing the quantity and pattern of reflections. The black bars on a barcode reflect less light than
the white spaces between them [8].
2.3 A Study of Equivalent Systems
This section describes the study of equivalent systems. The first system is Sistem Inventori Kedai Runcit
Rafeek Store [9]. This system manages inventory data in the store and helps streamline the daily sales
process. The second system is Sistem Pengurusan Inventori Atas Talian Kedai Bundle [10]. The main
purpose of developing Sistem Pengurusan Inventori Atas Talian Di Kedai Bundle is to record goods
and important business documents. Prior to the existence of this inventory management system, Amin's
bundle store relied on manual methods to store all business records and documents. The third system is
Sistem Retail LIMA POS [11]. LIMA POS is a company that sells software for point-of-sale systems.
This company offers various POS systems, including the Retail System and the Food and Beverage
System. For the purpose of this study, the Retail System has been selected for examination and
comparison with the proposed system.
Comparison between the existing system and the proposed system. All the main characteristics were
compared and listed in Table 1.
Table 1: Comparison between existing equivalent systems with system to be developed.
1579
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
Based on the comparison table provided, all systems utilize web-based technology. Sistem Inventori
Kedai Runcit Rafeek Store lacks barcode search functionality, whereas the proposed system includes
it. The proposed system offers advantages such as sales transaction management and daily sales
calculation when compared to Sistem Pengurusan Inventori Atas Talian Kedai Bundle. Additionally,
the proposed system distinguishes itself from Sistem Retail LIMA POS with its user registration, login
feature, and sales revenue calculation. The Azzain grocery store management system offers more
compelling features in comparison to the other systems. Overall, the Azzain grocery store management
system provides comprehensive and user-friendly features for inventory management and sales
processes.
3. Methodology
This section describes all the necessary information about the methodology used to obtain the
results of the project.
3.1 Iterative Model
The Iterative Model shown in Figure 1 breaks down and divides the entire project process into several
versions and series by following the order of importance of user requirements on the system to be
developed. This means that the most important user requirements will be gathered in the first version
and built on that version. With the aim of obtaining additional information related to user needs, when
each version is implemented, the system will be given to relevant users and users will provide feedback
and comments on the system. The information provided by the user will be collected, analyzed and used
for improvements in the next version of the system. Evolution of the system occurs at each iteration
providing improvements to the system. The process of analysis, design and implementation will be
repeated on each version until the developed system is fully completed and meets all user needs.
1580
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
Project planning is important to create a harmonious atmosphere during project development and
obtain management approval to proceed to the next phase. Project planning management is as in Table
2. Two versions of the system have been provided for this project.
Table 2: Project planning schedule and tasks
1581
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
1582
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
1583
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
2. Operational The system must be used in a web browser. The system supports all modern
web browsers except Internet Explorer.
This system can be accessed by all devices, even if the devices have different
display sizes.
3. Security Users must log in first to access the system. The system requires an
identification card number and password for login. This login module prevents
unauthorized access to the system.
To ensure the system's security, passwords must be longer than eight characters
and include at least one uppercase letter and one lowercase letter.
Each user in the system has a specific role with a different interface. Users can
only access the interface associated with their role and cannot access interfaces
of other roles.
4. Integrity Data in the database will be stored correctly and securely. The database will
also be protected from unauthorized access.
Passwords stored in the database will be encrypted to prevent unauthorized
access.
5. Usability Easy to learn, new users and those familiar with similar systems find this
system easy to learn and master.
Competence in task execution, the system must efficiently perform tasks and
processes to provide user satisfaction.
Easy to remember process steps, for frequent users, every step of using this
system should be easy to recall.
Users must understand the system's achievements.
Users must feel satisfied with the system.
1584
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
1585
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
One of the most helpful forms of diagrams in UML is the class diagram, which accurately
represents the structure of a system by modeling its classes, properties, operations, and connections
between objects. A class diagram must be constructed to define the properties and functions used in the
system to be developed. In Figure 3, seven classes are identified: Manager, Worker, User, Sale, Report,
ListItem, and Item. Each class has its own characteristics and operations.
1586
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
The Azzain grocery store management system is developed using a multi-tier architecture. This
architecture arranges software components into levels (layers) to provide specific functions. The overall
system architecture is divided into several parts in this approach, with the database server being separate
from the system server. The three-tier system is commonly used in the multi-tier architecture, consisting
of the data management level, application level, and customer level.
The database is intended to store and manage the system's data. The database structure, which
outlines the entities that store the various data in the database, is displayed.
i. user(idAccount, password, icNumber, role, createdAt, updateAt)
ii. manager(idManager, name, address, phoneNumber, gender, email, createdAt, updaeAt,
idAccount)
iii. worker(idWorker, name, address, phoneNumber, gender, email, createdAt, updaeAt,
idAccount)
iv. item(idItem, name, category, price, barcode, weight, unit, quantity, image, createdAt,
updateAt)
v. listItem(idListItem, quantity, totalPrice, createdAt, updateAt, idItem, idSale)
vi. sale(idSale, price, paymentMethod, createdAt, updateAt, idAccount, idReport)
vii. report(idReport, numberSale, saleRevenue, filePath, fileName, createdAt, updateAt)
4. Results and Discussion
4.1 Implementation
The development of the Azzain grocery store management system uses three programming languages,
HyperText Markup Language (HTML), Cascading Style Sheets (CSS), and JavaScript. It is divided into
two parts, front-end development and back-end development. For the front-end development, this
system uses the Vue.js framework combined with Tailwind CSS to create the graphical user interfaces.
For the backend, the system uses Node.js within the Express.js framework, enabling JavaScript to be
used as a back-end language. The main interfaces and their coding segments are shown and discussed
in this subtopic.
When a new employee starts work, managers need to register their information in the employee
record. By building this new register module, managers no longer need to keep physical records of
employees, which consume space. Data related to employees can now be stored in the database,
ensuring better security for the data. Figures 5 and 6 show the interface and code segment of the new
register module.
1587
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
The login for this system has two important components: the input of the identification card number
and the input of the password. Users need to enter both of these pieces of information before gaining
access to the system. If any of this information is incorrect or not entered correctly, the system will not
grant access to the user. Figure 7 and Figure 8 show the interface and code segment for the login module.
The employee information entered into the system can also be modified using the employee
information management module. If an employee has stopped working at the grocery store, the manager
can also delete the employee's data from this system. Figure 9 shows the interface for the module that
manages employee information.
1588
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
There are four main activities in inventory management at Azzain grocery stores. The first activity
is registering the product into the system. The second activity is increasing the stock of goods. The next
activity is deleting records of products that are not available in the store. Finally, there is updating
product information. Figure 10 shows the interface of the inventory management module.
The products in the grocery store are divided into eight categories: Cans, Soap, Drinks, Spices,
Bread, Sauces and Soy Sauce, Food, and Tools. The stock management module allows users of this
system to view the number of product stocks in the grocery store. Additionally, users can also access
product information using this module. Figure 11 displays the interface for the stock management
module.
This module allows users to manage the buying and selling process that occurs between buyers.
Every purchase and sale are recorded and stored by the system in the database. Buyers can choose the
type of payment transaction, either in cash or online. Figure 12 shows the interface for the sales
transaction module.
1589
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
When the business session is over, employees need to close the sales. Closing sales involves
calculating the daily sales revenue, both in cash and online. By building a sales report module, sales
closing activities can be simplified and accelerated. Figure 13 shows the interface for the sales report
module.
4.2 Testing
There are two types of testing being done after the completion of the development phase, functional
testing and user acceptance testing. Functional testing is conducted to test the functionality of the system
and confirm that it meets the required specifications. User acceptance testing is performed to ensure
that the users are satisfied with the developed system. Table 6 shows the requirement traceability matrix
that has been created to trace whether each test fulfills all the necessary requirements. Table 7 displays
the overall test case results.
Table 6: Requirement Traceability Matrix
1590
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
1591
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
1592
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
Table 7 shows that all 24 test cases have passed. This means that the developed system meets all
the functionality requirements and can perform its functions smoothly.
The next phase of testing is user acceptance testing. The developed system will be given to the users
to test every feature within it. For this project, there are 7 modules, so there are 7 features that need to
be tested by the users, and their feedback will be recorded for further analysis. Figure 14 represents the
feedback from the users regarding the register module.
1593
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
Figure 14 shows that the majority of users who tested the register feature strongly agree that the
feature functions according to their expectations, and they are satisfied with the developed feature.
Figure 15 represents the feedback from the users regarding the login module.
Figure 15 shows that the majority of users who tested the login feature strongly agree that the feature
functions according to their expectations, and they are satisfied with the developed feature. Figure 16
represents the feedback from the users regarding the manage user information module.
Figure 16 shows that the majority of users who tested the manage user information feature strongly
agree that the feature functions according to their expectations, and they are satisfied with the developed
feature. Figure 17 represents the feedback from the users regarding the inventory management module.
1594
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
Figure 17 shows that the majority of users who tested the inventory management feature strongly
agree that the feature functions according to their expectations, and they are satisfied with the developed
feature. Figure 18 represents the feedback from the users regarding the stock management module.
Figure 18 shows that the majority of users who tested the stock management feature strongly agree
that the feature functions according to their expectations, and they are satisfied with the developed
feature. Figure 19 represents the feedback from the users regarding the sales transaction management
module.
Figure 19 shows that the majority of users who tested the sales transaction management feature
strongly agree that the feature functions according to their expectations, and they are satisfied with the
developed feature. Figure 20 represents the feedback from the users regarding the generate daily sale
report module.
Lastly, Figure 20 shows that the majority of users who tested the 'generate daily sale report' feature
strongly agree that the feature functions according to their expectations, and they are satisfied with the
developed feature. Based on all the feedback given by the users who tested the system, all of them are
satisfied with the developed system.
5. Conclusion
In conclusion, the Azzain grocery store management system has been developed to address
operational challenges and enhance efficiency in business activities. By digitizing processes and
ensuring secure data storage in the database, the system enables employees and managers to perform
1595
Azahar & Selamat, Applied Information Technology and Computer Science Vol. 4 No. 2 (2023) p. 1577-1596
various activities digitally, reducing time requirements and minimizing reliance on paper-based
information storage. The implementation of this system alleviates the burden and pressure on workers,
fostering a calmer and more harmonious work environment. Furthermore, the positive feedback
received from user acceptance testing confirms that the system satisfies user expectations. To improve
the system, consider adding features like bulk item registration and advanced inventory management.
Integration of a customer loyalty program and analytics capabilities can also enhance functionality and
decision-making.
Acknowledgment
The authors would like to thank the Faculty of Computer Science and Information Technology,
Universiti Tun Hussein Onn Malaysia for its support.
References
[1] Pustaka, D. B. &. (2007). Kamus Dewan Edisi keempat. Dewan Bahasa & Pustaka.
1596