Faculty of Science and Technology
Department of Computer Science
WEB-BASED MOBILE
APP DEVELOPMENT
CST3145
Module Leader: Luca Piras
Term Autumn 2023
24 weeks
Document Version 01
WEB-BASED MOBILE APP DEVELOPMENT CST3145
2
CST3145_module_handbook_updated_20230831_v01.docx
Online location of handbook
This handbook can also be accessed via My Learning at: link.
Other formats available
This handbook is available in a large print format. If you would like a large print copy
or have other requirements for the handbook, please contact the Disability Support
Service disability@mdx.ac.uk
Disclaimer
The material in this handbook is as accurate as possible at the date of production. You
will be notified of any minor changes promptly. If there are any major changes to the
module you will be consulted prior to the changes being confirmed. Please check the
version number on the front page of this handbook to ensure that you are using the
most accurate information.
Other documents
Your module handbook should be read and used alongside your programme
handbook and the information available to all students on My Learning and UniHub,
including the Academic Regulations. Your programme handbook can be found on the
My Learning programme page for your programme.
WEB-BASED MOBILE APP DEVELOPMENT CST3145
3
CST3145_module_handbook_updated_20230831_v01.docx
Table of Contents
1 Welcome…………………………………………………………………………………………………………….5
2 The module teaching team …………………………………………………………………………………5
3 Communication with the teaching team………………………………………………………………5
4 Module overview…………………………………………………………………………………………………6
5 Learning resources …………………………………………………………………………………………..10
5.1 Reading List ……………………………………………………………………………………………..10
6 Expectations of studying this module………………………………………………………………..10
6.1 Professional behaviour and online conduct ………………………………………………11
6.2 Academic Integrity and Misconduct…………………………………………………………..12
6.3 Extenuating circumstances……………………………………………………………………….13
7 Assessment………………………………………………………………………………………………………13
Formative assessment…………………………………………………………………………………………13
Summative assessment ………………………………………………………………………………………13
7.1 CourseWork 1 (CW1): Web App with Vue.js (40%) ………………………………….14
7.2 CourseWork 2 (CW2): Node.js Server and Express API (30%)………………..19
7.3 CourseWork 3 (CW3): Progressive and Mobile App (30%) ………………………22
7.4 Extension, Late Penalty, Incentive System and Demonstration Process ….25
7.4.1 Extension…………………………………………………………………………………………..25
7.4.2 Late Penalty ………………………………………………………………………………………25
7.4.3 An Incentive System for Motivating Students to Have their Demo in The
First Weeks, and for Properly Balancing Demonstrations………………………………..25
7.4.4 Demonstration Process and Important Requirements/Instructions…….26
7.5 Feedback on your assignments………………………………………………………………..27
7.6 How is your assignment mark agreed? …………………………………………………….27
7.7 Anonymous Marking Assessment Policy ………………………………………………….28
8 Indicative Learning Planner………………………………………………………………………………30
9 University 20-point Scale ………………………………………………………………………………….31
WEB-BASED MOBILE APP DEVELOPMENT CST3145
4
CST3145_module_handbook_updated_20230831_v01.docx
WEB-BASED MOBILE APP DEVELOPMENT CST3145
5
CST3145_module_handbook_updated_20230831_v01.docx
1 Welcome
This module teaches you how to build an app that run online and iOS or Android
devices using the web technologies that you started in the second year.
The student will be expected to pursue the latest progress in the Web app
development through group discussions and self-study.
2 The module teaching team
• Please see below details of the teaching team for this module.
Module Leader: Luca Piras
Room number: TG11
Email: l.piras@mdx.ac.uk
Telephone number: +44 (0)20 8411 2700
Office hours: Please email for an
appointment
Dubai Lecturer: Chinnu George
Room number:
Email: c.m.george@mdx.ac.uk
Telephone number:
Office hours:
3 Communication with the teaching team
Students may contact staff via e-mail and by making an appointment to see them (for
instance, online with a Zoom call).
Staff will contact students by e-mail, the My Learning module page and via lectures
and seminars. The team may send urgent group and/or individual messages about
the module to you by email, so it is important that you read your University email
regularly.
In the first instance problems should be dealt with by talking to a member of the
module team. You can give feedback on this module to the Module Leader, your
Student Voice Leader, to your Personal Tutor, and through the end of module
evaluation survey.
WEB-BASED MOBILE APP DEVELOPMENT CST3145
6
CST3145_module_handbook_updated_20230831_v01.docx
4 Module overview
Aims
This module aims to develop a deep understanding of the latest web-based app
programming techniques, frameworks, and methodologies used by the industry to
develop the next generation software that can be deployed on any mobile devices
(both Android and iOS). The module will investigate, develop, and deploy latest
programming language standards that are fundamental to app development and
currently being widely employed in industry. Modern programming frameworks will
be introduced to provide the essential software architecture for large-scale software
development and the ability to target either the Android or iOS platform. The module
will cover the three most important components of a complete mobile app: front end,
back end, and system administration.
Learning Outcomes
Knowledge
On completion of this module, the successful student will be able to:
1. Understand the latest programming standard required for advanced app
development.
2. Utilise the latest software architecture frameworks and understand their
strength and weakness.
3. Utilise of the latest serverless backend that provide app hosting and data
storage.
4. Utilise essential tools required such as version control, dependency
management, transpiling, and behaviour-driven development.
5. Understand the methodology of developing platform-independent mobile app
and the strength and weakness of existing libraries.
Skills
This module will call for the successful student to demonstrate:
6. Ability to develop efficient and robust app following the latest programming
standard.
7. Ability to design and implement industry-scale app utilising the latest software
frameworks.
8. Ability to host app online and design/manage serverless data storage.
9. Ability to efficiently deploy, config, and administrate essential tools required for
advanced web app development workflow such as version control, dependency
management, transpiling, and behaviour-driven development.
10.Ability to develop platform-independent mobile apps using Web-based
technologies.
11.Ability to design and evaluate cross-platform mobile apps based on customer
specifications.
WEB-BASED MOBILE APP DEVELOPMENT CST3145
7
CST3145_module_handbook_updated_20230831_v01.docx
Syllabus
• Object-oriented programming in functional language such as JavaScript.
• Advanced features in the latest programming language standard such as
ECMAScript 6.
• Version control and issue tracking with Git and Github.com.
• Software testing library such as Jest.
• Project dependency and compile tools such as NPM and Webpack.
• Full-stack software framework such as Vue.js:
o UI Component.
o User registration and authentication.
o Serverless data storage and sharing (such as Firebase).
o Messaging.
o Web APIs (such as Facebook and Google Maps).
o Hardware APIs (such as camera, gps, and other sensors).
• Platform-independent mobile app development with framework such as
NativeScript.
Learning and Teaching Strategy
Contact hours:
• Lecture: 1 hr
• Laboratory: 2 hrs
The focus of teaching will be a mixture of lectures and lab-based practical work and
discussions. Skills and experience are built up through weekly lab sessions that
progressively build up the knowledge and skills to complete a full-fledged web
application. Various tools, such as Git, NPM, and VSCode will be introduced
throughout the module as they become necessary. The student will be expected to
pursue the latest progress in the Web app development through group discussions
and self-study.
Assessment Scheme
a) Formative Assessment Scheme
Students will receive formative assessment on all drafts of summative assessments
tasks. Students will be expected to submit a draft to the seminar/lab tutor at least two
weeks before the submission deadline.
b) Summative Assessment Scheme
The coursework gives students the opportunity to put into practice all the theories,
frameworks, and libraries covered in the module. The three pieces of coursework
focus on the three aspects of a complete mobile app: front end (coursework 1), back
end (coursework 2), and administration (coursework 3). Each coursework is built
upon the one(s) before it.
WEB-BASED MOBILE APP DEVELOPMENT CST3145
8
CST3145_module_handbook_updated_20230831_v01.docx
Coursework 1 (individual) will allow students to apply the knowledge and features in
the latest programming standard to design and build the front-end of an app using
one of the architecture framework (Outcomes 1, 2, 5, 6, 7, 10, and 11).
Tasks shall include the design of the app architecture and the implementation of its
features with the advanced features in the latest programming standard. Through the
challenges such as understanding modern architecture and implementing advance
web features, students will improve their knowledge and skills for industrial software
development.
The format of this coursework will consist of a formal report and a demonstration of
the resulting app front end.
Coursework 2 (Individual) will allow students to design and implement the back end
of the app, including the user management, data storage, and messaging.
(Outcomes 3, 4, 5, 8, 9, 10, and 11).
Tasks include create user registration and login with both email/password and social
login such as Google+ and Facebook; hosting mobile app online so it can be
distributed and accessed remotely; design and the create the serverless storage that
records all the user data.
The format of this coursework will consist of a formal report and a demonstration of
the resulting app back end.
Coursework 3 (Individual) will require students to create the app administration
system that allows the app administrator to manage app settings, user, and data
(Outcomes 2, 3, 5, 7, 8, 10, and 11).
This coursework requires the students to design and develop the
management/administration system that allow system users to monitor and adjust
the app. The work will include the design and implementation of a series of visual
analysis functions for the understanding the system status and making sense of its
user behaviours. This will be built upon the front and back end work completed in the
first two coursework.
The format of this coursework will consist of a formal report which demonstrates the
design and development process and a demonstration of all the features.
Assessment Weighting
Coursework 1 (40%)
Coursework 2 (30%)
Coursework 2 (30%)
Total Notional Learning Hours
300
WEB-BASED MOBILE APP DEVELOPMENT CST3145
9
CST3145_module_handbook_updated_20230831_v01.docx
Research Ethics
• The teaching, learning, assessment and research activities undertaken
in this module have been considered and are not likely to require ethical
approval.
• However, please seek advice if undertaking the module entails carrying out
any research activities involving human participants, human data,
animals/animal products, precious artefacts, materials or data systems.
If you submit work that includes data gathered from or about people, this may
be treated as academic misconduct and could lead to fail grade being
awarded.
• Research ethics approval seeks to ensure all research is designed and
undertaken according to certain principles of ethical research. These include:
1. Primary concern must be given to the safety, welfare and dignity of
participants, researchers, colleagues, the environment and the wider
community
2. Consideration of risks should be undertaken before research commences
with the aim of minimising risks to those involved – i.e. human participants
or animal subjects, colleagues, the environment and the wider community,
as well as actual or potential risks to those directly or indirectly affected by
the research.
3. Informed consent should be freely given by participants, and by a trained
person when collecting or analysing human tissue (details on accessing
and completing online training for gaining informed consent for HTA
purposes can be found below in Section 8).
4. Respect for the privacy, confidentiality and anonymity of participants
5. Consideration of the rights of people who may be vulnerable (by virtue of
perceived or actual differences in their social status, ethnic origin, gender,
mental capacities, or other such characteristics) who may be less
competent or able to refuse to give consent to participate
6. Researchers have a responsibility to the general public and to their
profession; as such they should balance the anticipated benefits of their
research against potential harm, misuse or abuse which must be
avoided
7. Researchers must demonstrate the highest standards of ethical conduct
and research integrity. They must work within the limits of their skills,
training and experience, and refrain from exploitation, dishonesty,
plagiarism, infringement of intellectual property rights and the fabrication of
research results. They should declare any actual or potential conflicts of
interest, and where necessary take steps to resolve them.
8. When using human tissues for research, Human Tissue Act and Human
Tissue Authority (HTA) requirements must be met. Please contact the
relevant designated person (DP) in your department or the HTA
Designated Individual (DI) (Dr Lucy Ghali – L.Ghali@mdx.ac.uk). Further
information is provided below in the section: “Human Tissue Authority
Information”, see ‘Governance Structure” document and SOPs etc.
9. Research should not involve any illegal activity, and researchers must
comply with all relevant laws.
WEB-BASED MOBILE APP DEVELOPMENT CST3145
10
CST3145_module_handbook_updated_20230831_v01.docx
• For more information about ethics go to the Middlesex Online Research
Ethics (MORE) system which has information and guidance to help you meet
the highest standards of ethical research using this link:
https://MOREform.mdx.ac.uk
• Information and further guidance on how to complete a research ethics
application form (e.g., video guides and templates) can be found on the
MORE MyLearning site*: http://mdx.mrooms.net/enrol/index.php?id=12277
(Log in required)
*Middlesex University Definition of Research document can be located on this
site.
5 Learning resources
This module has a variety of learning resources available for you to use to support
your learning. These include recorded lecture, lecture slides, feedback, and key
reading materials. These can be accessed online via the module page. Please visit
the module page regularly to make use of these.
5.1 Reading List
Your online reading is available at (as well as in the module website): CST3145
Reading List. It highlights recommended reading for this module. The course website
has many links to other online resources.
6 Expectations of studying this module
Attendance and Engagement
The module team are here to help and support you achieve your goals. One of the
key elements to successfully completing this module is engaging with all of the
learning opportunities we offer as well and working with your peers to support one
another.
This module is designed as a combination of contact sessions, directed study and
independent study. This means you must participate in all the allocated sessions and
you must complete all set prework and activities outside them. Students are
expected to take an active part in all learning sessions whether these are online or
on campus, for example lectures, lab sessions, practical classes, etc.
To make the most of this module please complete the following every week.
• Complete any potential prework indicated in preparation for learning sessions.
This may be watching videos, reading through set material or chapters and
WEB-BASED MOBILE APP DEVELOPMENT CST3145
11
CST3145_module_handbook_updated_20230831_v01.docx
completing activities. Please make notes of points you need to clarify and
discuss these in learning sessions with module tutors.
• Read through the notes making a note of any points you need to discuss with
your tutor.
• Complete the set activities before the next session, making a note of any
points you need to discuss with your tutor.
• Go to the module My Learning page regularly and use all the resources, for
example indicated reading, links, extra material, etc. Make a note of anything
you wish to discuss with your tutor.
• Complete potential further reading indicated.
The module team is committed to support you and your fellow students whilst you
undertake this module. In order for you to get the most out of sessions you need to
come prepared and ready to contribute. Please ensure that any work set by the team
has been completed before activities indicated. After each class please review what
has been covered and make a note of anything you would like clarification on.
Engaging with online and on-campus in-person learning and activities is integral to
your success. Middlesex University supports you to achieve your full potential
through a number of strategies, all of which provide a supportive learning
environment online, remotely, face-to-face, or blended.
Further information on attendance and engaging with your programme will be
available at your Induction and updates online at UniHub at the weblink below.
https://unihub.mdx.ac.uk/study/assessment/attendance
6.1 Professional behaviour and online conduct
The programme of study you are undertaking is underpinned by developing
professional behaviour and attitude. It is important that you are respectful and
supportive to your fellow students and tutors. Adopting this approach will create a
positive atmosphere within sessions and is something you can use in your professional
life. You must come to sessions prepared and ready to contribute where appropriate.
To access some of the rooms and specialist space used for this module you will need
your University ID card. Please remember that your University ID should be carried
with you always whilst on campus and you must be able to identify yourself if asked to
do so. Please conduct your email communication with fellow students, tutors and all
relevant staff in a formal and courteous manner. It is helpful to provide your student
number and if you have a query relating to a module include the module number as
well.
In the same way that we help you understand how to effectively participate in learning
on campus, we also want to make sure that you can make the most of online learning.
Our principles of online learning class conduct are available at:
https://unihub.mdx.ac.uk/covid-19-updates-faq/online-classroom-conduct
WEB-BASED MOBILE APP DEVELOPMENT CST3145
12
CST3145_module_handbook_updated_20230831_v01.docx
6.2 Academic Integrity and Misconduct
You should be aware of the University’s academic integrity and misconduct policies
and procedures. Taking unfair advantage over other students in assessment is
considered a serious offence by the University. Action will be taken against any
student who contravenes the regulations through negligence, foolishness or
deliberate intent. Academic misconduct takes several forms, in particular:
• Plagiarism – using extensive unacknowledged quotations from, or direct copying
of, another person’s work and presenting it for assessment as if it were your own
effort. This includes the use of third-party essay writing services.
• Collusion – working together with other students (without the tutor’s permission),
and presenting similar or identical work for assessment.
• Infringement of Exam Room Rules – Communication with another candidate,
taking notes to your table in the exam room and/or referring to notes during the
examination.
• Self-Plagiarism – including any material which is identical or substantially similar
to material that has already been submitted by you for another assessment in the
University or elsewhere.
Students who attempt to gain unfair advantage over others through academic
misconduct will be penalised by sanctions, according to the severity of the offence,
which can include exclusion from the University. Links to the relevant University
regulations and additional support resources can be found here:
Student Success Essentials Course which includes Academic Integrity
Access to course. -You will have to log into to MyUniHub and then MyLearning to
access the course.
Full details on academic integrity and misconduct and the support available can be
found at Academic Integrity | UniHub (mdx.ac.uk)
The Academic Integrity and Misconduct policy is available in our Public Policy
Statements (under Academic Quality) at: Our policies | Middlesex University London
(mdx.ac.uk)
Referencing & Plagiarism: Suspected of plagiarism?:
http://libguides.mdx.ac.uk/c.php?g=322119&p=2155601
Referencing and avoiding plagiarism:
https://unihub.mdx.ac.uk/study/writing-numeracy/awl-resources/writing
The Middlesex University Students’ Union (MDXSU) Advice Service offers free and
independent support in making an appeal, complaint or responding to any
allegations of academic or non-academic misconduct.
https://www.mdxsu.com/advice
WEB-BASED MOBILE APP DEVELOPMENT CST3145
13
CST3145_module_handbook_updated_20230831_v01.docx
6.3 Extenuating circumstances
There may be difficult circumstances in your life that affect your ability to meet an
assessment deadline or affect your performance in an assessment. These are
known as extenuating circumstances or ‘ECs’. Extenuating circumstances are
exceptional, seriously adverse and outside of your control. Please see link for further
information and guidelines:
https://unihub.mdx.ac.uk/your-study/assessment-and-regulations/extenuatingcircumstances
7 Assessment
Formative assessment: Formative assessment is completed during your year of
study and provides the opportunity to evaluate your progress with your learning.
Formative assessments help show you and us that you are learning and
understanding the material covered in this course and allow us to monitor your
progress towards achieving the learning outcomes for module. Although formative
assessments do not directly contribute to the overall module mark they do provide an
important opportunity to receive feedback on your learning.
Summative assessment: Summative assessment is used to check the level of
learning at the end of the course. It is summative because it is based on accumulated
learning during the course. The point is to ensure that students have met the learning
outcomes for the course and are at the appropriate level. It is the summative
assessment that determines the grade that you are awarded for the module.
There are 3 assessment components in this module:
• Coursework 1 (week 8): Web App with Vue.js (40%).
• Coursework 2 (week 16): Node.js server and Express.js API (30%).
• Coursework 3 (week 22): Progressive and Mobile Apps (30%).
In order to pass this module, you need to pass all assessment tasks with an overall
minimum grade of 40% or equivalent.
Before you submit your work for final grading, please ensure that you have
accurately referenced the work. It is your responsibility to check the spelling and
grammar, as all written assessments will assess technical proficiency in the English.
This means accurate and effective spelling, punctuation and grammar. Details of
how it will be assessed will be provided in the marking criteria for each assessment
and the University overall approach can be found within the Grade Criteria Guide in
WEB-BASED MOBILE APP DEVELOPMENT CST3145
14
CST3145_module_handbook_updated_20230831_v01.docx
the University Regulations https://www.mdx.ac.uk/about-us/policies (scroll to
university regulations)
Reasonable adjustments will be made for those students who have a declared
disability/specific learning condition which would affect performance in this area.
If you have submitted a formative or draft assessment, you will receive feedback but
no grade. The comments should inform you about how well you have done or tell you
about the areas for improvement. All assignments should be submitted online unless
specified in assessment briefs.
Reassessment for this module normally takes place in the following way:
Normally in July with demonstration of improvement of the coursework, and ability to
clearly describe and demonstrate it.
Further information is available at
https://unihub.mdx.ac.uk/study/assessment
Middlesex University is committed to being fair in its approach to assessing student
learning following the UK Quality Code for Higher Education (Quality Code) (2018)
and the UK Quality Code – Advice and Guidance: Assessment (2018) and External
Expertise (2018).
The Assessment Fairness guidance, policies and procedures put in place by
Middlesex University is our commitment to ensure fairness in assessment and are
available at https://unihub.mdx.ac.uk/study/assessment/assessment-regulationsguide
If you have any queries or would like to know more on how this approach has been
applied to modules you are studying please contact your Programme Leader.
7.1 CourseWork 1 (CW1): Web App with Vue.js (40%)
Deadline: Week 7.
Type of CW: Individual Work.
IMPORTANT. A submission could receive zero marks if it fails any of the
following requirements:
• The student must book an available slot for the demo of a CW, by the CW
submission deadline, via the related “Individual Demonstration Booking
System” on the Module Page, AND the work must be demonstrated within
the demonstration weeks scheduled, during the demo slot booked
(IMPORTANT: see more details and guidance on demo booking at section
WEB-BASED MOBILE APP DEVELOPMENT CST3145
15
CST3145_module_handbook_updated_20230831_v01.docx
7.4.4 in the handbook, and for guidance on other important related aspects
at section 7.4 in the handbook).
• The work must be demonstrated and explained satisfactorily during
demonstration, i.e., student can explain what the code does.
Task. For this coursework, you need to create the Front-End of a fictitious web app,
which allows students and their parents to buy after school classes and activities.
The second coursework will add the Back-End and make the app to work offline, and
the third coursework will turn it into a Mobile App.
Submission
Instructions for the text area to compile when uploading your submission:
– please, indicate the same information requested below for the README file
Instructions for the zip file, it must contain the following elements, and must
be no more than 10MB:
• your code.
• a README file with the following 2 links:
o [Vue.js App] the link to your GitHub Repository.
o [Vue.js App] the link to your GitHub Pages from where the app can
directly run.
Overall Requirements and Instructions
• The coursework does not require any backend storage such as a (MongoDB)
database. For this CW it is not required to store data related to completion of
orders.
• You can use an external CSS library such as Bootstrap. Make sure the library
file or online link is included in the submission.
A submission could receive zero marks if it fails any of the
following requirements:
• the App must be implemented by using Vue.js framework. Other frameworks
or related technologies (e.g., React, AngularJS, Svelte, Apache, XAMPP) are
NOT allowed.
• Any JavaScript library is NOT allowed if it duplicates or replaces features
provided by Vue.js framework. Check with the tutor if not sure.
WEB-BASED MOBILE APP DEVELOPMENT CST3145
16
CST3145_module_handbook_updated_20230831_v01.docx
Figure 1. A Lesson element of the App
Figure 2. Sort functionality and List of Lessons
Figure 3. Shopping Cart and Checkout
WEB-BASED MOBILE APP DEVELOPMENT CST3145
17
CST3145_module_handbook_updated_20230831_v01.docx
Marking criteria
• General Requirements (10%):
A. [GitHub Repository] the code of the Vue.js App must be hosted in a
GitHub repository, with at least 10 commits (2%).
B. [GitHub Pages] the Vue.js App must be hosted and demonstrated
on/via GitHub Pages (3% if requirement is fully covered, 1% if app is
running locally).
C. [Vue.js framework, but NOT SFC] the App must be implemented using
Vue.js framework, but not using Single File Component (SFC) (SFC
will be covered in the last part of the module) (5% if requirement is fully
covered, 0% if app is implemented with SFC).
• “Display List of Lessons” functionality (5%):
A. there should be at least 10 lessons, and each lesson should have 5
spaces (or availability) (1%).
B. each lesson should have at least (2%): Subject, Location, Price,
Spaces (or availability: this indicates how many spaces are left), a Font
Awesome icon (or an Image).
C. the list of lessons must be stored as an array of JSON objects, one
object for each lesson, in a separate JavaScript file, such as lessons.js
or lessons.json (1%).
D. v-for must be used for the display of the lesson list (1%).
• Sort functionality (5%):
A. the user can choose to sort the lessons by one of the following
attributes (4%): subject (1%), location (1%), price (1%), or spaces (i.e.
availability) (1%).
B. there must be an option to sort in ascending or descending order (order
dependent on the sorting attribute selected), which should work for
each of the attributes (1%).
• “Add to Cart” functionality (5%):
A. each lesson must have an “Add to Cart” button (1%).
B. the button is always visible, and only enabled when space is larger
than 0 (1%).
C. clicking the button once (related interactions implemented by using von) will add one space to the shopping cart, reducing the remaining
space by one (2%).
D. once there is no more space, i.e. space = 0, the “Add to cart” button
should be disabled but still visible, i.e. clicking it will not further reduce
“space” nor add lessons to the cart (1%).
WEB-BASED MOBILE APP DEVELOPMENT CST3145
18
CST3145_module_handbook_updated_20230831_v01.docx
• “Shopping Cart” functionality (5%):
A. the shopping cart button should only be enabled after at least one
lesson is added to cart (1%).
B. clicking the shopping cart button should show the cart page, and
clicking the button again goes back to the lesson page (1%).
C. the shopping cart, in the cart page, should show all the lessons added
(1%).
D. in the shopping cart page, the user should be able to remove lessons
from the shopping cart; the removed lesson is added back to the
lesson list (in the lesson page) (2%).
• Checkout functionality (5%):
A. the checkout is part of the shopping cart page (1%).
B. a user must provide “Name” and “Phone number” before can click on
the “checkout” button (1%).
C. the “Name” must be letters only and the “Phone” must be numbers
only; the check must be done using JavaScript (suggestion: regular
expressions) (1%).
D. the “checkout” button is always visible and only enabled after valid
“Name” and “Phone” are provided (1%).
E. clicking the “checkout” button should display a message confirming the
order has been submitted (1%); it is not required to save the order, in
fact displaying the message completes the process, which is enough
for this CW.
• Search Functionality (5%):
• [Intro] this is the challenge component of this coursework, and it is not
expected that everyone can complete it. The solution is not covered in the
lecture or lab, so you need to research it.
• [Feature Description] the goal is to add a full-text search feature,
• The user can search for a lesson without specifying which attribute to
search on.
• For example, searching for “a” should return all the lessons with “a” in its
“title” or “location”.
• The search should send back results that include both “title” or “location”,
while it is not required that it works also for “price” and “availability”.
• Solutions provided are marked as follows.
[Base Marks (provided depending on which following approach is chosen)]
A. [Approach 1] “using existing library” (2%), you can implement this feature
using an existing JavaScript library (does not have to be a Vue.js library),
in which case you receive maximum 2 marks.
OR
WEB-BASED MOBILE APP DEVELOPMENT CST3145
19
CST3145_module_handbook_updated_20230831_v01.docx
B. [Approach 2] “writing your own search function” (4%), you will receive
maximum 4 marks if you write your own search function, which, again,
does not have to use Vue.js.
[Further Mark]
C. “search as you type” (1%), there is also this mark if the search supports
“search as you type”, i.e. the search starts when user types the first letter
(displaying all the lessons containing that letter), and the result list is
filtered as more search letters are entered (similar to Google Search).
7.2 CourseWork 2 (CW2): Node.js Server and Express API (30%)
Deadline: Week 15.
Type of CW: Individual Work.
IMPORTANT. A submission could receive zero marks if it fails any of the
following requirements:
• The student must book an available slot for the demo of a CW, by the CW
submission deadline, via the related “Individual Demonstration Booking
System” on the Module Page, AND the work must be demonstrated within
the demonstration weeks scheduled, during the demo slot booked
(IMPORTANT: see more details and guidance on demo booking at section
7.4.4 in the handbook, and for guidance on other important related aspects
at section 7.4 in the handbook).
• The work must be demonstrated and explained satisfactorily during
demonstration, i.e., student can explain what the code does.
Task. The goal of this coursework is to build the Back-End for the app created in the
first coursework. MongoDB will be used for storing the data, and data exchange
between the app and the database will be done through REST API implemented
using Express.js. The Back-End will run on a Node.js server.
Submission
Instructions for the text area to compile when uploading your submission:
– please, indicate the same information requested below for the README file
Instructions for the zip file, it must contain the following elements, and must
be no more than 10MB:
• your code in 2 folders respectively related to:
o your Vue.js App.
WEB-BASED MOBILE APP DEVELOPMENT CST3145
20
CST3145_module_handbook_updated_20230831_v01.docx
o your Express.js App (do not include the ’node_modules’ folder,
otherwise, the zip will be too big to submit).
• a README file with the following links:
o [Vue.js App] the link to your GitHub Repository.
o [Vue.js App] the link to your GitHub Pages from where the app can
directly run.
o [Express.js App] the link to your GitHub Repository.
o [AWS Express.js App] the link to the AWS route that returns all the
lessons.
• the ‘lesson’ and the ‘order’ collections exported from your MongoDB Atlas.
See here for how to export collection in MongoDB Compass
(https://docs.mongodb.com/compass/current/import-export#export-data-froma-collection).
• the requests you created in Postman. See here for how to export requests in
Postman (https://learning.postman.com/docs/getting-started/importing-andexporting-data/#exporting-collections).
Overall Requirements
A submission could receive zero marks if it fails any of the
following requirements:
• the Back-End server must use “Node.js”; others such as Apache or Xampp
are not allowed.
• in relation to hosting the Back-End server, it not allowed to use AWS S3, nor
AWS EC2, nor other cloud-based hosting solutions (e.g., Heroku). The only
allowed one is AWS with the technologies covered in the related Lecture.
• the REST API must be developed with “Express.js”.
• the Front-End data access must be achieved with “promise” using “fetch”
function; “XMLHttpRequest” or library such as axios:js are not allowed.
• the data must be stored in “MongoDB Atlas” and retrieved via your Express.js
App; local MongoDB or any other databases are not allowed.
• connection to MongoDB (in your Express.js App) must use the native Node.js
driver only; libraries like Mongoose are not allowed.
Marking criteria
• General Requirements (8%):
A. [GitHub Repositories] the code of the Vue.js App must be hosted in a
GitHub repository (if you want, you can continue using the one of
CW1), and the code of the Express.js App must be hosted in another
WX：codehelp