Home | Profile |
---|---|
VM Dashboard | Individual Venue |
This is my final examination project submission for the Frontend Development course at Noroff School of technology and digital media.
A newly launched accommodation booking site called CabinQuest has approached you to develop a brand new front end for their application. While they have a list of requirements, the design and UX has not been specified.
Work with the official Noroff API Documentation, plan, design and build a modern front end accommodation booking application. There is two aspects to this brief:
- The customer-facing side of the website where users can book holidays at a venue.
- The admin-facing side of the website where users can register and manage venues and bookings at those venues.
- A user may view a list of
Venues
. - A user may search for a specific
Venue
. - A user may view a specific venue page by
id
. - A user may view a calendar with available dates for a
Venue
. - A user with a
stud.noroff.no
email may register as a customer.
- Editor's Note: While the email HAS to end with
stud.noroff.no
to work, it does NOT actually have to be a real email address. (You could in essence register[email protected]
and it will work.)
- A registered customer may create a booking at a
Venue
. - A registered customer may view their upcomming bokings.
- A user with a
stud.noroff.no
email may register as aVenue manager
. - A registered
Venue manager
may create aVenue
. - A registered
Venue manager
may update aVenue
they manage. - A registered
Venue manager
may dekete aVenue
they manage. - A registered
Venue manager
may view bookings for aVenue
they manage. - A Registered user may login.
- A registered user may update their avatar.
- A registered user may logout.
The development stack used for this project:
- Javascript as the programming language.
- Tailwind as the styling CSS framework.
- Vite as the build tool.
- React as the JS framework.
- React Router DOM for routing.
- React Hook Form as the default submission, validation, state and handling toolkit.
- Demark-Pro React Booking Calendar for displaying customer bookings and dates.
Website Link:
https://cabinquest.no/
Dummy Email:
Dummy Password:
TestingAccountTwo123
- Editor's Note: The API is prone to hard resets so this email/password might not be available in the future, if so and the API docs has not been changed then it is possible to make your own dummy account as long as you end the email with
stud.noroff.no
.
- Clone the repo through github app/website or use the CLI command:
git clone https://github.com/DrRuski/CabinQuest.git
- Install dependencies:
npm i
- Start development server:
npm run dev