CMT120

Fundamentals of Programming

Web Application Development

Learning Outcomes

•  LO3: Develop secure web applications that make use of database technologies

•  LO4: Critically appreciate the role of security, quality and usability within software projects

Submission Instructions

The coversheet can be found under ‘Assessment & Feedback’ in the COMSC-ORG-SCHOOL organisation on Learning Central.

All files should be submitted via Learning Central. The submission page can be found under ‘Assessment & Feedback’ in the CMT120 module on Learning Central. Your submission should consist of multiple files:

* Replace YOUR_USERNAME with your Cardiff’s user name, which is typically a letter ’c’ (or ’d’) + your student number, e.g. c1234567.

** In case of problems uploading the video to Learning Central, please share it through OneDrive to Jandson Santos Ribeiro Santos ([email protected]) and Federico Liberatore

([email protected]) . More specifically:

•  For item (1) :

– submit (push) your complete source code to COSMC’s GitLab server, and share your repository with Jandson Santos Ribeiro Santos and Federico  Liberatore as follows:

*  On the Project page, go to: Project Information > Members

*  In GitLab member or Email address field: search for Jandson Santos Ribeiro Santos (user name: scmjs8)

*  In Select a role dropdown, choose Maintainer

*  Click on Invite button

Repeat for Federico Liberatore (user name: scmfl2), making sure the role permission is also set as Maintainer.

– Your git repository must include a README text file ( .md or  .txt), which contains the following information:

* Your Username (or Student Number)

*  (If deployed on OpenShift) URL of your website on the OpenShift server;

*  [Optional] References (if appropriate).

*  [Optional] Any other information you think is relevant, e.g. how to run your code.

–  Note:nochangesareallowedafterthesubmissiondeadline! Non

compliance with this requirement,i.e. working on the coursework after the deadline, may be penalised and may result in capping the mark at the pass rate (for the work submitted < 24 hrs late) or an award of zero marks (> 24 hrs late submission).

•  For item (2) - see instructions in Section ’2Video Demo of the Website’ .

•  For item (2) - specific requirements for your report on the website’s security and usability are given in Section ’3Report on Website’s Security, Quality and Usability’ .

•  For item (4) - you will need to fill in and submit the online ‘CMT120 - CW 2 - Submission Details Form (23-24)’ form, the link to which will be posted in  ’Assessment’ area on Learning Central.

Any code submitted will be run on a system equivalent to the laptops provided to the students, and must be submitted as stipulated in the instructions above. The code should run without any changes being required to the submitted code, including editing of filenames.

Any deviation from the submission instructions above (including the number and types of files submitted) may result in a deduction of up to 10% from the overall mark.

Staff reserve the right to invite students to a meeting to discuss coursework submissions.

If you are unable to submit your work due to technical difficulties, please submit your work via e-mailto [email protected] and notify the module leader.

Assessment Description

For this coursework, you are asked to:

1.  Implement a personal digital portfolio in the form of a dynamic website, which    showcases your competences, skills and expertise, e.g. your technical skills, work produced to date, previous work experience, etc. - the choice of what you want to  cover it’s up to you, but make sure you cover a reasonable range of these.

2.  Record a short 3-mindemo of your website.

3. Write a report to evaluate your website’s quality, usability and security.

1   Personal Digital Portfolio as Dynamic Website

1.1   Website Implementation

• The website is to be implemented using any appropriate tools and methodologies,  covered in this module, e.g. JavaScript, Python/Flask, HTML, CSS, databases, etc.

• The majority of your website content must be ’dynamic’, i.e. appropriate data and content are pulled from/pushed to a database.

-  Examples of dynamic content include, but are not limited to: interaction with the user (e.g. user comments or rating), user accounts, automatically

generated web pages.

- You can employ any type of database system/service.

•  Use of external libraries, extensions and APIs is allowed, e.g. Flask-WTF,

Flask-Security, Bootstrap. However, the final code must be authored by you. You are reminded of the need to comply with Cardiff University’s Student Guide to Academic Integrity. If you use external resources, you must provide complete references, e.g. as in-line comments in your code, and/or in README.md file.     Evidence of unfair practice will be penalised.

•  Use of the code you developed when working on the lab exercises for this module is allowed.

• Although it’s advisable to use the university laptop, you can use your own

computer to implement your website. However, you must use School-based systems and servers for hosting ’dynamic’ parts of your website, e.g. database for content and user accounts, deployment server. The use of external services for these elements is not allowed.

•  Complete code of your website must be submitted to COMSC’s GitLab server (https://git.cardiff.ac.uk/) and shared with the module lecturers - complete instructions on how to do it are given in ’Submission Instructions’ section below.

1.2   Structure and Functionality of the Website

You are free to choose how to structure your website, and what functionality to implement,bearing in mind that appropriate advanced functionality will attract higher marks - see ’Assessment Criteria’ section below.

1.3    Deployment of Website

The expectation is that initially you will be implementing and deploying your website on  localhost. Deployment of your website on a localhost will allow for a mark up to a ’Pass’ for the website implementation part. To obtain a higher mark, your website needs to be  deployed on COMSC’s OpenShift server - see ’Assessment Criteria’ section. The process is described in ’Flask 4: Deployment on OpenShift’ lab sheet and is demonstrated in the practical session. Make sure you state the correct URL in your REAMDE.md submitted in your git repository on GitLab and in your report.  If this is missing or incorrect, it will be assumed that you have not deployed your website on OpenShift.

2   Video Demo of the Website

Record a short video demo of maximum 3 minutes, which demonstrates the functionality you implemented on your website.

If you have successfully deployed your website on OpenShift, you should clearly demonstrate you are running your website using the URL you submitted in your  REAMDE.md file.

More detailed instructions will be provided in the contact sessions.

3   Report on Website’s Security, Quality and Usability

Write a report of 800 words (± 10%), in which you critically appraise TWO examples from your website implementation that demonstrate your appreciation of best practice in security, quality and usability (choose any two).

The front page of your report must contain:

• Your student number

•  URL of your website on OpenShift (if deployed)

Your report must also include two appendices at the end of your report:

• Appendix A: list of advanced functionality you have implemented;

• Appendix B: screenshots of all of your website’s pages.