SIT120 - Assignment 2 Responsive Web App: Implementation and Demonstration Worth: 40% of your grade (30% project, 10% presentation) Due Week 10, Friday 11:00 pm (Firm Deadline) On Campus Students: Demonstration in person (Week 11 Practical)...

SIT120 - Assignment 2

Responsive Web App: Implementation and Demonstration

Worth: 40% of your grade (30% project, 10% presentation)

Due Week 10, Friday 11:00 pm (Firm Deadline)

On Campus Students: Demonstration in person (Week 11 Practical)


In this assignment you will demonstrate your understanding of the coding concepts and skills developed throughout

this trimester in a creative context. Using robust Vue platform, you will use HTML, CSS and JavaScript to create a

responsive web application. You are free to design and think of imaginative behaviours and actions for the

components in your aquarium that satisfy the requirements below in a creative manner.

As an individual, your project should demonstrate the use of multiple components in a larger system of both

autonomous and interactive elements. The purpose and format of your project is up to you. For example, you may

choose to focus on a realistic simulation, a game-like experience, a virtual toy, a digital performance, etc. The unit staff

will be happy to hear your ideas and provide feedback.


You may work in a group helping each other, however, you should be based on Assignment 1 Proposal and develop

the web application. You are free to improve or modify from this plan during development. Using your Project

Proposal as a guide, you should apply coding using Vue framework and components system to your components in

order to demonstrate a range of coding concepts in a creative manner. All must be included in your project.

Additionally, the following effective coding practices should be demonstrated by your implementation:

The way in which your web satisfies each of these requirements is up to your design. Your submission of the

assignment must be presented as a single zip archive.


Written Report

An accompanying written report (maximum 5 pages, may be shorter) should explain your implementation, design

and reasoning behind your code and system, include the following information:

1. Overall description of design challenges and system.

2. Explanation of how each of the above listed coding concept requirements have been fulfilled in a creative

manner (screenshots of blueprints, diagrams may also be useful here!).

Oral Presentation

During your practical in Week 11 you will present an oral presentation which includes the following information:

• Short summary of the project goals including target audience.

• Demonstration of the functional project.

• Discussion of the process you took to implementing the features (e.g., how did you translate your ideas into

the functional result? Did you use user stories, UX/UI, create asset lists, etc).

Coding Practises Requirement

Documentation and Basics Effective commenting inside codes to allow easy understanding of the

purpose of different aspects of your code. Efficient use of some of the

following basic ideas.

• Computed Properties and Watchers

• Class and Style Bindings

• Conditional Rendering

• List Rendering

• Event Handling

• Form Input Bindings

• Components Basics

Components in depth • Component Registration

• Props

• Custom Events

• Slots

• Dynamic & Async Components

• Handling Edge Cases

Transitions and Animations

Reusability & Composition

Tooling and Scaling Up

• Enter/Leave & List Transitions

• State Transitions

• Mixins

• Custom Directives

• Render Functions & JSX

• Plugins

• Filters

• Single File Components

• Unit Testing

• TypeScript Support

• Production Deployment

• Routing

• State Management

• Highlights of key features and how the coding concepts you have learned were applied to these.

• Discussion of the major obstacles and challenges encountered during the course of this project and how you

solved them or made changes. Be honest – coding is challenging and your approach to problem solving and

demonstration of how you have learned from this are very important!

A powerpoint presentation or visual aid is recommended, and should be submitted with your project.


One must submit the following files to the Assignment 2 link prior to the due date and time. Your submission must


1. Written report as a HTML file.

2. Project in a .zip archive. Make sure to zip the entire project directory (i.e., the folder containing the project

file and all other folders and contents contained within).

3. Powerpoint presentation of your oral presentation visual aid (cloud students: voice over presentation).

因为专业,所以值得信赖。如有需要,请加QQ99515681 或邮箱