Project Exam 2 brief

Goal

To take the skills learned over the last two years and take on an extensive project where the finished product should reflect the candidate’s general development capabilities, in addition to visual and technical skills.

Brief

A newly launched accommodation booking site called Holidaze has approached you to develop a brand new front end for their application. While they have a list of required features, the design and user experience has not been specified. Working with the official API documentation, plan, design and build a modern front end accommodation booking application.

There are two aspects to this brief: the customer-facing side of the website where users can book holidays at a venue, and an admin-facing side of the website where users can register and manage venues and bookings at those venues.

Course Relevance

The aim of the course provides candidates the ability to make independent choices and deliver a comprehensive product from start to finish with professional standards, deadline compliancy and focus on efficient workflows. The project work is independent, and the project scope is set with guidance from the teacher and industry.

Learning Outcome

Knowledge

The Candidate…

  • can assess his/her own work in relation to the applicable regulations and guidelines for universal design of digital solutions
  • has insight into his/her own opportunities for development in planning and preparation of digital solutions
Skills

The Candidate…

  • can explain his/her own vocational choices for tools, methods and techniques for planning, developing, testing and design of digital solutions both visual and technical
  • can explain his/her choice of regulations and guidelines for universal design of digital solutions.
  • can reflect over his/her own creative and technical practice as a front-end developer and adjust it under supervision.
  • can find and refer to information related to project work and assess its relevance for a specified project.
General Competence

The Candidate…

  • can plan and carry out the development of digital solutions, either alone or as part of a group in accordance with ethical requirements and guidelines for universal design, and the needs of selected target groups or a specific client assignment.
  • can exchange points of view and build relations with fellow students, teachers and professionals and participate in discussions about the development of best practices within front-end development.
  • can contribute to the development of good collaborations between vocational disciplines or interdisciplinary groups.

Examination and Assessment

The learning outcomes are evaluated accordingly: Examination projects are assessed with a letter grade from A-F.

Re-Examination

It is possible to re-sit this course after the guidelines clearly outlined in the school’s examination rules.

Requirements

All API functionality is managed by an existing application. This project only covers the front-end application for the API.

API

The API you are using for this project can be found under Holidaze in the Noroff API documentation.

Resources

User Stories

The client has specified the following requirements in the form of User Stories:

  1. A user may view a list of Venues
  2. A user may search for a specific Venue
  3. A user may view a specific Venue page by id
  4. A user may view a calendar with available dates for a Venue
  5. A user with a stud.noroff.no email may register as a customer
  6. A registered customer may create a booking at a Venue
  7. A registered customer may view their upcoming bookings
  8. A user with a stud.noroff.no email may register as a Venue manager
  9. A registered Venue manager may create a Venue
  10. A registered Venue manager may update a Venue they manage
  11. A registered Venue manager may delete a Venue they manage
  12. A registered Venue manager may view bookings for a Venue they manage
  13. A registered user may login
  14. A registered user may update their avatar
  15. A registered user may logout

Technical Restrictions

The company CTO has set the following technical restrictions:

  1. Must use an approved JavaScript Framework
  2. Must use an approved CSS Framework
  3. Must be hosted on an approved Static Host
  4. Must use an approved Design Application
  5. Must use an approved Planning Application

Approved Resources

This list covers libraries and services that have been vetted by the company and approved for use.

JavaScript Frameworks

  • React (>16)
  • NextJS

CSS Frameworks

  • Bootstrap (>5)
  • Tailwind (>3)
  • MUI (>5)
  • Styled Components/ Wmotion
  • CSS Modules
  • Radix UI

Hosting Services

  • GitHub Pages
  • Netlify
  • Vercel
  • Render

Design Applications

  • Figma

Planning Applications

  • Trello
  • GitHub Projects
  • Figma

Delivery

Include the required links in the Moodle delivery window using this template format.

All final changes must be merged into the default branch main or master. Other branches will not be checked.

Ensure that the readme.md file describes your project thoroughly, including how to setup and run the project locally and any special instructions for testers.

Required Delieverables

The Product Owner has requested links to the following:

  • A link to your production website (Netlify/ Vercel/ GitHub Pages)
  • A link to your Public GitHub repo
  • A PDF report of your project (Template provided in this repository)
  • A link to High fidelity design (Figma)
  • A Gantt chart for project timing (Trello/ GitHub Projects/ Figma)
  • A kanban project board (Trello/ GitHub Projects/ Figma)
  • A link to the design spec including style guide and tokens (Figma)
  • A link to Prototype (Figma)

Optional Deliverables

  • A link to your report.
  • A video summary of you explaing your project.
  • A link to Low fidelity design (Figma)