Otium is a fictional luxury villa rental brand that offers exceptional villas with top-notch services in Spain, France, and Italy. This project was developed as the final project for the Ironhack bootcamp, where both the frontend and backend of the website/app were created.
Otium features the following sections/pages:
- Homepage: The landing page for the website.
- Destinations: Displays all the available villas.
- Services: Shows all the services provided by Otium.
- Sign up / Log In: Allows users to create an account or log in.
- Account: Lists the user's past and upcoming reservations, favorites, questionnaire results, and personal/contact information.
- Villa: Detailed page for each villa.
- Service: Detailed page for each service.
- About: Provides information about the fictional founders of Otium.
The main challenges faced during the project were:
- Ensuring smooth communication between the frontend and backend.
- Managing date handling and the login functionality, which required dedicated time and effort.
Prior to starting the project, a benchmark study was conducted to capture the dominant colors and tone of voice used by luxury hospitality brands. The name "Otium," meaning "rest" in Latin, influenced the logo design. The voluptuous "O" and the "T" resembling a growing tree were incorporated, with the trunk slowly flowing across the pages like a guiding thread for users. The design mockups can be found : https://www.figma.com/file/zc46H8VXrLGXUpW4LPHpvP/Final-Project-%2F-OTIUM?type=design&node-id=15%3A26&t=JGIVmN0XV7Bi7viB-1.
Otium was built using the following technologies:
- Axios
- React
- Mongoose
- MongoDB
- HTML
- CSS
- JavaScript
- Node.js
To install the required packages, run:
npm install axios
npm install react-datepicker --save
Make sure to import the parseISO function from the date-fns library.
To start the development server, run: npm run dev
I am currently working on further improving the project. Once I have made significant progress, I will redeploy it so you can see the final result!
You can find the front-end of Otium here : https://github.com/maianabertola/front-otium