Web Application Development: Student Attendance System at ICON

This report discusses the development of a web-based student attendance application (WBLAP) for ICON College of Technology and Management. It highlights the benefits of web applications, including cost-effectiveness, accessibility, customizability, and enhanced security. The report explores how progressive web applications (PWAs) solve business problems, leveraging modern app capabilities like Elixir. It also covers server-side and client-side scripting languages used in web development. The document further discusses the testing procedures conducted on the student attendance system to identify and resolve potential bugs, ensuring functionality and security. The report concludes by emphasizing the advantages of web-based applications and their potential to improve efficiency and collaboration.

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 1
Web-Based Students’ Attendance Application (WBLAP)
Student Name
Institutional Affiliation

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 2
Executive Summary
By implementing a web-based student attendance application, ICON College of Technology and
Management will be able to reap numerous benefits including cost effectiveness, accessible
anywhere and at any time, easily customizable, can be accessed from a wide range of devices,
presents a greater level of interoperability, easy installation and maintenance, and enhanced
security. Progressive web applications have the ability to solve many business problems because
uses some applications in modern app capabilities such Elixir in delivering the applications
which are native and which are an experience to the users. Testing of the student attendance
system was conducted to check for potential bugs before being commissioned for production.
Other important issues such as functionality and security are also carried out. This document
focuses on various aspects of web-based applications.

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 3
Table of Contents
Executive Summary.........................................................................................................................2
Introduction......................................................................................................................................4
Benefits of Web Applications..........................................................................................................4
Business problems solved by progressive web applications...........................................................5
Server-Side and Client-Side Scripting languages............................................................................7
Server scripting Language languages..........................................................................................8
Client-Side Scripting....................................................................................................................8
Testing...........................................................................................................................................10
Conclusion.....................................................................................................................................11
Reference List................................................................................................................................13

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 4
Introduction
A web-based application is any application that employs the use of websites as front-end or as
user interface. The users are able to access the application as they are connected to the internet
and have access to a standard web browser. It is different from the traditional applications where
a software has to be installed on the user’s computer for them to access the application functions
(GU and YU, 2009). An example of a web application is the Google Docs. However, it is
possible to convert desktop software into a web-based application.
Benefits of Web Applications
Web-based applications have numerous advantages including:
Cost effectiveness: users use a uniform platform to access the system, the web browser. Web
applications need only to be developed for one operating system which will be hosted and the
users will be able to access regardless of the operating system running on their computers.
Unlike the traditional desktop applications where application have to be developed for every
operating system (HE and XIE, 2013). We applications is cheaper both to develop and test.
Accessible anywhere, any time: as long as you have access to the internet and a computer, one
can be able to access the system from anywhere at any time unlike the traditional that you have
to install the application to a computer before using it. It also allows real-time collaboration, tele-
commuting, and global teamwork.
Customizable: as compared to traditional applications it is easier to customize web-applications
making it easier to update the feel and look of the interface and customize how the information is
displayed and presented to the different group of users. Therefore, it is not necessary to have all
users sharing similar interfaces instead, you can determine the best interface for every user or
situation.
Can be accessed from a wide range of devices. Web-based application can be designed to be
responsive to fit the different screen sizes. Since the applications are not dependent on the
operating system, it can be accessed from laptops, tables, desktops, or even mobile phones as
long as you have a web browser and access to the internet (Mohan, et al., 2014). This allows the
users to interact with the system using methods and devices that best suits them.

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 5
Interoperability: it is easier to attain a greater interoperability level amongst the web applications
as compared to the traditional stand-alone desktop applications. For instance, a web-based
accounting application can be easily integrated with a shopping cart because of the ability of
web-based architecture to support integration of enterprise systems more rapidly.
Easy installation: the complexity of installing and maintaining web-based applications is less.
This is because once the update or upgrade has been installed on the host server, all the users will
be able to access it immediately and no need to upgrade the application on individual user
computers.
Enhanced security: web-based applications are installed on dedicated servers and are monitored
by highly skilled and experienced administrators. This means that potential breaches and threats
are identified easily and security is tighter (QIN, et al., 2013).
Business problems solved by progressive web applications
Web Application can be defined as an application that uses a website in functioning and
interfacing. PWA which is a Progressive Web App can be defined as the web app that uses some
applications in modern app capabilities e.g. Elixir in delivering the applications which are native
and which are an experience to the users (Kraenzel, 2017). This application has been in
existence since the early 90s, shortly after the WWW was introduced (Weaver, 2018). They have
walked hand in hand from the scripts such as the client slides scripts which are the creation of
Netscape to the flash player. Immediately after the completion of the HTML5 in the year, 2011
web applications have been granted to have some more capabilities for the interactions on the
client-side which have allowed many modern web applications and thus making it more
interactive in so many ways (Hume, 2017). The following are some of the ways through the web
Application have been applied.
1. Users will be able to communicate on even the terms. In most cases, this is termed to be so
useful for businesses that have or owns machines which are different and applied in most places
which are different. Web browser beauty is that they are always designed to work across each
and every platform and thus making the architecture to remain relatively consistently (Biørn-
Hansen, 2017). For instance, a Linux user is able to share a document to another user using
Windows OS and who is remotely working with another user using a Mac OS as long each of

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 6
them has some internet connections. In businesses, this may mean that the companies can be able
to concentrate on the major objectives instead of worrying over the obstacles which are non-
central such as the conformity between the hardware.
2. Web Applications being Everywhere and always available enable users to operate from
anywhere. There are many situations we have heard one saying that I will at them when I get
into the office and thus one can be able to understand that availability is everywhere and thus it is
a very significant tool for any single business. Progressive apps maybe handy and rigid for
workers who may be in need of information immediately such as the salespeople, agents working
in the real estate and the officer in the finance (Sheppard, 2017). The continued development of
the mobile phones and the propelling in browsers have always been available and thus lessening
the need for the less portability of the availability laptops and are always in the arm’s reach.
3. Web applications have allowed some sensitive information to be stored in a single location
which is well defended. In most cases, most of the people who work in the cybersecurity may
tell one that the human errors are some of the most regular causes of the data leaks, more than
the shoddy firewalls and the protocols. They are much easier in controlling the flow of the
sensitive data among all the staff, where each will have to log in through the web application that
will record all the specific identity, the time of the logs as well as the date and the files that they
interacted with.
4. Progressive Web application in most cases they allow a collaboration which is instant.
Some of the applications such as the Skype, Google Docs and Hangouts and slack have been
designed for the users so that they can work on the same project in the real-time instead of them
using emails and fax which are known to be back and forth in all times and one cannot be able to
have assurance the other end has seen the message. There are many others application helping in
communication which has collaborated widely.Thus, enhancing communication into areas
beyond the use of phone calls and much more the use of emails. Web applications have been able
to allow for the remote presentations as well as meetings that have negated the need for one to
travel in most of the cases and thus going beyond to just saving the cost of the long-distance calls
when conversing in different countries with different zip codes (Firtman, 2016). The
collaborative apps have got features which have been created so that they can be able to save

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 7
time and much more money and thus having some efficiency which has boosted the efficiency
by providing further such magnification in their usefulness.
5. Valuable information having some constant streams. This means that they can be applied in
feeding each and every part of the country in the process of decision making. This ranges from
the website to social media efforts and much more on the digital marketing (Griffith, 2017).
Amidst having some constant influx in starting new sites and pages in social media, many of the
businesses will have to use data from the given web apps so that they gain the leverage over the
competitors, even if it’s just through elimination of the online strategies which have been
ineffective in the favor of those who are working.
6. They are less sensitive in terms of scalability for the workloads that are increasing daily. A
good example is that of a system relying on the local machines for the hardware power or maybe
upgrading the entire system which may need upgrading all the connected clients. PWA always
provides data to each and every client even in remote places, the only thing that may require an
upgrade for the workloads which have increased is that ability to be able to scale them
horizontally. Similarly, it may be easier for one to be able to identify the problem in the system
in case the nucleus is in a central position, the part which is malfunctioning may it be a hardware
or even software and thus be ready to be replaced with even affecting the entire system.
7. PWA have allowed upgrades in the core technologies without the upgrades on the
capabilities of the clients. In the desktop software becoming more robust, many machines where
they lie and operates have to follow such a suit. This isn’t much of a big concern for any single
user who is looking to take any advantage of the latest software. With PWA, many innovators
can be able to continue with them without too much concern over the results of what they have
discovered in terms of whether they will be known globally.
Server-Side and Client-Side Scripting languages.
The server-side scripting is that technique in programming used for producing the code which
will be running in the software on the server side, in simple terms it is any script or a program
which can run on the web server. All the customizations on a given website, all the dynamic
changes in the web content, generation responses to the queries of the users and database access
are all performed on the server end (Crawford, 2017). This script has constructed communication

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 8
links between the server and the user. The server side is known to incorporate at least three parts
namely the Database, Server and the API and the software at the back-end of the web software
which has been developed by the SSS language.
In the case where a browser sends the request to a given server for a given webpage which may
consist of SSS, the web server will have to process the scripts prior serving the webpage to the
web browser (Hughes, 2016). In this case to process, a script one could include extraction of
information in the DB, make calculations which are simple and thus choosing the appropriate
content that has to be displayed in the client end. The script that is then processed and the
outcome is sent to the to the web browser. The web server can abstract all the scripts on the end
user side until it serves the content and thus making the data and the source date very much
secure.
Server scripting Language languages.
The languages of SSS after the advent of CGI have evolved such as the RUBY, PHP, Python,
ColdFusion, Java, C# and C++ among others.
1. PHP. This is the most used and prevalent SSS language which is applied on the web and
designed in extracting and manipulating the information in the DB. This language is associated
with the SQL language of the DB. It has been applied in making Facebook, Wikipedia, and
WordPress among many other.
2. Python. This is very short in terms of code and very much fast when in use. It always good
for beginners as it has put its concentration on the readability and the code simplicity. It always
functions well in the environment which is object-oriented and it is used in most famous
websites such as the Google and YouTube among others.
3. Ruby. This is known for its complex logic which has packages in the back-end with the DB
utility and thus it is always provided by the PHP and SQL.
Client-Side Scripting
These are scripts which are performed so that they can generate a code that may be running on
the client side that is the browser without the need to of the server end processing. These types of

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 9
the scripts are usually embedded on the on the HTML document. The client Slide scripting has
been used in examining the users form for bugs before it is submitted and also to change the
content with reference to the input of the user. As it is mentioned, the web will always require
the three elements for its to function which are the DB, Client and the server respectively. If the
client slide scripting is effective then it can significantly help in reducing the server load. It is in
most cases designed in a way that it can run the scripting language by utilizing the web browser
to act as the host program (Shepherd, 2016). A good example is when a user makes a given
request via the web browser for a webpage to the given server, it will be sent to the HTML and
to CSS as a plain text and the web browser will have to do an interpretation and thus rendering
the content in the web in the client side. The following are some of the client-side scripting
languages.
1. HTML – this is the building block in the web programming which has fundamentally
provided the frame of the website. It is describing the content arrangement.
2. CSS – cascading style sheets have been providing all ways in which the graphic elements
can be easily designed and thus helping the web application appearance to look more attractive.
3. JavaScript – this is also a Client-Side scripting language which has been created for some
specific functionalities, currently there exist some various frameworks of java scripts which are
applied or used on the SSS technology.
Differences Between the Server-Side Scripting and the Client-Side Scripting
Server-Side Scripting Client-Side Scripting
It is always used at the backed, this is where
we have the source code which is not
viewable or in other words it is hidden on
the client side which is the browser
This is always used as the front-end which
is used by the users so that they can see on
the displayed content in the web browser.
When the server-side script is in most cases
processed then it always communicates with
the server.
In the client-side script, it does not involve
or need any interaction with the server.
It is very useful and much more when
customizing the pages in the web and much
It is conversely in the client-side script, this
is because it has effectively minimized all

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 10
more implementing such dynamic changes
in the website.
the loads to the specific server.
This one is more secure than on the client-
side scripting as it is not viewable on the
client side meaning it is hidden.
Its prone to insecurity as it is visible to all
the users.
There are some software techniques which can help in keeping the system secure such as the one
stated below.
1. To keep the software up to date.
2. Enforcing a policy of using strong passwords
3. Login pages being encrypted.
4. Using a host which is secure.
5. Keeping the website always clean
6. Doing regular and frequent backups
7. Scanning one website to check the vulnerabilities
8. One can hire an expert in security to monitor the system threats in advance.
Testing
Testing of the student attendance system was conducted to check for potential bugs before being
commissioned for production (Swarup and Kapoor, 2014). Other important issues such as
functionality and security are also carried out. Several tests were done on the system; they
include the following.
Functional testing: this testing was carried out to ascertain that the application has met all the
requirements specified by the client. This included testing all the links on the web pages are
working and that there are no broken links. The links tested include internal links, outgoing links,
mail-to links, and anchor links (CHEN, ZHANG and XIN, 2013). Test forms are also checked for
instance if the user does not key in the student number or password and error message should
come up.

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 11
Usability testing: this is the most critical test that was conducted. The system was subjected to be
tested by a small focus group sampled from the target audience. The focus was to ensure that the
users were able to navigate thought the application and can carry out the tasks with less or no
guidance. Some of other functions that the testers did was to test application navigation (menus,
links, or buttons), test the content (no grammatical errors and is legible) (LI, et al., 2014).
Interface testing: three main sections were tested including We, application, and database server.
The application was tested to ascertain that it was able to send correct requests to the database
and display correct output on the client side. The application should detect any errors and notify
the user. Web server was tested to ensure that it could handle user requests without any denial of
service. The database server was tested to ensure that it could give desired results from the
queries issued by the users (FU, LU and ZENG, 2009).
Compatibility testing: this test was done to ascertain that the application could be accessed from
a range of devices with different screen sizes to ensure that the look and feel remained
consistent. Some of the compatibility testing carried out include browser compatibility testing,
and the operating system which the application will be deployed.
Performance testing: the test was conducted to check if the application could work under heavy
traffic form the users. The test tasks included but were not limited to: the response time of the
web application at different speeds of connection, test was done to check the behavior and load
time of the application under peak and normal traffic, test how the site recovers from crush
because of peak loads, stress tests to determine the web application breaking point when traffic is
pushed beyond peak load (WENG, CAI and YAO, 2013).
Conclusion
In conclusion, progressive web applications have the ability to solve many business problems
because uses some applications in modern app capabilities such Elixir in delivering the
applications which are native and which are an experience to the users. Testing of the student
attendance system was conducted to check for potential bugs before being commissioned for
production. Other important issues such as functionality and security are also carried out. Client-
side scripting and the server-side scripting have worked in coordinated ways and manners with
each other. These two techniques are so different as in the client-side scripting much emphasizes

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 12
have been put on making the web application interface to be more appealing and much more
functional while the server-side scripting has put more emphasis on accessing the data methods,
handling of data and thus having faster processing.

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 13
Reference List
Biørn-Hansen, A., Majchrzak, T.A. and Grønli, T.M., 2017, April. Progressive web apps: The
possible web-native unifier for mobile development. In Proceedings of the 13th International
Conference on Web Information Systems and Technologies (WEBIST) (pp. 344-351).
Chen, P., Zhang, J. and Xin, T. (2013). Application of Online Calibration Technique in
Computerized Adaptive Testing. Advances in Psychological Science, 21(10), pp.1883-1892.
Crawford, T. and Hussain, T., 2017, July. A Comparison of Server-Side Scripting Technologies.
In Proceedings of the 15th International Conference on Software Engineering Research and
Practice, Las Vegas, NV (pp. 69-76).
Firtman, M., 2016. High-Performance Mobile Web: Best Practices for Optimizing Mobile Web
Apps. " O'Reilly Media, Inc.".
Fu, H., Lu, Y. and Zeng, G. (2009). Web application test model based on action. Journal of
Computer Applications, 29(3), pp.695-698.
Griffith, C., 2017. Mobile App Development with Ionic, Revised Edition: Cross-Platform Apps
with Ionic, Angular, and Cordova. " O'Reilly Media, Inc.".
Gu, X. and Yu, H. (2009). Improvement of full function point for Web-based
applications. Journal of Computer Applications, 28(12), pp.3098-3101.
He, C. and Xie, Q. (2013). Personalized Web services selection method based on collaborative
filtering. Journal of Computer Applications, 33(1), pp.239-242.
Hughes, S.R. and Rist, J.E., Red Hat Inc, 2016. Server-side internationalization and localization
of web applications using a scripting language. U.S. Patent 9,465,799.
Hume, D.A., 2017. Progressive web apps. Manning Publications Co.
Kraenzels, C.J., Immermanih, J.D., Mills, W.A. and Lu, J.J., International Businesses Machines
Corp, 2017. Systems and methods for developing and administering web-applications and
services from a given workflow, enterprises, and mail-enabled web-application server and
platforms. U.S. Patent 9,805,337.

WEB-BASED STUDENTS’ ATTENDANCE APPLICATION (WBLAP) 14
Li, H., Wang, S., Liu, C., Zheng, J. and Li, Z. (2014). Software Reliability Model Considering
both Testing Effort and Testing Coverage. Journal of Software, 24(4), pp.749-760.
Mohan, S., Alam, F., Fowler, J., Gopalakrishnan, M. and Printezis, A. (2014). Capacity Planning
and Allocation for Web-Based Applications. Decision Sciences, 45(3), pp.535-567.
Qin, Z., Song, X., Geng, J. and Chen, W. (2013). Markov-based survivability model for Web
applications. Journal of Computer Applications, 33(2), pp.400-403.
Shepherd, D.R., Sibert, M.A. and Soroka, D.M., International Business Machines Corp, 2016.
Client-side script to application communication system. U.S. Patent 9,357,013.
Sheppard, D., 2017. Introduction to Progressive Web Apps. In Beginning Progressive Web App
Development (pp. 3-10). Apress, Berkeley, CA.
Swarup, S. and Kapoor, D. (2014). Web Vulnerability Scanner (WVS): A Tool for detecting
Web Application Vulnerabilities. International Journal of Engineering Research, 3(2), pp.126-
131.
Weaverih, S., Shanks, S.D., Spielmanah, S.J., Li, M., Museh, S.V. and Kosakovsky Pond, S.L.,
2018. Datamonkey 2.0: a modern web application for characterizing selective and other
evolutionary processes. Molecular biology and evolution, 35(3), pp.773-777.
Weng, L., Cai, W. and Yao, Y. (2013). Research on pressor strategy of Web application system
load testing. Journal of Computer Applications, 32(10), pp.2973-2976.