Solent University - Coursework Assessment BriefModule Title: Dissertation Project (Computing Subject Group)
Solent University - Coursework Assessment BriefModule Title: Dissertation Project (Computing Subject Group)
Module Code: COM616
Module Leader: Martin Reid
Level: 6
Assessment Title: Poster Presentation
Assessment Number: AE3
Assessment Type: Presentation
Restrictions on Time/Word Count: 15 minutes (approx.)(10min Presentation & 5 Demo follow up Q&A)
Computing degree show week of 15/5/2022 (2hr event)
NOT NOW TAKING PLACE
Consequence of not meeting time/word count limit: n/a
Individual/Group: Individual
Assessment Weighting: 10%
Issue Date: September 2022
Hand in Date: Friday 12th May 2023 16:00hrs
Planned Feedback Date: With 4 weeks of submission deadline
Mode of Submission: Presentation & online submission
Number of copies to be submitted: 1
Anonymous Marking This assessment is exempt from anonymous marking
Learning Outcomes
Undertake a significant self-managed project in a planned and systematic fashion.
Identify, interpret, deconstruct, compare and integrate theory drawn from a range of appropriate sources.
Select, apply, evaluate, make judgements on the appropriateness of methods, tools and technologies.
Communicate clearly and concisely verbally, visually and in writing.
Apply current professional, ethical and legal guidelines.
Reflect critically and constructively on work in progress and final outputs, devising strategies for improvementAssessment Task
This assessment is concerned with your ability to communicate information about your project. You are required to:
prepare and display presentation materials that allow someone who has no prior knowledge of your project to quickly grasp a basic understanding of what has been achieved in your projectrespond to questions about any aspect of your projectComputing degree show is now not taking place This assessment will bring together all your work and evaluation at the Computing degree show. This event will involve the production of an academic AE1 style poster, which communicates your project lifecycle and there will be an opportunity to get real-word feedback from industry visitors.
You will create a video presentation of you present your project life cycle with the support of your poster: (10 mins approx.) plus a demonstration of what you have produced (5 mins approx.) and your supervisor (first grader) will follow up with a question and answers session which will take place online.The poster and demo will then be displayed at the Computing degree show week of 15/5/2022 (2 hrs event) details to followThis assessment will be assessed by your supervisor (first grader) and then sample moderated internally and externally.
A1-A2 A3-A4 B1-B3 C1-C3 D1-D3 F1-F3
Overall Presentation (LO: 1, 4)
Exceptional presentation and organisation of work and fluent communication in all contexts. Excellent presentation and organisation of work and fluent communication in most contexts. Presentation and organisation of work appropriate to context and purpose, communication clear. Satisfactory organisation and presentation of work, communications mostly appropriate to the context/purpose. Organisation and presentation of work and communications adequate in most contexts, with some mistakes/irrelevancies. Elements of disorganisation/poor presentation/poor communication or expression or Communications too brief or rambling, inappropriate to context or purpose, with many errors/omissions, inadequately expressed/presented.
Presentation of Artefact/s (LO: 3)
Consistent high-level competence in all the required specialised practical, technical innovation, creative, with mastery in many areas and developed understanding of professional contexts and expectations. Exceptional demonstration that proves the artefact goes far beyond what has been delivered course, attention to industry standards and expectations for a Level 6 student. Consistent competence in all the required specialised practical, technical innovation, creative, with indications of mastery in some areas and clear understanding of professional contexts and expectations. Excellent demonstration that proves the artefact goes beyond what has been delivered course, attention to industry standards and expectations for a Level 6 student. Competence in all the required specialised practical, technical, creative, scholarly or work-related skills, with indications of more developed ability in some areas and awareness of professional contexts and expectations. Very Good demonstration that proves the artefact goes beyond what has been delivered course, attention to industry standards and expectations for a Level 6 student. Achieves a basic level of competence in all the required specialised practical, technical, creative, scholarly or work-related skills, with more developed capability in at least one area, and some awareness of professional contexts and expectations. Demonstration shows that the artefact is equal to what has been delivered on course, attention to industry standards and expectations for a Level 6 student. Basic competence in all the required specialised practical, technical, creative, scholarly or work-related skills, and partial awareness of professional contexts and expectations. Demonstration shows that the artefact falls below what has been delivered on course, attention to industry standards and expectations for a Level 6 student. Basic functionality
Marginally or fails to achieve basic competence in (some of) the required specialised practical, technical, creative, scholarly or work-related skills, and little or lacks awareness of professional contexts and expectations. Demonstration shows that the artefact is poor, lacks functionality or does not work, and falls well below what has been delivered on course, attention to industry standards and expectations for a Level 6 student.
Response to Questions (LO: 6)
Exceptional responses, fluent communication in all contexts Excellent fluent responses in most contexts Responses appropriate to context and purpose, communication clear Satisfactory responses mostly appropriate to the context/purpose Responses adequate in most contexts, with some mistakes/irrelevancies
Responses disorganisation/poor
presentation/poor communication or expression
Living CV
As part of the University's Work Ready, Future Ready strategy, you will be expected to build a professional, Living CV as you successfully engage and pass each module of your degree.
The Living CV outputs evidenced on completion of this assessment are:
Evidence of a complete project that brings all your skills togetherDissertation Project Report, academic poster, and the product you createdThe Degree Show will be an opportunity to discuss your project with industry visitors you can include documentation of this event i.e. social media/self-promote
Please add these to your CV via the Living CV builder platform on Solent Futures OnlineSolent Futures Online
Important Information
Late Submissions
You are reminded that:
If this assessment is submitted late i.e. within 7 calendar days of the submission deadline, the mark will be capped at 40% if a pass mark is achieved;
If this assessment is submitted later than 7 calendar days after the submission deadline, the work will be regarded as a non-submission and will be awarded a zero;If this assessment is being submitted as a referred piece of work, then it must be submitted by the deadline date; any Refer assessment submitted late will be regarded as a non-submission and will be awarded a zero.
Assessment regulations
Extenuating Circumstances
The Universitys Extenuating Circumstances (EC) procedure is in place if there are genuine short term exceptional circumstances that may prevent you submitting an assessment. If you are not 'fit to study, you can either request an extension to the submission deadline of 7 calendar days or you can request to submit the assessment at the next opportunity, i.e. the resit period (as a Defer without capping of the grade). In both instances you must submit an EC application with relevant evidence. If accepted under the university regulations there will be no academic penalty for late submission or non-submission dependent on what is requested. You are reminded that EC covers only short term issues (20 working days) and that if you experience longer term matters that impact on your learning then you must contact the Student Hub for advice.
Please find a link to the EC policy below:
Extenuating CircumstancesAcademic Misconduct
Any submission must be your own work and, where facts or ideas have been used from other sources, these sources must be appropriately referenced. The Universitys Academic Handbook includes the definitions of all practices that will be deemed to constitute academic misconduct. You should check this link before submitting your work.
Procedures relating to student academic misconduct are given below:
Academic MisconductEthics Policy
The work being carried out must be in compliance with the university Ethics Policy. Where there is an ethical issue, as specified within the Ethics Policy, then you will need an ethics release or ethics approval prior to the start of the project.
The Ethics Policy is contained within Section 2S of the Academic Handbook:
Ethics PolicyGrade marking
The University uses an alpha numeric grade scale for the marking of assessments. Unless you have been specifically informed otherwise your marked assignment will be awarded a letter/number grade. More detailed information on grade marking and the grade scale can be found on the portal and in the Student Handbook.
Grade Marking Scale
Guidance for online submission through Solent Online Learning (SOL)
Online Submission
Solent University - Computing - Faculty of Business, Law and Digital Technologies
Project Outline
(Formative Assessment Task- Not Graded)
Name Course Project Title Weekday/Weekend What area does your project fall within?
Business Applications Business Analysis Computer systems Cyber security
Data science Digital design Internet of things Networking
Software engineering User experience (UX) Web development Web design front-end
Other please specify: What research question needs exploring or what problem/hypothesis will you be testing?
Background/context Why are you doing this project?
In what ways you are using technology and innovation to address your research question or hypothesis? Is there already something similar? If so, how is your idea/approach different?
What methods do you intend to use in order to evaluate your project and how will you ethically collect data?
How does your chosen topic relate to your degree title?
Areas of Challenge - In what areas will you need to develop new knowledge and/or skills to complete this project? How will you learn these skills?
Please use this form to draft out Project Outline when completed should not be longer than 2 sides A4.
Email the completed form to
Email Address Chathurika.goonawardane@qa.comMake sure you have a bibliography list of all useful quality sources and a logbook & project library for when you first meet your project supervisor following the selection process
Recommended Project Ideas
21. Task Management App: Develop an app that helps students manage their tasks and assignments effectively. The app can include features like task creation, prioritization, due date reminders, and progress tracking to help students stay organized and meet deadlines.
8. Budgeting and Expense Tracking App: Design an app that helps students manage their finances effectively. It can include features like expense tracking, budget planning, bill reminders, and visualizations to help students monitor their spending habits.
37. Student Discounts and Deals App: Design an app that curates and displays exclusive discounts and deals available to students from local businesses or online retailers. The app can include features like location-based offers, deal notifications, and user reviews.
20. Virtual Tutoring App: Create an app that connects students seeking tutoring assistance with qualified tutors. The app can include features like subject-specific tutoring sessions, scheduling, progress tracking, and secure payment options to facilitate virtual tutoring sessions.
27. Campus Lost and Found App: Design an app that helps students report lost items and reunite with their belongings on campus. The app can include features like item description, photo uploads, search functionality, and notifications when a match is found.
32. Campus Feedback App: Create an app that allows students to provide feedback on various aspects of campus life, such as courses, facilities, and services. The app can include features like surveys, ratings, and comment sections to gather feedback and improve the overall student experience.
34. Study Room Booking App: Build an app that enables students to book study rooms or quiet spaces on campus. The app can include features like room availability, reservation management, and notifications to help students secure dedicated study spaces.
SOUTHAMPTON SOLENT UNIVERSITY
1865630253357
BSc (Hons) Computing
Project Progress
Author: 10152420
Tutor's Name: Dr. Ajmal Gharib
Assessment Title/Type: Project Progress/AE1
Module Title: Dissertation Project
Contents
TOC o "1-3" h z u 1.Introduction PAGEREF _Toc150532036 h 31.1 Background PAGEREF _Toc150532037 h 31.2 Problem Statement PAGEREF _Toc150532038 h 31.3 Aims and Objectives PAGEREF _Toc150532039 h 41.4 Research Question PAGEREF _Toc150532040 h 42.Project Evaluation (Methods) PAGEREF _Toc150532041 h 43.Project Progress PAGEREF _Toc150532042 h 64.Project Management PAGEREF _Toc150532043 h 74.1 Assessment & Discussion of Risks/Contingency Planning: PAGEREF _Toc150532044 h 74.2 Selection and Timing Including Appropriate Project Milestones: PAGEREF _Toc150532045 h 85.What Next? PAGEREF _Toc150532046 h 9References List PAGEREF _Toc150532047 h 11Bibliography PAGEREF _Toc150532048 h 13
Introduction1.1 BackgroundJavaScript tools and frameworks have changed web development over the past decade, making possible dynamic and responsive user interfaces. These include React, a prominent JavaScript library for designing user interfaces. React prioritizes the view layer above Angular and Vue. This concentrated approach helps React create engaging and visually beautiful user interfaces, making it a popular choice among developers (Ikkala et al., 2022).React's feature is its virtual DOM (Document Object Model), which streamlines rendering by updating only the essential interface components when data changes. React apps load faster and are more responsive with this rendering method. React is now famous for developers who want to build interactive web apps with smooth user experiences (Thakkar, 2020).
Web development technologies are chosen based on their strengths, weaknesses, and compatibility with project needs. Unlike Angular, React lacks built-in features, requiring external libraries or tools to fulfil particular functions. Despite this, React's simplicity, versatility, and dynamic ecosystem keep it popular (Rane et al., 2021).ReactDOMServer handles server-side rendering efficiently. Server-side rendering is essential for SEO and web application loading performance. React speeds up user experience by rendering and transmitting HTML on the server to the client (Meredova, 2023).ReactDOMServer helps achieve this goal, making React a good choice for SEO-focused and fast-loading projects.
1.2 Problem StatementOnline developers have many options for designing interactive and efficient online apps due to the rapid advancement of web technologies. React is a popular library in this diversified JavaScript world for its view layer focus and speedy virtual DOM implementation. Despite its benefits, developers must choose the right technology for their projects. React's advantages and disadvantages compared to Angular and Vue are still debated. The issue is Understanding React's suitability for constructing high-performance, scalable, and stable online applications (Wernersson and Sjlund, 2023). More comparison research is needed to ensure developers can choose React over alternative frameworks. It must be thoroughly investigated to understand how ReactDOMServer's server-side rendering affects web application performance, notably initial loading times and SEO. This study will compare React to popular JavaScript frameworks to fill this gap (Kalua et al., 2018).React's web development advantages and disadvantages and performance differences are examined. Developers can also learn about ReactDOMServer server-side rendering from the study. Web development technologies evolve with application needs. Developers must match tools and technology to project goals. React must be compared to Angular and Vue (Kabeyi, 2019). Developers may choose the optimal solution for their use cases by comparing performance and React's advantages and disadvantages.
1.3 Aims and ObjectivesThe aim of the proposed study is to assess React's capabilities for developing high-performance, scalable, and maintainable web apps.
To compare the performance of React to other popular JavaScript frameworks, such as Angular and Vue.
To identify the advantages and disadvantages of using React for building web applications.
To explore the use of ReactDOMServer for server-side rendering in React applications.
1.4 Research QuestionHow does React compare to other popular JavaScript frameworks in terms of performance, scalability, and maintainability for building high-performance web applications?
Project Evaluation (Methods)2.1 Strategy for gathering literature Review:
A thorough literature review has assessed React's viability and compared it to other major JavaScript frameworks. The first stage was a thorough analysis of web development literature, scholarly publications, and research papers on React, Angular, and Vue from credible magazines and conferences. Google Scholar, Elsevier, Scopus, IEEE, and Science Direct databases were used. Literature review keywords included "React," "Angular," "Vue," "web development frameworks," "virtual DOM," "server-side rendering," and "JavaScript performance." These terms were chosen to focus the research on leading JavaScript frameworks' comparative analysis, performance evaluation, and web development applications (Marx-Raacz Von Hidvg, 2022). This exhaustive review revealed each framework's strengths, shortcomings, and distinctive traits, forming the study's foundation. Developer community polls were also done to assess sentiment and preferences for various frameworks. Experienced professionals and industry experts were surveyed. These surveys yielded quantitative and qualitative data on problems, performance expectations, and use-case scenarios. This multimodal approach ensured a full grasp of React and its equivalents' practical ramifications and user experiences. React, Angular, and Vue web apps were also audited (Paleyes et al., 2022). The audits sought to discover performance, scalability, and maintainability issues. The study examined real-world applications to understand developer problems and how framework decisions affect end-user experience.
2.2 Evaluation and Organisation of collected Information:
The information gathered was subjected to a comprehensive examination procedure to guarantee its relevance, correctness, and dependability. Each source was evaluated critically based on the publication's trustworthiness, the author's reputation, and the research methodology used. The results of the literature research, questionnaires, and audits were methodically compiled and categorized to allow for a systematic analysis (Horsman, 2018). The organised data was then evaluated and reviewed in light of acceptable guidelines, legal and ethical issues, and industry best practices. This assessment aided in the identification of trends, patterns, and emerging practices in the web development industry. Furthermore, the approaches, tools, frameworks, and platforms employed in the surveyed applications were assessed to comprehend their impact on overall performance and user satisfaction. Technical and design procedures were documented during the testing phase, including developing React's server-side rendering via ReactDOMServer. This testing enabled a hands-on examination of React's capabilities, providing valuable insights into its effectiveness in real-world circumstances (Abu-Rumman et al., 2022). To create relevant conclusions from the surveys, statistical tests such as regression and co-relation will be performed, and SPSS will be used to run these tests resiliently. Furthermore, test results, performance metrics, and user input were captured and examined to generate relevant findings.
Project ProgressThe first phase of this research comprised a thorough review of scholarly articles, research papers, and existing literature on React, Angular, and Vue. This comprehensive literature analysis laid the groundwork for understanding these frameworks' essential principles, strengths, and shortcomings. Prior research gave critical theoretical insights into React's virtual DOM, its server-side rendering capabilities enabled by ReactDOMServer, and its performance metrics compared to competing frameworks (Meredova, 2023). The literature review has helped lead the investigation of practical implementations and uses of these technologies in web development.
Hands-on experimentation with React's server-side rendering (SSR) technique using ReactDOMServer has been a crucial milestone in our research quest. This procedure thoroughly examines SSR implementation, particularly emphasising improving initial loading speeds and search engine optimisation (SEO) for online apps. The complications of SSR implementation were recorded using systematic technical procedures, highlighting encountered challenges and their associated resolves (Emara et al., 2021). Preliminary test results indicate promising improvements in application loading speed and SEO optimisation. However, it is critical to highlight that these findings are preliminary and rigorous testing is presently being conducted to evaluate the consistency and dependability of these benefits across varied scenarios.
Concurrently, continued efforts are oriented toward developing survey questions and systematically collecting relevant data for audits. The surveys, now in the questionnaire creation stage, are methodically designed to elicit nuanced developer feedback. These insights cover web development framework preferences, problems, and expectations. Concurrently, meticulous information gathering for audits is underway (Appelbaum et al., 2018). This phase thoroughly examines existing web apps built with React, Angular, and Vue. This research intends to validate theoretical knowledge with empirical evidence by connecting with the developer community and critically reviewing real-world applications, offering a complete understanding of these frameworks' performance and usability elements (Brieger et al., 2020).
Looking ahead, the study's trajectory includes the completion of surveys, the execution of extensive audits, and the improvement of SSR trials. Integrating theoretical knowledge, empirical insights from surveys and audits, and actual experimentation results will aid in synthesising comprehensive findings about React's viability in building high-performance, scalable, and maintainable online applications (Bahraini et al., 2020). This research initiative aims to significantly contribute to web development by helping developers make well-informed framework selections.
Project Management4.1 Assessment & Discussion of Risks/Contingency Planning:A comprehensive assessment of potential hazards and contingency planning is critical in the closing stages of this project to ensure its successful conclusion. One of the critical hazards is the availability and dependability of audit data sources. To mitigate this, the researcher continually investigates different sources and develops backup strategies, such as widening the pool of applications under consideration (Alkaissy et al., 2022). Another significant danger is the ever-changing nature of web development technologies. To solve this, the project plan contains regular updates and changes, allowing new frameworks or approaches to be flexible. There is also a danger linked with the accuracy of survey responses. Robust survey design strategies, such as clear and brief questions, are being used to improve the data quality, reducing the margin for misinterpretation. There are also contingency plans for unexpected delays caused by technological difficulties or unforeseen circumstances. If necessary, the researcher is ready to devote additional resources and extend the project deadline to ensure that the quality of the research is maintained. Researcher have created regular communication channels, allowing for the rapid identification and resolution of any difficulties that may develop during the final stages (Cooper and Sommer, 2018). Furthermore, continual monitoring of project progress enables early discovery of potential dangers, permitting proactive decision-making to prevent negative consequences.
4.2 Selection and Timing Including Appropriate Project Milestones:The timely and planned scheduling of the project's tasks is essential to its practical administration. The 400 hours allotted for this project have been wisely divided across several activities, guaranteeing a methodical and balanced approach. The following table outlines the key project milestones, illustrating the breakdown of hours dedicated to each task:
Milestone Hours Allocated Status
Literature Review 100 Achieved
Survey Development 50 Under Progress
Audit Information Gathering 70 Under Progress
Server-Side Rendering Testing 80 Partially Achieved
Data Analysis and Synthesis 60 Not Started
Report Writing and Finalization 40 Not Started
These milestones form the project's backbone, directing the researcher through the research process. The primary phases are the literature review, survey development, and audit information gathering, which lay the platform for further in-depth studies. Significant time is allotted to comprehensive testing of server-side rendering and meticulous data analysis, reflecting the complexity and criticality of these jobs. The latter steps involve synthesizing the collected data into a thorough report, ensuring the findings are presented coherently and conclusively. The project will move forward quickly if these milestones are met, as well as continual risk assessment and contingency preparation. The researcher hopes to produce a rigorous and insightful analysis by painstakingly handling the project's complexities, significantly contributing to web development frameworks.
The second part of the project involves a strategic and systematic implementation approach, building on the progress accomplished in the previous stages. The implementation plan thoroughly addresses key study objectives by leveraging insights from the literature analysis, ongoing surveys, and the early stages of server-side rendering experiments.
What Next?1) Completion of the survey and data analysis:
The current survey development will be conducted thoroughly, ensuring the questions are transparent, objective, and targeted to elicit nuanced insights from the developer community. Once completed, the surveys will be distributed to participants, including new developers, experienced professionals, and industry experts. The collected replies will be rigorously analyzed using statistical tools such as regression and correlation, which will be facilitated by software such as SPSS. This in-depth examination reveals patterns, preferences, and issues developers encounter while working with React and other frameworks while offering significant qualitative and quantitative data.
2) Extensive Audit Analysis:
Concurrently, the audit information-gathering procedure will be accelerated. Real-world applications built with React, Angular, and Vue will be scrutinized for performance bottlenecks, scalability concerns, and user experience issues. The researcher will get significant insights into the practical ramifications of framework choices through in-depth code reviews and usability testing. The findings of these audits will be reviewed alongside the survey results, adding empirical evidence to the research.
3) Advanced Rendering Optimisation on the Server:
The server-side rendering testing phase will be expanded, emphasising sophisticated optimization approaches. This will entail experimenting with various ReactDOMServer setups, caching techniques, and rendering strategies. The research attempts to maximise efficiency improvements in initial loading times and SEO optimization by fine-tuning the server-side rendering process. A comparison of these improvements between React, Angular, and Vue will provide a more nuanced knowledge of each framework's capabilities in real-world circumstances.
4) Analysis of Comparative Performance:
The comparative performance analysis is at the heart of the project. Extensive performance testing will be performed, with elements like rendering speed, memory utilization, and responsiveness measured across various scenarios and application complexities. The results will be rigorously studied and compared, demonstrating React's strengths and weaknesses compared to its competitors, Angular and Vue. This analysis will be based on real-world data obtained through surveys, audits, and hands-on testing, confirming its practicality.
5) Report Synthesis and Documentation:
Concurrent with the research efforts, detailed documentation outlining each phase's methodology, tools, and findings will be kept. This documentation will clearly record the study process, allowing for replication and peer evaluation. The collected data, survey insights, audit findings, and performance analysis results will be combined into a cohesive and insightful study report. This paper will comprehensively assess React's appropriateness for high-performance online applications and provide valuable advice for developers and stakeholders.
References ListAbu-Rumman, A., Al Shraah, A., Al-Madi, F. and Alfalah, T., 2022. The impact of quality framework application on patients satisfaction. International Journal of Human Rights in Healthcare, 15(2), pp.151-165.
Alkaissy, M., Arashpour, M., Li, H., Alaghmand, S. and Nezamian, A., 2022. Quantitative analysis of safety risks and relationship with delayed project completion times. Risk analysis, 42(3), pp.580-591.
Appelbaum, D.A., Kogan, A. and Vasarhelyi, M.A., 2018. Analytical procedures in external auditing: A comprehensive literature survey and framework for external audit analytics. Journal of Accounting Literature, 40(1), pp.83-101.
Bahraini, N.H., Matarazzo, B.B., Barry, C.N., Post, E.P., Forster, J.E., Dollar, K.M., Dobscha, S.K. and Brenner, L.A., 2020. Protocol: examining the effectiveness of an adaptive implementation intervention to improve uptake of the VA suicide risk identification strategy: a sequential multiple assignment randomized trial. Implementation science, 15, pp.1-12.
Brieger, E., Arghode, V. and McLean, G., 2020. Connecting theory and practice: reviewing six learning theories to inform online instruction. European Journal of Training and Development, 44(4/5), pp.321-339.
Cooper, R.G. and Sommer, A.F., 2018. AgileStage-Gate for Manufacturers: Changing the Way New Products Are Developed Integrating Agile project management methods into a Stage-Gate system offers both opportunities and challenges. Research-Technology Management, 61(2), pp.17-26.
Emara, M., Hutchins, N.M., Grover, S., Snyder, C. and Biswas, G., 2021. Examining Student Regulation of Collaborative, Computational, Problem-Solving Processes in Open-Ended Learning Environments. Journal of Learning Analytics, 8(1), pp.49-74.
Horsman, G., 2018. Framework for Reliable Experimental Design (FRED): A research framework to ensure the dependable interpretation of digital data for digital forensics. Computers & Security, 73, pp.294-306.
Ikkala, E., Hyvnen, E., Rantala, H. and Koho, M., 2022. Sampo-UI: A full stack JavaScript framework for developing semantic portal user interfaces. Semantic Web, 13(1), pp.69-84.
Kabeyi, M.J.B., 2019. Evolution of project management, monitoring and evaluation, with historical events and projects that have shaped the development of project management as a profession. Int J Sci Res, 8(12), pp.63-79.
Kalua, M., Troskot, K. and Vukeli, B., 2018. USPOREDBA FRONT END FRAMEWORKA ZA IZRADU WEB-APLIKACIJA. ZbornikVeleuilita u Rijeci, 6(1), pp.261-282.
Marx-Raacz Von Hidvg, T., 2022. Are the frameworks good enough?: A study of performance implications of JavaScript framework choice through load-and stress-testing Angular, Vue, React and Svelte.
Meredova, A., 2023. Comparison of Server-Side Rendering Capabilities of React and Vue.
Paleyes, A., Urma, R.G. and Lawrence, N.D., 2022. Challenges in deploying machine learning: a survey of case studies. ACM Computing Surveys, 55(6), pp.1-29.
Rane, S.B., Potdar, P.R. and Rane, S., 2021. Development of Project Risk Management framework based on Industry 4.0 technologies. Benchmarking: An International Journal, 28(5), pp.1451-1481.
Thakkar, M., 2020. Building React Apps with Server-Side Rendering. Use React.
Wernersson, D. and Sjlund, V., 2023. Choosing a Rendering Framework: A Comparative Evaluation of Modern JavaScript Rendering Frameworks.
BibliographyAppendix A Draft Literature Survey
Building maintainable web applications using React An evaluation of architectural patterns used in Canvas LMS
AbstractOnline application development, specifically React and Canvas LMS architectural patternswas the focus of this research. This study tested if these fundamental principles of architecture could be used to build easy-to-maintain web apps using React. The study assessed React's capabilities for developing architectural patterns used in Canvas LMS. The study emphasised onquantitative dataand usedsurveys for collecting data. One hundred developer professionals and industry experts were surveyed. The survey collected relevant information regarding Canvas LMS React and architectural pattern use. Regression and correlation analysis wereused to analyse variable associations in the study. The study found a strong positive correlation between Redux and MobX state management frameworks. These frameworks also improved React code modularity, simplicityand structure. React has demonstrated that it is capable of building maintainable web apps. This study shows Canvas LMS's extensive use of React and architectural patterns. These recommendation canhelp developers construct and manage web apps.
Table of Contents
TOC o "1-3" h z u Abstract PAGEREF _Toc154086987 h 2CHAPTER 1: INTRODUCTION & BACKGROUND PAGEREF _Toc154086988 h 51.1 Background PAGEREF _Toc154086989 h 51.2 Problem Statement PAGEREF _Toc154086990 h 61.3 Aims and Objectives PAGEREF _Toc154086991 h 61.4 Research Question PAGEREF _Toc154086992 h 71.5 Scope of research PAGEREF _Toc154086993 h 71.6 Dissertation structure PAGEREF _Toc154086994 h 7CHAPTER 2: LITERATURE REVIEW PAGEREF _Toc154086995 h 92.1 Introduction PAGEREF _Toc154086996 h 92.2 React performance and capability in building maintainable web applications. PAGEREF _Toc154086997 h 92.3 Advantages and disadvantages of using React for building architectural patterns used in Canvas LMS. PAGEREF _Toc154086998 h 112.3.1 Advantages PAGEREF _Toc154086999 h 112.3.2 Disadvantages PAGEREF _Toc154087000 h 112.4 Use of React in building architectural patterns used in Canvas LMS. PAGEREF _Toc154087001 h 122.5 Theoretical framework PAGEREF _Toc154087002 h 132.6 Conceptual Framework PAGEREF _Toc154087003 h 142.7 Conclusion PAGEREF _Toc154087004 h 15CHAPTER 3: METHODOLOGY PAGEREF _Toc154087005 h 163.1 Adopted Methods PAGEREF _Toc154087006 h 163.1.1 Research philosophy PAGEREF _Toc154087007 h 163.1.2 Research approach PAGEREF _Toc154087008 h 173.1.3 Research design PAGEREF _Toc154087009 h 173.2 Data Collection and research instruments PAGEREF _Toc154087010 h 183.3 Data Analysis PAGEREF _Toc154087011 h 193.4 Professional, Legal and Ethical issues PAGEREF _Toc154087012 h 203.5 Project management PAGEREF _Toc154087013 h 20CHAPTER 4: DESIGN AND IMPLEMENTATION PAGEREF _Toc154087014 h 224.1 Implementations PAGEREF _Toc154087015 h 23CHAPTER FIVE: RESULTS PAGEREF _Toc154087016 h 265.1 Introduction PAGEREF _Toc154087017 h 265.2 Demographics PAGEREF _Toc154087018 h 265.3 Correlation Analysis PAGEREF _Toc154087019 h 275.4 Regression analysis PAGEREF _Toc154087020 h 295.5 Reliability analysis PAGEREF _Toc154087021 h 315.5 Discussion PAGEREF _Toc154087022 h 325.6 Chapter summary PAGEREF _Toc154087023 h 34CHAPTER SIX: CONCLUSION PAGEREF _Toc154087024 h 35CHAPTER 7: RECOMMENDATION PAGEREF _Toc154087025 h 37References PAGEREF _Toc154087026 h 39
CHAPTER 1: INTRODUCTION & BACKGROUND1.1 BackgroundIn recent years, there has been a huge change in the improvement of web applications. The formation of maintainable and adaptable arrangements require detailed attention. Given the variety of JavaScript libraries and frameworks accessible, React with its component-based architecture and declarative syntax has become one of the most famous in comparison to the other libraries or framework (Ivanova and Georgiev, 2019). Considering online learning management systems (LMS) like canvas, the issue is that it needs to fabricate applications that not only answer the continually changing learning enviorment yet additionally adjust with goals of viability and extensibility required to develop complex systems used in architectural patterns of Canvas LMS (Colby, 2020).
The growth of complex web applications have made maintainability a big factor. Large-scale codebases demand work, and badly designed applications may suffer from duplication of code, difficulties in adding new features or bug fixes (Rahman, 2021). In this environment, the advent of Java-based frameworks such as React has opened up new prospects for developing maintainable web applications. Its component-based paradigm breeds reusability, modularity and better developer experience which would seem to result in more maintainable code. Canvas LMS, a widely used open-source learning management system (LMS), provides an interesting example of analyzing the architecture patterns in React applications (Sharma, 2021). Canvas has a very rich feature set, and also many users; it is thus an intricate evolving web application. This recent move to React gives an opportunity for reflecting on the maintainability of adopted architectural patterns.
Within the React ecosystem, several architectural styles have developed. Each style provides a different way to organize and structure code. Redux and MobX are examples of common patterns. These patterns are designed to solve problems like state management, data flow and communication between components. Ideally these patterns help make code much more organized, readable and modular (Ventura, 2021). Yet choosing and carrying out suitable patterns for a given application can be one of the most difficult tasks. Application size, complexity of features involved and other such aspects all need to be taken into account. Furthermore, the degree to which these patterns are effective with regard to maintainability is not generally agreed upon (Bogner et al., 2020). In particular for large and ever-changing applications such as Canvas LMS, this effectiveness has yet to be proven.
1.2 Problem StatementIn the field of web application development, React is a highly recognized framework which provides for animated and high-performance UI (user interfaces). But as the complexity of web applications increases, so does the difficulty in maintaining them. With online technologies constantly evolving, developers of interactive and effective applications have many choices (Szymkowiak et al., 2021). In this diverse JavaScript world, the popular React library focuses on its view layers and implements a high-speed virtual DOM. Although usage is cost-free, developers must pick the appropriate technology for their projects. The question is whether React can be used to build high-performing, scalable and stable architectural patterns used in Canvas LMS (Satrom, 2018).
Although React has become the nearly universal standard for modern Web development, there is a serious lack of knowledge in regard to systematic evaluation of architecture patterns within applications specifically from maintainability perspective (Banijamali et al., 2020). Although there are numerous studies on React and a myriad of architectures, the lack of research that tackles these patterns specifically in their application to systems like Canvas LMS makes it clear that further evaluation is needed. The objective of this research was to fill the gap between theory and practice by taking an extensive evaluation on Canvas LMS's architecture, really focusing on how React capacities influence maintainability (Lundberg, 2023). The study accentuation on giving practical and logical bits of knowledge to developers who used React-based architectural patterns for Canvas LMS.
1.3 Aims and ObjectivesThe aim of the proposed study is to assess React's capabilities for developing architectural patterns used in Canvas LMS.
To evaluate the performance of React in building maintainable web applications.
To identify the advantages and disadvantages of using React for building architectural patterns used in Canvas LMS.
To explore the use of React in building architectural patterns used in Canvas LMS.
1.4 Research QuestionHow effectively can React be used to develop and assess the maintainability of architectural patterns within the Canvas LMS environment?
1.5 Scope of researchThis research examines React and architectural trends in Canvas LMS. The purpose is to thoroughly assess architectural choices for improving Canvas LMS, a popular education platform (Takala, 2023). The study examined Canvas LMS architectural patterns and their effects on web application maintainability. In Canvas LMS, component architecture, state management, data stream, and other React development topics must be thoroughly examined (David, 2020). The study compares architectural patterns' maintainability strengths and shortcomings. A detailed review of how architectural decisions affect codebase adaptability, analysis ease, and application ability to meet shifting requirements is required (Mrquez and Astudillo, 2018). Additionally, this study clearly outlines its scope and impact. The research's insights and recommendations can benefit React application developers, especially in education. This article targets individuals implementing React for Canvas LMS (PeaAyala, 2018). This study shed light on architectural choices in online application development, particularly educational technology.
1.6 Dissertation structureChapter 1: Introduction: It introduced the research problem, objectives and scope.
Chapter 2: Literature Review: This chapter examined React framework web application maintainability and architectural patterns used in Canvas LMS.
Chapter 3: Methodology: It provides detail the research design, data collection, analysis methods and ethical considerations.
Chapter 4: Design and Implementation: This chapter discusses design choices, implementation details, integration of architectural patterns in Canvas LMS.
Chapter 5: Results: This chapter provides analytical findings while correlating results with research objectives.
Chapter 6: Conclusion: This chapter summarises key findings.
Chapter 7: Recommendations: This chapter provides practical guidelines for developers, suggest industry best practices and outline potential areas for further exploration.
CHAPTER 2: LITERATURE REVIEW2.1 IntroductionThis chapter firstly discusses the performance and capability of the react in building of maintainable web application. It further discusses its advantages and disadvantages especially in building architectural patterns which are used in Canvas LMS. Further, the chapter discusses the use of react in building architectural patterns used in canvas LMS. Lastly, the theoretical framework and conceptual framework is provided.
2.2 React performance and capability in building maintainable web applications.React's prominence in building viable web applications is irrefutable. The part-based engineering of React, virtual DOM and unidirectional data stream empower developers to make secluded, reusable, less complex, and adjustable code. React code redundancy and complexity are a vital worry in Canvas LMS (Flovn, 2020). In contrast, components of React advance modularity, the sheer volume of code inside an enormous application can prompt copied functionalities and multifaceted part connections. This makes code harder to explore and refactor, affecting viability. To address this, developers can use code-dividing strategies to separate the application into more modest pieces stacked just when required (Islam et al., 2022). Also, libraries like React.memo can be utilised for part memoisation, decreasing pointless re-delivers and supporting execution.
Another critical point is React state management. The application state is managed in a manageable and centralised manner by libraries such as Redux and MobX. Managing the global state across complex components becomes an issue in Canvas LMS. Redux also brings clarity and predictability with its unidirectional data flow and a single source of truth (Kudiabor 2020). However, its standard code and steep learning curve can be obnoxious to learners, in contrast to MobX which gives a more direct reactive methodology, whose adaptability may sometimes prompt misuse and accidental secondary effects. Which library to pick relies upon the necessities of a Canvas LMS improvement group and how much state management is required (Robinson et al., 2021).
As well as arranging code and utilising libraries, React's modularity is essential to maintainability. Code coherence and reusability improve when components are isolated into more modest, more engaged units with evident limits. Modularity gives the Canvas Learning Management System (LMS) a few capacities and capabilities. Canvas LMS is more successful and adaptable because of its secluded design. This method encourages code cleanliness and developer collaboration. Canvas LMS should consider React's performance. The virtual DOM is efficient, but nesting components and maintaining complicated states can cause performance concerns. These issues can cause performance constraints. Memoisation, code splitting, and lazy loading can improve performance. Strategically using these methods may increase software efficiency and effectiveness. Developers can reduce duplicate computations by memoising expensive function call results and retrieving them when needed. Code splitting lets developers break up their codebase for faster loading and better user experience. Lazy loading reduces initial loading times and optimises performance by loading components and resources only when needed. Include these strategies in their development process and employ profiling tools to discover performance bottlenecks and guide optimisation (Kainu, 2022). Careful consideration is needed to balance performance and maintainability within Canvas LMS's requirements.
Furthermore, React's unidirectional data stream guarantees an unmistakable and unsurprising state management instrument. Utilising a single source of truth for the application state upgrades its maintainability by diminishing the probability of bugs and irregularities emerging from complex data connections (Le, 2021). Developers can follow and investigate all the more easily, smoothing out the support cycle and limiting the risk of presenting accidental aftereffects during updates or adjustments. Canvas LMS fills in as a certifiable contextual investigation for assessing React's viability in building viable web applications. The Learning Management System's many-sided design requires a structure that can flawlessly deal with the complexity of instructive stages (Adkins et al., 2020). React's capacity to deal with the state and productively update the UI adjusts well to the prerequisites of such systems, where continuous updates and associations are vital. By taking apart the architectural patterns utilised in Canvas, LMS can recognise best practices and likely traps, offering essential bits of knowledge for developers looking to upgrade the maintainability of their web applications (David and Syriani, 2023).
2.3 Advantages and disadvantages of using React for building architectural patterns used in Canvas LMS.2.3.1 AdvantagesUtilizing React to apply Canvas LMS architectural patterns has many advantages. It improves on the making of web applications that are simpler to keep up with and construct. React's clear and coordinated component-based component building strategy is one of its core strength (Nguyen Nhat, 2018). Developers can make an efficient and reusable codebase by dismantling the UI into measured components with novel capabilities. Isolating a system into its segments works on its creation and support. Changing a component of an element does not influence the whole substance, making it simple to keep up with and continually modern (Vasilakis et al., 2018).
React's virtual DOM system is one more fundamental advantage for building Canvas LMS architectural patterns. The virtual DOM restricts the prerequisite for customary updates to the actual DOM, smoothing out execution by unequivocally conveying simply the parts influenced by a change of state (David, 2020). This efficiency is particularly crucial for a Learning Management System like Canvas, where continuous communications and updates are inescapable. The better show ensures a smooth client experience and all the while diminishes the probability of execution-related issues that could obstruct the overall maintainability of the application (Chung et al., 2023).
React's unidirectional data flow simplifies state management and provides a consistent framework for handling data across the application. This method helps detect and fix mistakes and ensures that the codebase can be handled and updated in the future (Evergreen, 2023). Developers can better track and understand data flow, reducing application faults and inconsistencies. This benefit is crucial in a sophisticated system like Canvas LMS. Strong state management is essential in handling a wide range of user interactions and massive data operations.
2.3.2 DisadvantagesWhile React offers areas of strength for a for building maintainable web applications, its utilization in creating architectural patterns for Canvas LMS isn not without certain limitations. One surprising drawback begins from the natural complexity that can arise in React applications as they scale (Thomas et al., 2018). The specific part-based approach, while priceless for affiliation and reusability, can sometimes provoke astounding dominance hierarchies and associations between parts. Concerning Canvas LMS, a tremendous and diverse educational platform, managing this complexity transforms into an earnest idea. The versatile interdependencies between parts may conceivably confuse or further complex the overall system and, consequently, impact the maintainability of the application over the long term (Seaborn et al., 2021).
React for Canvas LMS also requires certain expertise and experience. React's component-based architecture has many advantages, yet it requires a change in perspective in UI design which can only be adhered by expereienced developers (Derakhshanmanesh et al., 2019). For projects with tight cutoff times or deadlines, gathering developers who are skilled might be a vital issue. React's ability to manage data and application state can have positive and negative effects. The framework lets developers use local state, the context API, and external state management libraries to manage application state (Coronado et al., 2022). This technique is flexible enough to satisfy many project goals, but it can generate problems if not handled correctly. A consistent and systematic approach to information management in Canvas LMS is crucial (Estill, 2019). Different job techniques may impair teamwork and maintenance troubleshooting.
2.4 Use of React in building architectural patterns used in Canvas LMS.Canvas LMS, a significant and vigorous learning management system, is significantly beneficial because of its accentuation on flexibility and personalisation. The complex cluster of structures and user interactions (UI) requires solid and strong design, which React effectively offers. Its natural capacities makes it an ideal decision for making sensible components inside Canvas (Peng et al., 2019). The component-based architecture is a vital piece of React's supportiveness. Isolating the LMS into specific accumulated components is joined with Canvas' deliberate complexities. Each course, errand, or client profile is treated as an independent element in React, which works on the clarity and segment of code hence making it a suitable option to build Canvas LMS. Developers can investigate and change individual components without directly affecting the general system (Kruk et al., 2018). This modularity advances joint effort by empowering many groups to work simultaneously on various platform bits. It also works on the most common way of rectifying bugs and changing the platform's elements.
Unidirectional data flow is vital to React. User interactions with Canvas and API requests cause complex changes to numerous components. Controlled flow provides essential predictability (Paul and Nalwaya, 2019). Redux provides an authoritative and centralised application state repository. This prevents program-wide inconsistent states and ensures components receive relevant changes. Despite its repetitive code, the centralised technique controls state management. This is important in complex systems like Canvas (Franklin and Duran, 2023). React excels at architectural patterns outside its components. Canvas used the Container-Presentational paradigm to separate user interface and business logic efficiently. This method helped isolate the application's essential functionalities from its visual presentation. The team used this paradigm to ensure that user interface changes would not affect business logic. Presentational components merely render; containers manage state and fetch data. This strategy clarifies roles and promotes code reuse (Lacerda et al., 2020). Programmers use Higher-Order Components (HOCs) to share capabilities amongst components efficiently. This strategy streamlines development and reduces code duplication, making it more efficient and understandable.
However, React's versatility can introduce challenges when applied to a tremendous platform like Canvas. Code redundancy might happen if modularity is not fastidiously controlled. Strategies such as memoisation and code parting are significant for advancing memory use and improving execution (Allioui and Mourdi, 2023). Moreover, managing worldwide states in a convoluted system, for example, Canvas, requires vast consultation. In spite of the fact that libraries, for example, Revival, offer association, extreme reliance on them can bring about bulky state trees and complexity. Striking a suitable balance between incorporated organisation and component independence is significant. It is vital to specify that React's exhibition is a basic calculation of the progress of Canvas (Cornito, 2021). It is pivotal to consider enhancing component refreshes, utilising slow stacking for highlights that are not utilised, and assessing execution bottlenecks. Improving data-getting methods and limiting unnecessary re-renders can enormously upgrade client experience in the asset-escalated setting of a Learning Management System (LMS) (Pham, 2023).
2.5 Theoretical frameworkThe Software Architecture Theory stresses the meaning of planning and coordinating software systems in a manner that aligns with the general objectives of maintainability, versatility, and flexibility. Regarding this study, the Software Architecture Theory gives a calculated focal point to examine and assess the architectural patterns utilized in Canvas LMS. This perplexing web application works with the React framework (Dragievi and Bonjak, 2019). The central views of the Software Architecture Theory underline the requirement for a very organized and measured architecture to upgrade software systems' life span and maintainability. By utilizing this theory to look at Canvas LMS, the review attempts to sort out how the architectural patterns, impacted mainly by React, help or hurt the web application's general maintainability (Soares-Robinson, 2018). The theory directs the assessment of how the picked architectural patterns line up with standards like modularity, division of worries, and versatility, which are all crucial components in making maintainable web applications.
The study of Software Architecture Theory helps detect architectural compromises. This study examines how Canvas LMS architecture decisions affect application development and maintenance. According to Messinger and qvist (2023), architectural choices affect the development and maintenance of the Canvas LMS. The theory allows for formal analysis of Canvas LMS deployment, adaptation, and architectural pattern issues. Ralph (2018) proved software architecture theory and solidified software design notions. The material provides a complete foundation for determining software system standards. These standards help build and maintain sustainable, manageable web apps. This speculative framework examined Canvas LMS architectural patterns and showed how they help build a strong React web app.
2.6 Conceptual Framework-12699-317499React Capabilities
React Capabilities
-12699114300React code redundancy and complexity
React state management libraries (Redux and MobX).
React Code organisationandmodularity
React code redundancy and complexity
React state management libraries (Redux and MobX).
React Code organisationandmodularity
3454400165100Maintainability of Architectural patterns usedinCanvasLMS
Maintainability of Architectural patterns usedinCanvasLMS
21971003048002197100304800
3860800139700Dependent variable
Dependent variable
241300139700Independent variables
Independent variables
2.7 ConclusionIn a nutshell, the component-based architecture is a vital piece of React's supportiveness The component-based structure of React, its use of virtual DOM and unidirectional data flow make it much better suited to code management and speeding things up.On the other hand, there are also several negative aspects. Code redundancy is one concern here and a learning curve for implementation may be another problem which needs to be addressed carefully. The Recovery and design principles applied to Canvas LMS are a demonstration of Reacts flexibility.Developers can use code-dividing strategies to separate the application developers to strike a balance with React's versatility.
CHAPTER 3: METHODOLOGY3.1 Adopted Methods3.1.1 Research philosophyResearch philosophy is the foundational beliefs, concepts, and norms that guide research. It includes the principles and attitudes that shape the research approach and methodology. Research philosophy informs judgements and supports study integrity and rigour by offering a firm foundation. Research design, system, and procedures affect the researcher's perspective (Abu-Alhaija, 2019). Positivism is a research philosophy that thinks observation and analysis may reveal data. It stresses objectivity, quantifiability, and generalizability. Positivism holds that accurate knowledge and appraisal can reveal significant information, according to Turyahikayo (2021).
Positivism helps create sustainable React web apps and evaluate architectural patterns in Canvas LMS. Positivism emphasises objectivity and logic (Aldaeej, 2021). Positivism helped academics objectively evaluate React's capabilities in Canvas LMS when studying architectural patterns. This evaluation included presentation, production, and viability. Experimental observation collects quantitative data to evaluate architectural patterns' sustainability effects (Li et al., 2021). Besides, positivism's emphasis on quantifiable data upholds the foundation of generalisable standards. In web application improvement, especially with React, the objective is frequently to recognise best practices that can be applied comprehensively (Sovacool et al., 2018). Positivism's obligation to speculation permits findings from the study to be extrapolated to other web advancement projects utilising React, giving significant bits of knowledge to the more extensive community.
The decision of positivism in this study is valid by the requirement for an organised and objective assessment of React's viability in building maintainable web applications, an errand innately lined up with exact perception and quantifiable measurements (Abdullah et al., 2019). The study includes evaluating explicit results, quantifiable and logical measurements, and the effect of architectural patterns on maintainability all of which positivism obliges through systematic estimation and investigation (Gillani, 2021).
3.1.2 Research approachKapur (2018) defines the research method as the plan or strategy that guides the researcher in data collection, analysis, and interpretation to answer research questions. Different methods are used to conceptualise and draw conclusions from a study. The deductive research method collects and analyses information to test a theory. A general idea or hypothesis is followed by specific facts or observations (Stephens et al., 2018). Reasoning is advantageous due to its structure, ability to examine hypotheses, and potential for good internal validity. Preexisting ideas or hypotheses that need methodical testing work best.
For this study on React, deductive research is appropriate to construct sustainable web apps and Canvas LMS architectural patterns. Initially, it allowed researcher test organised hypotheses on React's ability to build maintainable web apps (Li, 2019). The study examines architectural patterns and maintainability. Logical methods work for systematically examining these theories. The deductive approach is ideal for testing theories with empirical evidence (Pearse, 2019). The deductive method helps online application developers collect data to evaluate software architecture and assumptions. This method uses current principles to ensure thorough testing. This project examines how React is used in Canvas LMS. React's efficacy is objectively assessed in this deductive investigation (von Grafenstein et al., 2022). The research is based on architectural pattern maintainability theories. Canvas LMS data is evaluated to test these hypotheses.
3.1.3 Research designResearch design is a framework for putting together and assessing data in a research project (Asenahabi, 2019). Quantitative research utilizes numerical data and statistical analysis to foster decisions about a phenomenon (Mohajan, 2020). This study utilizes composed surveys to procure numerical data for statistical analysis. Quantitative research has objectivity and flexibility in looking at a more extensive population, unambiguous circumstances and logical results and correlations. This research strategy works on statistical values, variable assessment, and theory testing (Schutt, 2019). WWeb apps that are easy to maintain are built with React, however Canvas LMS is built on architectural patterns which are complex and require logical understanding to comprehend. The researcher utilized React to inspect its effect on system maintainability (Filz et al., 2021). The quantitative methodology was used for systematic assessment because of code redundancy and other quantifiable elements.
Quantitative research designs provide informed speculation based on findings. The study examined the viability of utilising React to build maintainable web apps. The researchercollected numerical data to providesummarisedfindings that describeexperiences beyond contextual analysis. This study used a quantitative research technique because it suited its requirements. React's maintainability must be assessed objectively using numerical data and statistical analysis (Becker et al., 2018). This approach formalises and comprehensively evaluates React's maintainability.
3.2 Data Collection and research instrumentsData collection is the calculated assembling of relevant data for a research examination. This includes carefully gathering and archiving data to respond to questions or test speculations. Primary data gathering includes gathering data straightforwardly from people or original sources for research. The research emphasised on providing insights to effectively use React for web applications and development of Canvas LMS designs. Researcher gathered data for the study by means of surveys. Standardised close ended questions were used to obtain data from a specified population.
Advantages of primary data collection, particularly through surveys, consolidate the ability to adjust research examinations to the specific research targets, procure real-time and numerical data and to assure the relevance of data to the study novel requirement to maintain its reliability (Bentley et al., 2019). Surveys provide a coordinated method for managing quantitative data, engaging the assessment of variables and the examination of patterns. In this review, surveys were directed to gather data clearly from developers related with building web applications using React inside the Canvas LMS systems. The benefits of considering primary data collection through surveys in this study included customization of study to target nuanced perspectives related with architectural patterns. This data is utilized to numerically assess React's showcase and maintainability in Canvas LMS for solid outcomes (Kulkarni, 2022). This invigorated system made sure that data matched research questions and objectives. Surveys were utilised to measure Canvas LMS React and architectural feasibility. A systematic examination of how React impacts maintainability was possible using the quantitative research procedure and study objectives (De Rosis et al., 2020).
Convenience sampling is a type of sampling that is classified as non-probability sampling technique in which rather than using a random or systematic technique of selection, researchers chose participants based on their willingness and availability to participate (Khan, 2020). It is a helpful and time-effective methodology, frequently decided because of down to earth contemplations, like simple involvement of relevant participants. In this study on building maintainable web applications utilizing React and assessing architectural patterns in Canvas LMS, convenience sampling was utilised. The choice to utilize convenience sampling was driven by the openness of participants inside the developer community (Zhang et al., 2020). 100 surveys were performed with experienced experts and industry specialists from the developer community. This strategy considered a timely collection of data from people promptly accessible and able to share their bits of knowledge, giving logical viewpoints on the utilization of React and architectural patterns in real-world web improvement situations.
3.3 Data AnalysisData analysis comprises evaluating, organising, manipulating, and using data to get insights, support decision-making, and find insights. Research data analysis seeks to uncover patterns and trends (Huang et al., 2018). This helps with study findings and conclusions. Statistical tests analyse numerical data from smaller samples to gain insights into large populations (Bruce et al., 2018). These tests help researchers understand data relationships, variationsand trends. Statistical tests produce accurate results, help understand significant populations, and guide data-driven decision-making.
In this study, the researcher utilised statistical tests to survey React web application advancement and Canvas LMS architectural example assessment data. Statistical testing were utilized to look at what architectural patterns mean for maintainability (Uttley, 2019). The study used regression analysis to look at the interaction of independent and dependent variables.This presented the opportunity to evaluate numerical variables affecting React web application assurance in Canvas LMS.Correlation analysis examined the strength and relationship of variables.But it was also necessary to disseminate correlations and recognize patterns in architectural styles (Pereira et al., 2018).The study placed an emphasis on using SPSS to guide statistical tests.Statistical analysis was done with SPSS because of its simple interface and broad range of statistical activities. It was utilised to precisely and proficiently perform regression and correlation analysis on the quantitative data (Abu-Bader, 2021). These tests were performed well with SPSS to break down test results, practical adequacy, and participant's responses to acquire reliable and significant data (Bhattacharya et al., 2023).
3.4 Professional, Legal and Ethical issuesProfessional, legal, and ethical aspects were prioritised meticulously in this study. The involved participants were acknowledged and respected for their time and knowledge. Data protection and privacy issues were considered to avoid legal issues. Participants were informed about the purpose of the research, and informed consent was obtained beforehand. It was informed that the responses will be exclusively utilised for research purposes. Ethical concerns involved protecting study participants' privacy and anonymity purpose. For this, data was securely maintained and stored in a password-protected cloud storage, and access was only accessible to the researcher and supervisor. The data was securely maintained and used only for research purposes. Following these steps ensured that the study provided reliable and trustworthy information.
3.5 Project managementIn this research, systematic project management was followed. The project started with a thoroughly planned structure, from establishing objectives and research questions to point-by-point planning for each step. Another essential function for task circulation was assuring the efficiency of research, preserving an attainable schedule and completing tasks on time. When designing a survey by collecting data or making statistical evaluations, the study first ensured that the questions developed were reviewed and accepted by the supervisor and that the statistical techniques were discussed before the actual execution of the results. The participants stayed on track, and timely surveys were conducted using common communication channels like emails. In-advance meetings with the supervisor were held to help stay on track, solve dilemmas or problems arising during the research study, and make specific changes (Holmlund et al., 2020). A comprehensive and systematic data management system was designed to ensure safe storage and support of collected information. The emphasis was placed on adaptability and time management to handle possible variables or delays that might arise during the work (Javed, 2023). With this nimble approach, they ensured that the project remained on course while also considering ethical
