- Phase 0
- Phase 1
- 💻 Screens
- Home-page
- Register/Login
- About-us
- Admin-actions-confirmed
- Booking
- Dish-information
- Edit-dish
- Edit-profile
- Error
- Faqs
- Menu
- New-dish
- Order-confirmation-screen
- Order-manager
- Order-summary
- Order-summary-admin
- Orders-list
- Pickup-delivery-order
- Profile
- Rate-order
- Ban-message
- Manage-user
- Restaurant-availability
- Restaurant-information
- Restaurants
♦️ Flow Diagram- Phase 2
- Phase 3
- Phase 4
- 💻 Screens
| Name and surname | github | |
|---|---|---|
| Nicolás Hernández Tejero | n.hernandezt.2021@alumnos.urjc.es | nicohht |
| Hugo Sánchez Torres | h.sanchez.2021@alumnos.urjc.es | stHugo010 |
| Juan Ramírez Blanco | j.ramirez.2021@alumnos.urjc.es | juanramirezbl |
| Jesús López Esquinas | j.lopeze.2020@alumnos.urjc.es | jesuslpzZz |
| Víctor Muñoz Regalón | v.munozr.2020@alumnos.urjc.es | victoor-78 |
This tool offers a Kanban-like organization, allowing us to view at any time and from any location the section of the software that is under development, completed, or pending. Trello link
The main entities that the application will manage are:
- Users
- Orders
- Dishes
- Promotions
- Reviews
- Restaurants
- Reservations
🔀 Main relations between entities: Users can be anonymous users, admins, or customers. Customers can place orders with one or more dishes and rate each dish apart from make reservations at one of the restaurants. Admins can add dishes to the menu. Orders contain the dishes, the price, the user information and delivery address. Restaurants contain dishes, reservations, reviews and promotions. Dishes contain the promotions about them.
- Register/Login system for accounts
- Modify account information
- View the restaurant information
- View the menu dishes
- Search with filters
- Book a restaurant table
- Place an order for take-away or delivery
- Check order history
- Rate the dishes
- Download the digital receipt as a PDF file
- Send notifications about orders
- Modify and manage the orders, reservations, menu and products
- Manage user accounts
- Consult graphs about orders
The permissions of each of the user types are:
- Anonymous: View the menu and dishes, search for dishes, view promotions, reserve a table at the restaurant, check out news and updates, about us section, view the restaurant's location.
- Registered: Order for delivery, rate orders, access order history, view public ratings for each dish and your own ratings for each dish.
- Admin: All the permissions of a registered user, remove dishes from the menu, modify dishes, modify reservations, add new dishes to menu, block users, unblock users, cancel orders, view the graphs with order statistics.
The images mentioned are related to the entities mentioned above.
- Favicon of the web page.
- Dish Photos.
- Stands Image (Restaurant).
- Restaurant logo.
The information that will be displayed using graphics is:
- Average orders per hour: Table
- Top 10 best-selling dishes with the number of orders on that day: Table
- The 15 best-rated dishes along with their number of ratings: Table
The complementary technology to be used is:
- Our application allows users to generate a PDF receipt for their orders.
- Our application calculates the estimated delivery time based on the restaurant's address and the delivery address provided by the customer.
The algorithm or advanced query to be implemented is:
- Automatic classification when submitting the match report.
- Advanced statistics of matches by team/player.
- Search bar on teams and players pages.
Voltereta Croqueta's home screen features a welcoming interface with navigation options. It highlights the restaurant's main features, such as expert chefs, quality food, online ordering and 24/7 service. It also includes a welcome section describing the restaurant's experience and history, along with information about years of experience and popular chefs.
The login screen for Voltereta Croqueta provides a simple and user-friendly interface for users to access their accounts. It features fields for entering a username and password, along with a "LOGIN" button to submit the credentials. Additionally, there are options to sign up for new users who do not yet have an account.
This screen provides detailed information about Voltereta Croqueta, highlighting its culinary philosophy and commitment to fresh ingredients and authentic recipes. It includes a brief history of the restaurant and a list of the master chefs, each specializing in different types of cuisine.
This screen confirms that an operation (such as a reservation or order) has been successfully completed. It displays a clear confirmation message and a button to return to the home page.
This screen allows users to book a table at Voltereta Croqueta. It includes options to choose a restaurant, specify the number of people, select the date and time, and provide reservation details such as name, last name, email, and phone number. A "CONFIRM ORDER" button finalizes the reservation.
This screen confirms that a user's reservation has been successfully placed. It provides a thank-you message and informs the user that they will receive a confirmation email shortly. A "BACK TO HOME" button allows users to return to the main page.
This screen provides detailed information about a specific dish. It includes the dish's description, price, ingredients, and allergen information. Additional notes remind users to inform the restaurant of any dietary restrictions. Options to edit the dish, mark it as unavailable, or delete it are available for management purposes.
This screen allows for the editing of dish details, such as the name, description, price, and ingredients. It also includes a comprehensive list of allergens and dietary preferences, such as vegan options. A "SAVE CHANGES" button is provided to update the dish information.
This screen allows users to view and edit their profile information. It includes fields for name, email, phone number, and address. Users can save changes or cancel the edits. The interface is straightforward, with clear options for updating personal details.
This screen is displayed when a user tries to access a page that does not exist. It features a clear message indicating that the page is not found and provides options to return to the homepage or contact support for further assistance. The design is simple and user-friendly, ensuring users can easily navigate back to the main site.
This screen provides answers to frequently asked questions about the restaurant, including reservations, menu options, allergens, and more. It also includes a section for customer testimonials, highlighting positive experiences from various patrons. The interface is informative and well-organized, making it easy for users to find the information they need. Contact details and opening hours are also provided for quick reference.
This screen displays the food menu of Voltereta Croqueta, allowing users to search for their favorite dishes. It features a variety of dishes categorized by type, such as breakfast and dinner, with brief descriptions for each. A "VIEW MORE" option suggests additional dishes are available.
This screen allows administrators to add a new dish to the menu. It includes fields for the dish name, description, price, and ingredients. There are also options to select allergens and dietary preferences, such as vegan options. An upload feature for dish images is included. The "ADD DISH" button finalizes the addition.
This screen confirms that a user's order has been successfully placed. It provides a thank-you message and informs the user that they will receive a confirmation email shortly. A "VIEW LAST ORDERS" button allows users to check their orders list.
This screen allows administrators to manage restaurant orders. It displays a list of current orders with details such as order number, date, total amount, and ordered items. Each order includes options to view more details, cancel, or accept the order. A progress tracker shows the number of active orders and the order limit. The interface is designed for easy order monitoring and management.
This screen provides users with a detailed summary of their order before proceeding to payment. It displays the list of ordered items, their quantities, individual prices, and the total cost, including delivery fees. The selected delivery address is also shown. Users have the option to go back, cancel the order, or proceed to payment. The interface ensures clarity and ease of navigation for a smooth checkout experience.
This screen is designed for restaurant administrators to review and manage customer orders. It displays a detailed summary of each order, including the order number, list of purchased items with their quantities, individual prices, and the total cost, including delivery fees. Additionally, it provides customer information, such as name and delivery address, as well as the restaurant location associated with the order.
Admins can also see whether the order is for pickup or delivery, with an option to modify this selection. A "Back" button allows them to return to the order management interface. The layout ensures clarity and ease of navigation, helping staff efficiently process and verify orders.
This screen allows customers to view their past orders. It displays order details, including the date, order number, and total price. Each order card lists the ordered items, their quantities, and individual prices. Customers can access additional options, such as viewing more details, downloading the receipt, reordering, or rating their experience.
This screen allows customers to choose between pickup and delivery options for their orders. Users can select their preferred order type and fill out the necessary details, such as location, name, and time for pickup or address and contact information for delivery. A simple interface ensures an easy and efficient ordering process, with a "Confirm" button to finalize the selection.
This screen displays the user profile information for Voltereta Croqueta. It includes essential details such as name, email, phone number, and address, allowing users to review their personal data. The interface offers quick access to actions like editing the profile, viewing past orders, or returning to the homepage. A clean layout ensures easy navigation for managing account details.
This screen allows users to view and rate their past orders. It includes details like the order number, date, and the dish's name with a description and price. Users can provide feedback by rating their dish with a star-based system and submitting their review. A "Back to Order" button ensures easy navigation to previous orders. The clean and structured layout ensures a user-friendly experience.
This screen displays a notification to the user, JohnDoe123, informing them that their account has been suspended due to violations of the platform's terms of service. The message is clear and direct, providing the user with the option to contact the support team if they believe the suspension is a mistake. The "CONTACT SUPPORT" button is prominently displayed, guiding the user on the next steps to resolve the issue.
The User Management screen provides administrators with a comprehensive overview of all registered users on the Voltereta Croqueta. It features a search bar for quick user lookup and a table displaying user details, including ID, Username, Email, Status (Active or Banned), and Actions (represented by icons for managing user accounts). The interface is designed for efficiency, allowing admins to easily monitor and manage user statuses and perform necessary actions such as banning or unbanning users.
This screen provides an overview of the reservation status for different restaurants of Voltereta Croqueta. It includes a table that lists the restaurant, date, total reservations, available seats, and the current status (Available or Full). Each entry also has an option to "View Details" for more information. The interface is designed to help restaurant staff quickly assess availability and manage reservations efficiently.
This screen provides essential details about Voltereta Móstoles, including its address, contact information, and opening hours. Users can explore available services such as accessibility, WiFi, and delivery. The page also features booking and ordering options, along with images of the restaurant and its location on Google Maps.
This screen allows users to explore the various locations of Voltereta Croqueta. It features a search bar for finding nearby restaurants and a "Use My Location" button for convenience. Users can view popular restaurants through images and interact with an embedded Google Maps preview for easy navigation.
The diagram is a flow chart showing user permissions and navigation steps within a web interface. The diagram uses colored arrows to indicate the progression from one web page or state to another, based on user actions or permissions.
- The diagram is a complex schematic with multiple screenshots of web pages connected by colored arrows indicating different user actions or states.
- Each screenshot represents different sections or pages of a restaurant website.
- There is an initial state at the top: "Index", leading to different paths depending on the user's status.
- Arrows connect these initial state to various web pages, including "Menu", "Restaurants", "Profile" and diferent admin workflow pages, among others.
- Each colored arrow represents a user, and therefore the path through which he/she can navigate the site.
- Red arrows represent Admin functions, the green ones are for Registered User and the blue arrows are for every user.
This image shows the menu page of "Voltereta Croqueta". Users can browse a list of available dishes, each displayed with an image, description, price, and rating. Each dish has options to add to cart or view more details. There are also buttons to filter dishes, load more dishes, and add a new dish if the user has admin permissions.
This image shows the Booking Management Panel for Voltereta Croqueta, where admins can view and manage reservations. It includes a search bar, a reservation list with details (user, restaurant, shift, people, and date), and a delete button for easy management.
This image displays the Dish Management Panel for Voltereta Croqueta, where admins can manage the restaurant's menu. It includes a search bar, a list of dishes with their prices, and edit/delete buttons for easy modifications.
This image showcases the User Management Panel for Voltereta Croqueta, allowing admins to manage user accounts. It includes a search bar, a list of users with emails and statuses, and ban/unban buttons for controlling access.
This screen displays detailed information about a specific dish, including its name, description, price, ingredients, and allergens. Admins can edit, mark as unavailable, or delete the dish.
This image showcases the interface for editing dish details. Admins can modify the dish name, description, price, ingredients, and allergens before saving changes.
This screen provides a form for adding a new dish to the menu. Admins can input dish details, select allergens, dietary preferences, and upload an image.
This screen presents the reservation form, enabling users to select a restaurant, date, shift, and number of people, while providing personal details to confirm the booking.
This image shows the notification for users who already have an active reservation, preventing duplicate bookings and directing them to manage their reservation in the profile section.
This confirmation screen informs users that their reservation has been successfully cancelled, offering a direct link to rebook a table.
This screen displays user profile details, including personal information and an active reservation summary, with the option to cancel the booking directly from the page.
This page lists available restaurant locations, providing images and addresses, along with a search bar to filter by city or postal code.
This image shows the Order Summary page of "Voltereta Croqueta". It displays the items in the user's order, including the dish name, description, and price. Below, it calculates the subtotal, delivery fee, and the total cost. There is a field to enter the delivery address and buttons to go back, cancel the order, or proceed with payment. The footer contains contact details, opening hours, and restaurant locations.
This image shows the Order Confirmation page of "Voltereta Croqueta". It thanks the user for their order and informs them that Order #6 is ready for payment. A "Confirm Payment" button allows the user to finalize the transaction. The footer contains links to company information, contact details, opening hours, and restaurant locations.
The "Order History" page of Voltereta Croqueta allows users to review their past purchases, including order details, total cost, and item descriptions, providing a clear record of their dining history.
The "Order Management" page of Voltereta Croqueta provides administrators with a centralized interface to track, update, and manage customer orders, including status changes, price details, and user information.
This image shows the Payment Successful page of "Voltereta Croqueta". It confirms that Order #6 has been successfully paid and thanks the user for their payment. A "Back to Orders" button allows the user to return to their order history. The footer contains company information, contact details, opening hours, and restaurant locations.
This panel serves as the main admin interface, allowing access to various management functionalities such as user administration, dish control, and booking supervision.
This modal appears when performing critical actions, such as deleting a reservation, requiring users to confirm before proceeding.
The diagram is a flow chart showing user permissions and navigation steps within a web interface. The diagram uses colored arrows to indicate the progression from one web page or state to another, based on user actions or permissions.
-
Download the Repository
-
Check Requirements:
- Java JDK 19
- MySQL v.8.0.36.0
- Maven 4.0.0
- Spring Boot v3.4.2
- Integrated Development Environment (IDE) - IntelliJ IDEA recommended
- Configure Database:
- Download MySQL v.8.0.36.0
- Select default port (port 3306)
- Create a user with name root "root" and password "webapp07" with DB admin as user role
- Configure MySQL Server as Windows Service
- Grant full access to the user
- Docker Configuration:
- Download Docker desktop.
- Execute in terminal:
- docker run -d --name volteretaCroquetaBD -p 3306:3306 -e MYSQL_ROOT_PASSWORD=webapp07 -e MYSQL_DATABASE=volteretaCroqueta mysql:latest
- docker exec -it volteretaCroquetaBD bash
- Configure IDE:
- Install IntelliJ IDEA (or your preferred IDE).
- Install Maven and Spring plugins for your IDE.
- Run Application in the IDE:
- Open the project in your IDE.
- Build the project using Maven.
- Run the application.
- Access the Application:
- Visit https://localhost:8443 in your web browser.
Next, a diagram will be included depicting the entities within the database, their respective fields, and the relationships among them.
- Implemented error handling across the application to improve reliability.
- Added Javadocs for better code documentation and maintainability.
- Developed reusable Navbar, Header, and Footer components for consistent UI.
- Created Admin Panel to manage users and dishes efficiently.
- Designed a confirmation modal for critical user actions.
- Implemented show and edit profile functionality.
- Added ban/unban functionality for user management.
- Secured authentication for all views, ensuring restricted access based on roles.
- Developed login and registration functionality for new users.
- Strengthened security in the login process to prevent unauthorized access.
- PDF generation
- Developed the booking system for users, allowing them to make, view, and cancel reservations.
- Ensured that users can only have one active reservation at a time to prevent duplicate bookings.
- Implemented real-time availability checks for restaurant reservations based on date, shift, and capacity.
- Created the booking confirmation and cancellation views, improving user experience.
- Developed the admin panel for booking management, allowing administrators to view and delete the active reservations.
- Integrated AJAX-based dynamic seat availability updates when users select a restaurant and shift, allowing real-time updates without reloading the page.
- Implemented flash messages for errors and confirmations in booking actions.
- Developed the profile page integration to display the user’s current reservation with a cancel button.
- Designed and implemented the database structure for bookings, linking users and restaurants.
- Ensured that users can only make reservations for available seats to prevent overbooking.
- Developed the application's dish menu.
- Implemented dynamic data loading based on AJAX, taking filter values into account.
- Developed the functionality to edit, add, and delete dishes.
- Implemented a filter fragment for the application's menu.
- Developed a filter for the dish menu, with the ability to filter by name, by an ingredient, or by maximum price.
- Mark dishes as disabled.
- Added image implementation using Blob.
| # | Commit | # | File | |
|---|---|---|---|---|
| 1º | Fix: Menu's Ajax | 1º | dishes.js | |
| 2º | Fix: Add and edit dishes | 2º | DishController.java | |
| 3º | Update: Filter done | 3º | DishController.java | |
| 4º | Update: can add dish to cart at ajax script | 4º | dishes.js | |
| 5º | Update: Dish rates | 5º | DishController.java |
- Order System Architecture: Developed a structured and scalable approach for managing orders.
- Order Summary Screen: Created a detailed breakdown of the user's order before payment.
- Add to Cart Button: Helped implement functionality allowing users to dynamically add items to their cart.
- Pay Button: Implemented secure payment processing functionality.
- Order Confirmation & Success Screens: Designed and developed screens to enhance the user experience after a purchase.
- View Orders Button: Enabled users to access their order history.
- Order History Section: Created a comprehensive list of paid orders.
- Order Admin Structure: Created the structure to efficiently manage and oversee orders.
- Modify Order & Delete Order Buttons: Developed functionality for administrators to update or remove orders as needed.
- Class Diagram & Templates: Developed structured foundations for order management and UI consistency.
- Constantly reviewed the application's status across all its sections.
- Fixed various types of issues throughout the application (styling, naming, links & functions).
- Added the HTTPS protocol with its respective certificate.
- Implemented the anti-CSRF verification system and introduced token renewal in all necessary places.
- Fixed the CustomErrorController system.
- Added differentiation between different types of errors (this change is reflected on the error page).
- Improved web security for proper flow and permission handling.
- Implemented the Restaurant Availability system (both page and controller).
- Added RestaurantController
- Redesigned the restaurant page and added a search system.
- Created the administrator Dashboard system, which includes the chart and future charts to be developed.
- Enhanced user data privacy by preventing others from accessing confidential information.
- Fixed the GET and POST system for all Order-related methods to ensure proper functionality.
The REST API documentation is automatically generated and can be accessed in the following formats:
To generate or update this documentation, follow these commands:
- Change to the directory containing the
pom.xmlfile:cd backend - Then, use the command to generate or update the documentation:
mvn verify
To run the application using the docker-compose.yml file, follow these instructions:
- Docker installed on the host machine
- Docker Compose installed on the host machine
-
Clone the repository of the application using Git:
git clone https://github.com/CodeURJC-DAW-2023-24/webapp16
-
Navigate to the directory where the docker-compose.yml file is located.
-
Open a terminal or command prompt.
-
Run the following command to start the application:
docker-compose up
This command will start the application.
-
Wait for the application to be fully deployed.
Once the application is ready to be used, you can access it through a web browser using the following URL:
http://localhost:8443
To build the dockerized image of the application, follow these instructions:
- Docker installed on the host machine
-
Clone the repository of the application using Git:
git clone https://github.com/CodeURJC-DAW-2024-25/webapp07
-
Navigate to the docker directory of the application.
-
Open a terminal or command prompt.
-
Execute the following command to build docker image and push it to your repository to publish the image:
./create_image.ps1 ❗ ❗ You will have to modify the username to your docker username to run it. This script will publish the docker image.
- Wait for the docker image to be built.
- Operating system: Ubuntu 22.04
- Provided Private Key : 'prAppWeb07.key'
- Active internet connection to Eduroam
-
Ssh connection
Connect to the virtual machine using SSH with the provided private key.
ssh -i ssh-keys/appWeb07.key vmuser@10.100.139.50
-
Docker and Docker Compose Installation
Install Docker and Docker Compose on the virtual machine following the official instructions:
- Docker: Installation instructions for Ubuntu
- Docker Compose: Installation instructions
-
Repository Cloning
Clone the application repository using Git.
git clone https://github.com/CodeURJC-DAW-2024-25/webapp07
-
Application Execution
Run the application using the
docker-compose.ymlfile. Add the-doption to run in the background.cd webapp07/docker sudo docker compose up -d -
Accessing the Application
Once the application is running, you can access it from a web browser using the virtual machine's IP address and port 8443.
https://10.100.139.50:443
These steps will guide you through the process of deploying the application on the provided virtual machine. Make sure to follow each step carefully to ensure a successful deployment.
The application can be accessed at the following URL:
https://10.100.139.50:443
Below are the credentials for example users, including an administrator user, to test the application:
| User Type | 👷 Username | 🔒 Password |
|---|---|---|
| Administrator | admin | adminpass |
| User | user | pass |
- OpenAPI Integration for REST Documentation: I integrated springdoc-openapi into the project to automatically generate interactive Swagger UI documentation for all REST endpoints, improving both developer experience and API discoverability.
- Comprehensive DTO Annotations: I fully annotated the UserDTO, DishDTO, and OrderDTO classes using @Schema, providing clear descriptions, examples, and field-level documentation for Swagger.
- I implemented a centralized RestExceptionHandler using @RestControllerAdvice to handle various exceptions globally, returning clean and consistent JSON responses for errors like validation, type mismatch, bad credentials, and not found resources.
- Security Filter Chain for REST: I configured the SecurityFilterChain for /api/** routes to: Support JWT authentication, define fine-grained access rules for public, user, and admin routes, disable CSRF, form login, and basic auth for stateless API behavior
- Introduction of Sample Data via Postman: I introduced sample data into our application using Postman. This involved creating a collection of requests, each with its own set of parameters, headers, and body data.
- REST Controller Refactoring and Annotation: I reviewed and updated the UserRestController, DishRestController, and OrderRestController, ensuring proper usage of @Operation, @ApiResponses, and appropriate HTTP status codes
- Thorough Error Testing: I manually tested scenarios such as invalid user IDs, malformed JSON, unauthorized access, missing parameters, and non-existent endpoints to verify proper error propagation and consistent response formatting.
- User Management API (UserRestController): Implemented endpoints for fetching all users and specific users by ID, creating new users, updating, banning/unbanning, and deleting users, searching users by query, and fetching the authenticated user (/me).
- Booking REST API Development: I developed the BookingRestController including endpoints for creating, retrieving, deleting, and searching bookings, following REST principles and using DTOs.
- User Authorization Validation: I implemented logic to ensure that users can only create bookings for their own user ID, returning a 403 Forbidden status with a custom message if they attempt otherwise.
- Single Active Reservation Logic: I enforced that each user can only have one active reservation at a time, returning a 409 Conflict if they already have one.
- Swagger Documentation: I added @Operation and @ApiResponses annotations to all REST endpoints for auto-generating interactive API docs with Springdoc OpenAPI.
- GET /me Endpoint: I created an endpoint to allow authenticated users to retrieve their active booking, improving transparency and usability.
- Advanced Search Endpoint: I implemented /search with optional filters such as user info, date, shift, and restaurant ID, enabling admin-level filtering of bookings.
- Seat Availability Checks: I validated booking capacity in the service layer, ensuring no more than 40 people per shift in each restaurant.
- Postman Collection Setup: I tested all REST endpoints by creating a complete Postman collection, including login, booking creation, deletion, and filter scenarios.
- Profile Integration: I connected the REST booking logic to the traditional web app to display the user’s current booking in their profile.
- BookingService Refactoring: I centralized all business logic in the BookingService class, keeping the controller clean and focused on HTTP concerns.
- Order DTO Structure Creation: Designed and implemented the structure of the Order DTOs, ensuring a clear and maintainable representation of order-related data throughout the application.
- OrderRestMapping Refactoring: Refactored the OrderRestMapping to ensure correct API behavior, aligning data transformation between entities and DTOs for seamless REST operations.
- Sample Data via Postman: Created sample data using Postman to test each API method. This included setting up a comprehensive collection of requests with appropriate parameters, headers, and JSON bodies.
- Thorough Error Testing: Conducted extensive testing of authorized and unauthorized requests depending on user roles and access levels, verifying the correct enforcement of security and consistent error responses.
- OpenAPI Documentation of OrderRestController: Documented the entire functionality of the OrderRestController using OpenAPI annotations, providing clear descriptions, response types, and HTTP codes for all endpoints to improve API clarity and developer experience.
- Service Layer Refactoring: Delegated all business logic to the OrderService, ensuring a clean separation of concerns. The controller now simply handles HTTP requests and responses, while the service returns fully prepared DTOs.
- Docker Configuration: Configured Docker to create reproducible and scalable containers, facilitating the deployment and management of the application across different environments.
- Refactoring of Methods Related to Dish and Order: Refactored methods related to Dish and Order to improve code efficiency and readability, ensuring better separation of concerns and clearer logic.
- Introduction of Necessary Endpoints for the API: Implemented the necessary endpoints for the API, enabling complete CRUD operations and ensuring smooth communication between the frontend and backend.
| # | Commit | # | File | |
|---|---|---|---|---|
| 1º | Update: docker files | 1º | docker-compose.yml | |
| 2º | Update: DishRestController refactor | 2º | DishRestController.java | |
| 3º | Update: docker | 3º | Dockerfile | |
| 4º | Update: DishService | 4º | DishService.java | |
| 5º | Update. last dance | 5º | DishController.java |
- Assisted in the implementation of various methods within the application
- Implemented the RestaurantDTO along with the corresponding refactoring in RestaurantController and RestaurantService
- Created the RestaurantRestController, which contains additional functions compared to the previous version
- Developed the Dashboard function along with its corresponding method in DishRestController and refactored DashboardController
- Ensured that all methods outside the Service work with DTOs instead of entities
- Updated the Postman file with various requests to verify the API functionality
To Setting Up the Development Environment, follow these instructions:
- Node and npm installed on the host machine
- Angular CLI installed on the host machine
-
Installing Node.js and npm:
Before starting to work with the SPA application developed with Angular, it's necessary to have Node.js and npm (Node Package Manager) installed. You can download and install Node.js from the official website: Node.js. npm will be installed automatically along with Node.js.
Node.js: Installation Node.js
-
Installing Angular CLI:
Angular CLI (Command Line Interface) is a command-line tool that facilitates the creation, compilation, and execution of Angular projects. To install Angular CLI, open a terminal or command prompt and execute the following command:
npm install -g @angular/cli
-
Repository Cloning
Clone the application repository using Git.
git clone https://github.com/CodeURJC-DAW-2024-25/webapp07
-
Installing Dependencies
Once you have cloned the repository, navigate to the project directory and execute the following command to install all project dependencies:
cd webapp07 npm install -
Compiling and Running the Application
Once you have installed all dependencies, you can compile and run the Angular application locally. Use the following commands in your terminal:
ng serve --proxy-config proxy.conf.json
- I have migrated the booking management to Angular SPA.
- I have implemented the advanced search filters in booking management.
- I have added a clear button to reset the admin booking search.
- I have fixed the cart and order summary to display dish prices correctly.
- I have updated the total order price to include the delivery fee.
- PDF Invoices: Implemented dynamic PDF generation with Angular download integration
- Order Validation: Added address requirements & paid order redirection guards
- Security: Enforced admin action protections & route-based access controls
- UI Migration: Converted order history to Angular cards & FAQ accordion component
- Deployment: Dockerized Angular+SpringBoot stack with SPA routing optimizations
- Error Handling: Fixed price formatting bugs & profile NPEs in order flow
- Performance: Optimized scroll transitions & auth state management with RxJS
- Content: Migrated about/team sections & added dish availability filters
- Maintenance: Removed legacy JS scripts & streamlined API endpoints
- Auth: Upgraded token rotation & implemented 401 error component
- I have implemented the restaurant page with its corresponding search bar
- Created the calculation and drawing of the existing chart in the Dashboard
- Fixed and added the remove button in the cart following best practices
- Made small corrections and improvements to the system
- Implemented cart functionality and logic for adding dishes to the cart.
- Implemented order management functionality for the admin panel.
- Implemented order history functionality for the user profile.
- Development of the component diagram
| # | Commit | # | File | |
|---|---|---|---|---|
| 1º | Add: Delete Order | 1º | Manage-orders.component.ts | |
| 2º | Add: Order History | 2º | Order-history.component.ts | |
| 3º | Add: Cart Works | 3º | cart.component.ts | |
| 4º | Add: Clear Cart | 4º | Cart.component.ts | |
| 5º | Fix: Summary Page | 5º | summary.component.ts |
- I have done the Docker implementation.
- I have done the pagination of menu.
- I have done the managment of the dishes' images.
- I have implemented the disheseComponent.
| # | Commit | # | File | |
|---|---|---|---|---|
| 1º | Update: Docker files | 1º | Dockerfile | |
| 2º | Update: add frontend pagination | 2º | menu.component.ts | |
| 3º | Update: menu and dishDetails | 3º | menu.component.ts | |
| 4º | Fix: dish allergens | 4º | dish-form.component.ts | |
| 5º | Update: add dish rating | 5º | dish-rating.component.ts |