Hypertext Markup Language Research Articles

E-Learning Web Elements for Brickwork Course in theConstruction Technology forVocational Training

E-learning web is a learning material delivered in electronic media through HTML (Hyper Text Markup Language), programming for the Construction Technology Program. This study was conducted to design and develop reference material asan e-learning web for the brickwork course based on modifying the ADDIE model. The objective of this study is to identify the aspects of web element requirements, the appropriateness of design, format, and content in the e-learning web of the brickwork course and the usability of the e-learning web. This study is a development and survey involving three types of respondents: three creative multimedia experts from Universiti Tun Hussein Onn Malaysia,lecturers, and students in construction technology programs from vocational colleges.The questionnaires and feedback forms were used using dichotomous and Likert scales. Theresults of the study indicated that all lecturers and students agree with the appropriateness of the design, format, content, and usability of the e-learning web. Overall, the development of the e-learning web of the brickwork course for the construction technology program is expected to help improve student understanding and be beneficial as an input for web developers, especially for developing educational materials for Web 4.0.

Indang Konektayo Kiosk: An Interactive Menu System for Tourists

Every traveler wants to experience hassle-free and safe travel while maintaining an enjoyable journey with the help of user-friendly interfaces and an innovative technological menu system. An interactive information menu system that improves the traveler experience, commercial operations, and tourism information at the Municipality of Indang. It is a technological solution that is relevant to today's demand and interest, and that is readily available data sources and information, which benefit. Specifically, it possesses the following characteristics, including: (1) a place finder that provides registered places in Indang with the right information and allows users to discover new established places in Indang; (2) mapping routes that provide directions and generate routes; and (3) sending the Google Maps URL through a short messaging system (SMS) to the mobile phone of the user, which can be opened in digital maps such as Google Maps. The descriptive method of research was used in this study and was created with Cascading Style Sheet (CSS), Hypertext Markup Language (HTML), Hypertext Processor (PHP), JavaScript (JS) in web development, MySQL for its database, as well as an SMS API for sending map URLs based on the queries. The Agile software model was used, which was composed of sprints, each of which was meant to focus on the developmental adjustments as interactive kiosks were prone to updates and ran into serious changes. Using ISO 9126 software product quality standards, the system received an average rating of 4.71 from respondents, indicating excellent quality and that it served its functions properly and met all of the required requirements.

ResumeCraft: A Machine Learning-powered Web Platform for Resume Building

Abstract: The competitive job market necessitates well-crafted resumes that resonate with both human recruiters and Applicant Tracking Systems (ATS). This paper introduces ResumeCraft, a web-based platform empowering users to build strong resumes and optimize them for ATS compatibility. ResumeCraft leverages Machine Learning (ML) for data analysis and user guidance, while the user interface is built with Hypertext Markup Language (HTML), Cascading Style Sheets (CSS), and JavaScript for a user-friendly experience. The system allows users to input their personal and professional details through a series of form fields, and provides a real-time preview of the resume design as the user inputs their data. The resume generator uses JavaScript to dynamically populate the preview with the user's input, and allows users to select from a range of pre-designed templates and color schemes to customize the look and feel of their resume. It processes the user input and generates a downloadable Portable Document Format (PDF) of the final resume. The platform analyzes user-provided information through ML models, offering suggestions on skill extraction, keyword matching, and action verb usage. This combination empowers users to create impactful resumes that are more likely to pass through ATS filters and reach human reviewers.

Customizing pyfao56 for evapotranspiration estimation and irrigation scheduling at the Limited Irrigation Research Farm (LIRF), Greeley, Colorado

Estimation of evapotranspiration (ET, the water used by soil evaporation and plant transpiration) and soil water depletion (Dr, the amount of water to bring the soil water in the root zone to field capacity) are critical in irrigation water management. The open-source Python-based crop ET and water balance modeling package named “pyfao56” was originally developed based on the dual crop coefficient approach as described in the Food and Agricultural Organization of the United Nations, Irrigation and Drainage Paper No. 56 (FAO-56). The package later expanded on the seminal FAO-56 document to consider various options relevant to ET and water balance modeling, including both short (grass) and tall (alfalfa) reference crops, optional discretization of variable soil layers based on field capacity, and interpretation of readily available water (RAW) and Dr based on both a dynamic (growing) root zone and maximum root zone. The package requires two input data objects; the “Parameters” class defines variables affecting soil water balance and ET and the “Weather” class specifies relevant meteorological data. Other optional input data objects include the “Irrigation” class for irrigation events, the “Soil_Profile: class for defining stratified soil layer data, and the “Update” class for assimilation of measured data. Additional tools are available for estimating and forecasting standardized reference ET (ETref), providing seasonal water balance summaries, computing goodness-of-fit statistics between measured and modeled values, and visualizing time series plots of daily Dr, ET, and crop coefficients. The current pyfao56 release (v1.2.1) was incorporated into a customized workflow for specific use at the USDA-ARS Limited Irrigation Research Farm (LIRF) in Greeley, Colorado, and named the LIRF Implementation of Pyfao56 (LIRFIP). Field data from 2023 full and limited irrigation field trials were used to demonstrate the functionality of LIRFIP and its customizations and integration of pyfao56 into the LIRF workflow. Specific customizations included use of pyfao56 “customload” functions to input data from various sources, including weather from an on-site micrometerological station (using the application programming interface (API) developed by the maintainers of the Colorado Agricultural Meteorological (CoAgMet) weather station network), irrigation events (via a shared Google docs sheet), field capacity values by plot and soil layer (via an Excel spreadsheet), and measured soil water content as well as basal crop coefficient (Kcb) calculated from fractional canopy cover (fc) (via an SQLite database). To evaluate multiple research plots, LIRFIP was designed to iterate simulations from multiple instances of pyfao56 and to produce customized output summary files and interactive hypertext markup language (html) graphs as an aid for irrigation management decisions for LIRF field trials. This study demonstrated pyfao56 as a useful, flexible, customizable, and repeatable ET-based water balance model by showcasing its integration within a specific computational workflow for irrigation management field research at LIRF. The approach serves as an example for pyfao56 integration in other water management tools as conceived by water managers, researchers, and practitioners worldwide.

PhishingRTDS: A real-time detection system for phishing attacks using a Deep Learning model

In recent years, phishing attacks have become more intelligent and more challenging to detect using typical phishing methods. Moreover, attackers have leveraged some web development techniques to increase the website's legitimacy in victims' eyes, such as using JFrame to design a window that looks like a browser inside the webpage. In this paper, we design a system that detects three types of phishing attacks: Tiny Uniform Resource Locators (TinyURLs), Browsers in the Browser (BiTB), and regular phishing attacks. In this system, we aim to protect victims from mistakenly downloading malicious software into their systems. We split our system into three parts: Deep Learning model (DL), browser extension, and docker container. First, we design a DL model using bidirectional long short-term memory (BiLSTM) and an attention mechanism to classify the URL as phishing or benign. Our model shows 99% in its precision, recall, and F1 score. Second, we design a browser extension to extract the original URL from the suspect webpage and then send it to the docker container. Then, the docker container opens the webpage and extracts all URLs from its HyperText Markup Language (HTML) and JavaScript. Then, each URL passes to a DL model for classification, resulting in a list of labels for each webpage. Therefore, we use three decision strategies: Single Phishing Strategy (SPhS), Mean Sum Strategy (MSS), and Weighted Average Strategy (WeAS) to decide whether the webpage is phishing or benign. Our findings indicate that the best results among the three strategies were WeAS.

Dynamic switching of psychological test questions and design of scalable database: A study of web page data visualization and front-end interaction

As the need for efficient and user-friendly web applications in the field of psychological assessment continues to grow, traditional web development approaches are challenged to provide a dynamic and adaptive user experience. This study focuses on addressing these challenges through a comprehensive study that provides insight into the current state of psychological assessment web development, highlighting the shortcomings of traditional approaches, including the static limitations of Hyper Text Markup Language (HTML) and limited client-side scripting. The result is a user experience that lacks the responsiveness and flexibility that modern users expect. To tackle these problems, the intended solution suggested in this work combines a strong and scalable database design with a dynamic switching mechanism for psychological exam questions. Features-rich, aesthetically pleasing, and functioning client-server Web applications are created using technologies such as Servlets and Java Server Pages (JSP). The research contains practical case studies that demonstrate how Java-based user interface design can be successfully applied in real-world scenarios. The advantages of modularity, code reusability, and maintainability are demonstrated in these case studies. The study examines how selected technologies affect the performance, security, and accessibility of web UI, while also addressing load times, data integrity, and user inclusion issues. To summarize, this investigation underscores the crucial role of dynamic and scalable databases and Java-based technologies in enhancing the design of psychological assessment Web UIs.Developers can create web applications that exceed user expectations and provide superior user experience in the evolving digital landscape by using the proposed frameworks comprehensive toolkit.

Development and implementation of real-time staff performance monitoring and evaluation system based on Global Positioning System (GPS)

This work presents the development and implementation of a Real-Time Staff Performance Monitoring and Evaluation System (RT-SPMES) using Global Positioning System (GPS) technology. In line with the dynamism of the workplace, due to rapid changes in technology, existing staff performance appraisal systems have fallen short of expectations due to their manual nature. Hence, the need arises for a more robust approach to monitoring and evaluating employee work performance. To achieve this, this work carried out an exhaustive review of existing performance evaluation methods within the academic and a conceptual architecture was developed. A real-time monitoring and evaluation system was developed, using PHP programming language, Hyper Text Markup Language and Cascading Styles Sheet. The system is hosted on Azure Cloud infrastructure. Through sufficient testing of the developed system developed in this work, it was asserted effectively monitors employee performance in real-time, paving the way for an objective appraisal process devoid of bias and manipulation.

Simplifying Multimodal Clinical Research Data Management: Introducing an Integrated and User-friendly Database Concept.

Clinical research, particularly in scientific data, grapples with the efficient management of multimodal and longitudinal clinical data. Especially in neuroscience, the volume of heterogeneous longitudinal data challenges researchers. While current research data management systems offer rich functionality, they suffer from architectural complexity that makes them difficult to install and maintain and require extensive user training. The focus is the development and presentation of a data management approach specifically tailored for clinical researchers involved in active patient care, especially in the neuroscientific environment of German university hospitals. Our design considers the implementation of FAIR (Findable, Accessible, Interoperable, and Reusable) principles and the secure handling of sensitive data in compliance with the General Data Protection Regulation. We introduce a streamlined database concept, featuring an intuitive graphical interface built on Hypertext Markup Language revision 5 (HTML5)/Cascading Style Sheets (CSS) technology. The system can be effortlessly deployed within local networks, that is, in Microsoft Windows 10 environments. Our design incorporates FAIR principles for effective data management. Moreover, we have streamlined data interchange through established standards like HL7 Clinical Document Architecture (CDA). To ensure data integrity, we have integrated real-time validation mechanisms that cover data type, plausibility, and Clinical Quality Language logic during data import and entry. We have developed and evaluated our concept with clinicians using a sample dataset of subjects who visited our memory clinic over a 3-year period and collected several multimodal clinical parameters. A notable advantage is the unified data matrix, which simplifies data aggregation, anonymization, and export. THIS STREAMLINES DATA EXCHANGE AND ENHANCES DATABASE INTEGRATION WITH PLATFORMS LIKE KONSTANZ INFORMATION MINER (KNIME): . Our approach offers a significant advancement for capturing and managing clinical research data, specifically tailored for small-scale initiatives operating within limited information technology (IT) infrastructures. It is designed for immediate, hassle-free deployment by clinicians and researchers.The database template and precompiled versions of the user interface are available at: https://github.com/stebro01/research_database_sqlite_i2b2.git.

Hierarchical Modelling of Smart Digital Cultural Heritage Spaces: An XML-Based Approach

Extensible Markup Language or XML was created with the aim of making information self-describing. In contrast to Hypertext Markup Language (HTML), XML is not seen as a markup language but rather as a toolkit for creating mark-up languages. Immersive technologies provide Cultural Heritage spaces with the opportunity to implement a smart digital immersive user journey, but an inclusive design should be prioritised as it is a fundamental right for all individuals to participate in cultural life as stated by the United Nations Educational Scientific and Cultural Organisation (UNESCO). A well-formed XML schema can allow museum curators to implement a smart digital immersive system and strategically position technological devices to optimise interactivity in the user journey. An objective of this paper is to review the theoretical background of XML and determine its suitability to model smart digital Cultural Heritage spaces. Design Science Research (DSR) will also be analysed and applied to the design of an initial XML schema to provide a hierarchical structure for a smart digital immersive user journey. The schema will be applied to an artificial Cultural Heritage setting which is manually designed in this paper to illustrate an example of a smart digital immersive environment and does not represent a real location. The results indicate that XML can support Cultural Heritage professionals to digitise their user experience in a way that is human-centred and harnesses the beneficial aspects of digital technologies.

DEVELOPMENT OF A LEARNING MANAGEMENT SYSTEM FOR PHYTON PROGRAMMING LANGUAGE

An Electronic Learning System is an educational platform that takes place over the Internet. Due to its convenience and flexibility, learning through an Electronic Learning Management System (LMS) results in effective learning experiences. The purpose of this research is to design and develop a LMS for programming education. Collaborative, microlearning and scaffolding programming learning approach were incorporated into the design and development of the learning management system for programming language. The software was developed using waterfall model, and evaluated by analyzing user’s feedback. The tools used in building the learning management system are visual studio code, Hyper Text Markup Language (HTML), cascading style sheet, javascript, python, django, Django rest framework, Jason, ajax, git, tinyMCE. The evaluation of the newly implemented online learning platform based on user feedback was overwhelmingly positive. Users appreciated the platform's intuitive interface, which allowed for easy navigation and quick access to resources. The clear and concise instructions provided were also highly commended, as they helped to ensure that users understood the system's various features and capabilities. Users also noted the platform's support for various types of learning content, including text, audio, video, and interactive materials, which helped to create a more engaging and dynamic learning experience. Furthermore, the platform's effective tools for monitoring student progress and managing course completion were praised for their efficiency and ease of use. The platform's support for collaborative learning was also highly valued, with users citing the ability to work together and exchange ideas as a valuable aspect of the platform. In conclusion, the newly implemented online learning platform is a valuable tool that can significantly enhance the learning experience of students. The positive feedback from users suggests that the platform's support for micro-learning and collaborative learning can effectively promote engagement, collaboration, and successful learning outcomes. These findings underscore the importance of designing and implementing effective online learning platforms that support the needs of both students and instructors.

PEMBANGUNAN LAMAN SESAWANG BAGI PENGURUSAN JAWATANKUASA OBE POLITEKNIK KUCHING SARAWAK DENGAN KERANGKA DJANGO

OBE Committee Management (Outcome Based Learning) must be organized and easily accessible by certain parties such as management and committee members themselves. Among the information that can be obtained is the committee organization chart, committee information, activities carried out as well as data management for the committee. The difficulty of managing activity data is the main reason this website was created. The process of developing this particular website uses the Django web development framework. Website display requires basic knowledge of HTML (Hypertext Markup Language) and CSS (Cascading Style Sheet). The result of the development of the OBE Committee website gives the management the opportunity to access the database of activities carried out by the department's OBE coordinator.

Implementation of User-Oriented Geovisualization Web Dashboard for Monitoring Access to Improved Water using Satellite Imageries Data

This study aims to develop an engaging, web-based visualization dashboard for improved water access in Indonesia. The dashboard map was made using three technologies: the Qgis2web Python plugin for producing two-dimensional (2D) dashboard maps, JavaScript leaflets for map visualization, and Hypertext Markup Language (HTML), Cascade Stylesheet (CSS), and JavaScript for the user interface. The built-in map dashboard has several features, including grid click, legend, zoom, search, and measure distance, which are meant to help users determine the location of the nearest water treatment facilities, identify geographical features, and keep track of areas that have poor access to improved water. Evaluation using the system usability scale (SUS) concludes the dashboard is acceptable with an excellent rating. Our results reiterate and enhance support for government institution and relevant stakeholders in providing sustainable access to public water.

A Geovisualization Dashboard of Granular Food Security Index Map using GIS for Monitoring the Provincial Level Food Security Status

This study aims to build a web-based interactive geovisualization dashboard from a granular food security index map using satellite imagery and other geospatial big data. The map dashboard is built using a two-dimensional (2D) data visualization approach. Making a two-dimensional map using QuantumGIS (QGIS) tools, displayed in the form of WebGIS with the plugin used "Qgis2web" based on javascript leaflets. Once included in WebGIS, interactive visualizations are displayed on websites with interfaces based on hypertext markup language (HTML), cascading style sheets (CSS), and JavaScript (JS). The dashboard map is equipped with interactive features such as legend, click grid, zoom, show me where I am, measure distance, and search. Therefore, the dashboard map can be used to monitor the food security index, search for food security index areas, as well as geographical identification of food security index areas which are useful for supporting the analysis of decision-making or policies by the government regarding food security strategies.

Design and Implementation of an Interactive Visualization Dashboard for Monitoring the Flood Vulnerability and Mapping

This study aims to build a web-based interactive visualization dashboard from granular flood vulnerability index estimation maps using data from satellite imagery. The approach used to build this visualization dashboard is a two-dimensional (2D) approach created with the qgis2web python plugin facilitated with a JavaScript leaflet. Raw data from satellite imagery consisting of indicators of the causes of flooding are extracted in comma-separated value (CSV) format. Furthermore, the data is integrated based on its spatial attributes and stored in Geographic JavaScript Object Notation (GeoJSON) format to produce a visualization of the flood vulnerability index map. In web views, dashboards are built by utilizing hypertext markup language (HTML), cascading style sheets (CSS), and JavaScript (JS). This interactive dashboard has several useful features in helping the process of monitoring the flood vulnerability of an area such as zoom, "show me where I am", measure distance, search, legend, and change year. Thus, the flood vulnerability estimation map dashboard is expected to assist the government in monitoring areas with extreme flood vulnerability and support the decision-making process related to mitigation of areas that have high flood vulnerability.

ANALISIS DAN PENERAPAN SISTEM INFORMASI PRESENSI GURU BERBASIS WEB MENGGUNAKAN QR CODE PADA SMP NEGERI 2 PARONGPONG

The teacher presence information system is a strategic step to increase the effectiveness and efficiency of education in schools. With advances in technology, currently, especially in the field of website development, a website attendance system is needed to facilitate the academic community in carrying out administrative processes. By using the website, the presence system becomes more effective because the academic community can access it from any device. The existence of a web-based presence system also reduces the risk of data loss and damage because the data has been stored in computerized Big Data. The method used in this study uses the Waterfall method or what is often called the Waterfall model. The steps taken are needs analysis, system design using UML (Unifeld Modeling Language), Use Case Diagrams, Activity Diagrams, Class Diagrams, Sequence Diagrams, the programming language used is HTML (Hyper Text Markup Language), PHP (Hypertext Preprocessor), CSS (Cascading Style Sheets) in addition to Jquery, MySQL as a Database and testing with black box testing. Designing, creating and building an information system is a complex process, involving various aspects such as User requirements, Interface design, the ability to record attendance history, data management processes, and the use of software development methods. the main goal is to create a system that can provide maximum benefits in managing teacher attendance in the school environment. The use of QR Code technology in designing a website teacher attendance information system is to take advantage of modern innovations to optimize efficiency and accuracy in the attendance process.

Enabling knowledge translation: implementation of a web-based tool for independent walking prediction after traumatic spinal cord injury.

Several clinical prediction rules (CPRs) have been published, but few are easily accessible or convenient for clinicians to use in practice. We aimed to develop, implement, and describe the process of building a web-based CPR for predicting independent walking 1-year after a traumatic spinal cord injury (TSCI). Using the published and validated CPR, a front-end web application called "Ambulation" was built using HyperText Markup Language (HTML), Cascading Style Sheets (CSS), and JavaScript. A survey was created using QualtricsXM Software to gather insights on the application's usability and user experience. Website activity was monitored using Google Analytics. Ambulation was developed with a core team of seven clinicians and researchers. To refine the app's content, website design, and utility, 20 professionals from different disciplines, including persons with lived experience, were consulted. After 11 revisions, Ambulation was uploaded onto a unique web domain and launched (www.ambulation.ca) as a pilot with 30 clinicians (surgeons, physiatrists, and physiotherapists). The website consists of five web pages: Home, Calculation, Team, Contact, and Privacy Policy. Responses from the user survey (n = 6) were positive and provided insight into the usability of the tool and its clinical utility (e.g., helpful in discharge planning and rehabilitation), and the overall face validity of the CPR. Since its public release on February 7, 2022, to February 28, 2023, Ambulation had 594 total users, 565 (95.1%) new users, 26 (4.4%) returning users, 363 (61.1%) engaged sessions (i.e., the number of sessions that lasted 10 seconds/longer, had one/more conversion events e.g., performing the calculation, or two/more page or screen views), and the majority of the users originating from the United States (39.9%) and Canada (38.2%). Ambulation is a CPR for predicting independent walking 1-year after TSCI and it can assist frontline clinicians with clinical decision-making (e.g., time to surgery or rehabilitation plan), patient education and goal setting soon after injury. This tool is an example of adapting a validated CPR for independent walking into an easily accessible and usable web-based tool for use in clinical practice. This study may help inform how other CPRs can be adopted into clinical practice.

WEB DESIGN AND WEB PROGRAMMING IN THE MODERN INTERNET WORLD

Modern web content development capabilities are undergoing characteristic changes due to the improvement of web technologies in programming. The origin of web technologies began in the early 80s of the last century when the Hypertext Transfer Protocol (HTTP) and the Hypertext Markup Language (HTML) made a significant contribution to the development of Internet capabilities. The web evolution, characterised by scientific and technological progress in information technology, has opened up new opportunities for the development of web programming, which has led to the emergence of programming languages, frameworks, cascading style sheets, and hypertext markup languages. This research aims to study and analyse the key aspects of web programming and web design with a combination of modern features of the Internet environment. To analyse web design, the article considers the possibilities of using the Bootstrap framework, which combines and contains the HTML5 hypertext markup language, CSS3 cascading style sheets, and the JavaScript programming language. Having analysed two web development technologies—front-end and back-end—we can conclude that the presentation level (front-end development) corresponds to the client side, with which the client can interact and where dynamic elements can be added to an HTML page using JavaScript with the visual definition of a web page using CSS. In the case of back-end development, the application layer corresponds to the server side, with which the client cannot interact, as the shell is hidden. Using the modern capabilities of the programming language, its code, and a set of auxiliary tools in website development, the paper presents a development algorithm where each stage contains separate processes and operations during website development, which makes it impossible for them to exist independently. Thus, tools for designing and laying out websites using modern technologies can greatly simplify the development process, which can create higher-quality web content. Keywords: Web, web environment, web technologies, front-end, framework, Bootstrap, CSS3, HTML5, CCS3, JavaScript.

Harnessing H5P for Asynchronous Active Learning

Active learning, as defined by Bonwell and Eison (1991), involves students in doing things and thinking about what they are doing. Extensive research has highlighted the numerous benefits of active learning, including increased attendance rates (Kozanitis & Nenciovici, 2022), improved learning outcomes (Ruiz-Primo et al., 2011), reduced achievement gaps for underrepresented students (Haak et al., 2011; Theobald et Al., 2020), higher-order thinking skills, and enhanced student performance (Freeman et al., 2014). In comparison to traditional lectures, any form of active learning has proven to be beneficial to student learning (Schneider & Preckel, 2017). However, most research on active learning has focused predominantly on face-to-face synchronous classrooms, with little attention to active learning in online asynchronous environments. This presents an opportunity to explore design solutions that promote active learning in these asynchronous settings where students lack real-time interactions with educators and peers. The advent of HTML5 (HyperText Markup Language version 5) or H5P has the potential to revolutionise active learning in online learning settings. As a free and open-source content creation tool, H5P offers various interactive and engaging content types that enable students to interact directly with course material in meaningful ways. This interactivity encourages students to participate actively in their learning process rather than passively obtaining information from lectures. Drawing from two case studies conducted at an Australian university, this presentation highlights how H5P can be used to enhance active learning in online asynchronous courses. The first case study investigates the design of H5P training modules for a platform that supports researchers in humanities and social sciences in their sensitive data access management. This platform is part of a nation-wide project involving 12 partnering institutions and government agencies in Australia. The second case study explores the implementation of H5P learning activities in a Vietnamese language course over three years. In both cases, H5P is used as a plug-in within the Moodle learning platform. Data collection for these case studies included interviews with educators and learning designers, Moodle reports, and participant feedback surveys. The findings from the thematic analysis and the learning analytics revealed substantial benefits of using H5P for active learning, along with the technical and pedagogical challenges encountered during the design process. The presentation features exemplary cases and insights from the case studies to suggest H5P design solutions that foster active participation, reflective thinking, and knowledge construction for students in online asynchronous settings.

Electronic Storefront Development Using Responsive Web Design (ACECS)

Food and beverage (F&B) businesses often encounter a common issue: employees struggling to manage customer orders efficiently. Moreover, the lack of a computerized system and online presence can result in the physical location becoming overcrowded during peak hours, causing potential customers to be discouraged by lengthy waiting times. To address the issue, the ordering process needs to be computerized for improved efficiency. This study aims to achieve several objectives: identifying user and system requirements for an ecommerce system in F&B businesses, creating and developing a webbased e-commerce system using responsive web design, and evaluating the system's functionality and usability. To initiate this research, a preliminary analysis of system requirements was conducted through surveys and literature review. The design phase followed, producing essential design diagrams such as the data flow diagram (DFD), which plays a crucial role in shaping system functionalities. The implementation's backend employs the MySQL database for effective data storage and PHP for data processing. On the frontend, Figma was used for initial system design, while Bootstrap, cascading style sheets (CSS), and hypertext markup language (HTML) were used to create a functional website. The research culminated in functionality and usability testing. Usability testing involved expert evaluation with input from two experts. The results acquired give a positive indicator for further implementation. This study sheds light on a tool that could enhance the order process in F&B business outlets. Responsive design features were incorporated to ensure a consistent and user-friendly experience across various devices.

A Review on Full Stack Web Development

Web development is a dynamic and growing field that plays an important role in the development and maintenance of websites and web applications. This abstract provides a brief summary of web development, including its objectives, key technologies, and development process.
 Web development encompasses a range of activities aimed at designing and maintaining websites and web applications accessible through the World Wide Web. It combines engineering, design principles and design. This overview highlights the following key points.
 
 Objectives and importance: Web development is foundational for individuals, businesses and organizations online. It enables the delivery of information, services and interactive experiences to a global audience, affecting communications, marketing, and industry.
 Core Technologies: Web development relies on a core set of technologies, including HTML (Hypertext Markup Language), CSS (Cascading Style Sheets), and JavaScript. HTML structures web content, CSS improves visual design, and JavaScript adds interactivity and functionality. In addition to these core technologies, web development often uses databases, backend languages, and frameworks.
 Development Processes: Interactive development processes typically involve planning, design, development, testing, implementation, and ongoing maintenance. It emphasizes user interfaces, accessibility and flexibility across devices and browsers. The coordination between developers, designers and stakeholders is essential to the success of the project.