Booking Buddies, because your sofa has seen enough of you.
This project was built using the Booking Buddies API, providing a dynamic frontend from an event planner's point of view. Here the admin can create, update and delete bookings.
Here are a few of the features included within our application.
- Display each booking from the API on the website's main page (dashboard):
- Implement CRUD functionality into booking component
- Update a booking by:
- Adding/removing users
- Changing the date/time
- Changing the venue
- Changing the hobby
- Create a nav bar containing each webpage
- Add styling
- Provide a webpage for creating, updating and deleting Hobbies, Venues and Users
- Manage a Hobby, Venue or User by:
- Changing the User's/Hobby's/Venue's name
- Changing the Venue's location
- Changing the Venue's capacity
- Assign a user a Hobby
- Assign multiple users when creating a booking
- Add functionality to searchbar's for each component
- Remove a user from a booking
- Create a sort function that lists upcoming bookings by date/time
- Couldn't patch multiple attributes of a booking simultaneously.
- Since we changed the format of the input to a date picker, couldn't pre-populate the date input on the update booking form.
- When submitting an updated booking, the newly updated booking wasn't rendering on the dashboard without refreshing.
- Couldn't load data into update booking component with loader function.
- Variable renaming was the solution for a lot of issues.
- Drawing component diagram, we added too many pages and blurred the lines between MVP and extensions.
-
Clone the repository:
git clone [email protected]:ornerykiwi/booking_buddies_frontend.git cd week_11_frontend_project
-
Install packages and run front end server:
Install packages and run server in the terminal using the following command:
npm i npm run dev -
Build and Run the Application in IntelliJ
The API will then be available at http://localhost:5173
- JavaScript/React
- HTML/CSS
- react
- react-dom
- react-router-dom