intern_report-1
intern_report-1
ON
Submitted to
SAVITRIBAI PHULE PUNE UNIVERSITY
CERTIFICATE
This is certify that the Seminar entitled
“Food Delivery App using MERN STACK“
submitted by
is a record of bonafide work carried out by him/her under the supervision and guidance of Prof. Richa
Agarwal in partial fulfilment of the requirement for the TE (Information Technology) 2019 course of
Savitribai Phule Pune University, Pune in the academic year.
Date: 9 / 4 / 2024
Place: Pune
I do hereby declare that the work presented in this report has been carried out by me and has not been
previously submitted to any other university, college, or organization for any academic qualification,
degree, or certificate.
The work I have presented does not breach any existing copyright, and no portion of this report is copied
from any work done earlier for a degree or otherwise.
4 Methodology Used 10
4.1 Agile Methodology Phases . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
6 Analysis of Results 13
6.1 Performance Improvements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
6.2 User Experience Improvements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
6.3 Security Enhancements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
6.4 Scalability Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
7 Conclusion 14
8 Future Scope 15
8.1 Technological Enhancements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
8.2 Performance and Security Improvements . . . . . . . . . . . . . . . . . . . . . . . . . . 15
8.3 User Experience Enhancements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
Food Delivery App Using MERN STACK
1 Introduction
1.1 About the Company & Industry
The internship was undertaken at EY GDS (Ernst & Young Global Delivery Services), a global
leader in IT consulting, digital transformation, and software development. EY GDS is a subsidiary of
Ernst & Young (EY), one of the ”Big Four” accounting firms, providing technology-driven solutions to
clients across various industries.
Project management plays a crucial role in software development, business management, and IT ser-
vices. Companies rely on project management tools like Jira, Trello, Asana, and Monday.com to
streamline workflows, track tasks, and improve collaboration. However, many of these tools are expen-
sive or complex, making them less suitable for small businesses and startups.
This project aims to develop an affordable, open-source project management solution that enables
effective task tracking, progress monitoring, and team collaboration. By utilizing modern web tech-
nologies, the project will offer a cost-efficient and user-friendly alternative to existing tools.
Effective project management is essential for businesses to organize tasks, meet deadlines, and
enhance productivity. Many companies use tools like Trello and Jira for workflow management, but
these applications can be cost-prohibitive or difficult to adopt for smaller teams.
By developing a project management tool using the MERN stack, this internship project aligns with
the industry’s demand for customizable, scalable, and budget-friendly solutions. The tool will facili-
tate team collaboration, real-time task updates, and progress tracking, making it a valuable asset for
businesses of all sizes.
1
Food Delivery App Using MERN STACK
The first week focused on laying the foundation for the Zomato Clone project. Since online food
delivery applications are widely used, extensive research was conducted to analyze existing platforms
and identify essential features for our system.
The research phase helped define the key features such as restaurant listings, food ordering, cart man-
agement, real-time tracking, and user authentication. After finalizing the requirements, the development
environment was set up using the MERN (MongoDB, Express.js, React.js, Node.js) stack to ensure effi-
ciency in full-stack development. Node.js and MongoDB were installed, and the initial project structure
was created. Version control was established using Git, with a repository set up for managing the code-
base.
Additionally, UI/UX design principles were explored to create a user-friendly interface, ensuring
smooth navigation and an intuitive experience. This research phase provided valuable insights into se-
lecting the right tools, technologies, and design strategies for the project. Tasks Completed:
Tasks Completed:
• Market Research:
popular online food delivery apps like Zomato, Swiggy, and Uber Eats.Compared their fea-
tures, UI design, and user workflows. Identified common pain points such as slow loading
time, complex navigation, and limited filtering options.
–• Requirement Analysis:
– Identified core features such as task creation, monitoring, collaboration, and deadlines.
– Discussed the project idea with the mentor and finalized the scope.
• Development Environment Setup:
– Installed Node.js and Express.js for backend development.
– Set up MongoDB for database management.
– Installed React.js for frontend development.
– Configured Git and created a GitHub repository for version control.
• UI/UX Research:
– Studied Zomato’s UI/UX design principles to ensure a visually appealing and intuitive inter-
face.Focused on creating a smooth user experience, easy navigation, and a clean design.
• Challenges Faced:
– Selecting the right features while maintaining a simple and user-friendly experience.
– Understanding best practices for structuring a full-stack web application.
2
Food Delivery App Using MERN STACK
The second week focused on setting up the backend system, with emphasis on authentication, database
structuring, and API development. The objective was to design a robust backend capable of handling user
authentication, data storage, and business logic efficiently.
The backend was built using the MERN stack. Express.js was chosen for server-side logic, while
MongoDB was used for efficient data management. Database schemas were designed for users, projects,
and tasks, ensuring proper relationships and optimal storage.
Security was a key focus this week. Authentication and authorization were implemented using JSON
Web Tokens (JWT) to ensure secure user logins. Passwords were hashed using bcrypt before storage
to enhance security. RESTful API endpoints were developed for user registration, authentication, task
management, and project creation.
Additionally, extensive testing was conducted using Postman to verify API functionality and ensure
proper data storage and retrieval. Debugging authentication logic reinforced security best practices.
Tasks Completed:
• Database Design:
– Designed MongoDB schemas for users, projects, and tasks.
– Established relationships among entities for efficient data storage.
• API Development:
– Developed RESTful API endpoints using Express.js for:
* User authentication (login, registration).
* Task and project management (create, update, delete).
– Implemented input validation using Express Validator.
• Authentication and Security:
– Implemented JWT-based authentication for secure access.
– Used bcrypt to hash user passwords before storage.
– Configured middleware to protect API endpoints.
• Testing and Debugging:
– Tested API endpoints using Postman for data retrieval and validation.
– Resolved CORS issues when connecting the frontend and backend.
– Debugged authentication flow and JWT token expiration issues.
• Challenges Faced:
– Ensuring proper structuring of database relationships.
– Debugging authentication logic and handling token expiration.
3
Food Delivery App Using MERN STACK
This week focused on building the frontend layout and ensuring smooth navigation. Once the back-
end was ready, attention shifted toward user interface development. A project management tool must
have an intuitive and appealing UI; therefore, significant emphasis was placed on user experience and
responsiveness.
React.js was chosen for the frontend due to its component-based architecture, which facilitated easy
management of different sections of the application. The Material-UI library was integrated to provide a
sleek and modern design.
Navigation was a key focus, leading to the implementation of React Router for seamless transitions
between pages. A sidebar was created to facilitate easy access to projects and tasks. The dashboard
layout was finalized, primarily focusing on task assignments and project progress.
This week was dedicated to developing the frontend interface and ensuring a user-friendly design.
Since project management tools require a clean and intuitive interface, significant time was spent re-
searching UI/UX best practices.
4
Food Delivery App Using MERN STACK
With both the backend and frontend set up, the focus this week was on API integration and core
functionality. Axios was used to establish communication between the frontend and backend, enabling
real-time data fetching and updates.
A major milestone was the implementation of food ordering features, allowing users to browse menus,
add items to the cart, place orders, and track their order status. Role-Based Access Control (RBAC)
was introduced to assign different permissions to Admins, Restaurant Owners, and Customers, ensuring
secure access control.
Additionally, a notification system was integrated to alert users about order confirmations and delivery
updates. Real-time order status updates were implemented, enabling orders to transition dynamically
between ”Placed,” ”Preparing,” ”On the Way,” and ”Delivered.”
This week dealt mainly with integrating the frontend with the backend and implementing the major
features. API requests were made using Axios, which allowed communication of data between the client
and server fluidly.
5
Food Delivery App Using MERN STACK
This week focused on rigorous testing and debugging to ensure the smooth functioning of both the
frontend and backend of the food delivery application. Unit tests were conducted on individual compo-
nents, while integration testing was performed to verify seamless interaction between modules like user
authentication, menu browsing, cart management, and order tracking.
Testing revealed several issues, including incorrect cart updates, order status glitches, and UI incon-
sistencies, all of which were systematically resolved. Performance optimizations were also carried out
by minimizing redundant API requests and enhancing database query efficiency.
Additionally, simulated security breaches were attempted to ensure secure user data handling and to
prevent unauthorized access to order and user details. Caching mechanisms were introduced to improve
data retrieval and response times.
This week was dedicated to detailed testing and debugging to ensure smooth functionality across all
features. Unit testing focused on API endpoints such as login, menu fetching, cart updates, and order
placement, while integration testing verified data consistency across components. Issues like session
expiration, duplicate order placement, and inconsistent UI behavior were identified and resolved.
Tasks Completed:
• Conducted unit testing on food menu, cart, and order-related API endpoints.
• Performed integration testing between authentication, order placement, and delivery tracking mod-
ules.
• Resolved authentication issues including token expiration and incorrect session handling.
• Optimized database queries to reduce order and menu loading time.
• Fixed UI glitches on the homepage, cart section, and order status dashboard.
Key Highlights of the Week:
• Successfully conducted unit and integration testing across all critical features.
• Resolved session-related bugs and fixed cart/order UI inconsistencies.
• Improved performance by optimizing API calls and introducing caching mechanisms.
Debugging & Optimization:
• Fixed session handling issues and JWT token mismanagement.
• Addressed UI glitches in responsive views for cart and order pages.
• Optimized API performance by reducing redundant calls and implementing data caching.
Challenges Faced:
• Identifying hidden performance bottlenecks in large order histories.
• Debugging asynchronous API requests for real-time order status updates.
6
Food Delivery App Using MERN STACK
The final week focused on deploying the food delivery application and preparing complete project
documentation. The frontend was deployed on Vercel, while the backend was hosted on Render, ensuring
a stable and accessible full-stack deployment. Security of environment variables was ensured to protect
API keys, payment gateway credentials, and database connections.
Comprehensive documentation was created, detailing the system architecture, database schema, core
functionalities, and user roles. A user manual was also prepared to guide customers, restaurant own-
ers, and admins in navigating the application. The project was finalized with a demonstration-ready
presentation and report.
The frontend was made publicly accessible via Vercel, while the backend services continued to run
on Render. Sensitive information was secured using ‘.env‘ files and server-side configuration.
Tasks Completed:
• Deployed the frontend on Vercel and backend services on Render.
• Conducted final end-to-end testing to ensure smooth order flows and secure logins.
• Created user guides for all user types: Customers, Restaurant Owners, and Admins.
• Documented the project thoroughly, including:
– System architecture and tech stack.
– API reference and endpoint descriptions.
– Suggestions for future enhancements (e.g., payment gateway integration, delivery partner mod-
ule).
• Conducted the final presentation showcasing major features and real-time flow.
Documentation & Finalization:
• Prepared API and database schema documentation.
• Wrote user manuals and developer notes.
• Finalized the project report and created a live demo presentation.
Key Highlights of the Week:
• Successfully deployed the full-stack application on Vercel and Render.
• Completed structured documentation and guides for future reference.
• Delivered a smooth final presentation with working features demo.
Challenges Faced:
• Addressing deployment-related errors during environment variable setup.
• Completing extensive documentation within the set timeline.
7
Food Delivery App Using MERN STACK
• Lack of accessible online ordering systems – Many local restaurants still rely on traditional or-
dering methods.
• Poor user interface in existing apps – Users often experience navigation difficulties and slow
response times.
• High commission fees – Established platforms charge hefty commissions, reducing profits for
restaurant owners.
2.2 Objectives
The primary objectives of this project are:
• To develop a responsive Food Delivery Web Application using the MERN Stack.
• To enable users to browse restaurants, view menus, and place orders efficiently.
• To implement role-based functionality for Admins, Restaurant Owners, and Customers.
• To provide a smooth and intuitive user experience for both desktop and mobile views.
8
Food Delivery App Using MERN STACK
9
Food Delivery App Using MERN STACK
4 Methodology Used
The development of the food delivery application (Zomato Clone) followed the Software Development
Life Cycle (SDLC) with a focus on the Agile methodology. Agile enabled incremental progress, con-
stant feedback, and iterative refinement of features.
10
Food Delivery App Using MERN STACK
• User Authentication
– JWT-based secure login and registration system.
– Encrypted passwords using bcrypt for enhanced security.
• Restaurant & Menu Management
– Display of multiple restaurants with images, names, and categories.
– Detailed menu for each restaurant with dynamic food item listing.
• Cart Functionality
– Users can add/remove items to/from cart with quantity updates.
– Total price calculation and cart state management.
• Order Placement
– Seamless order placement with summary details (restaurant, food items, amount).
– Order confirmation page with tracking option (basic simulation).
• Responsive UI & Navigation
11
Food Delivery App Using MERN STACK
12
Food Delivery App Using MERN STACK
6 Analysis of Results
6.1 Performance Improvements
• Optimized API response time by 25% by refining MongoDB queries and adding appropriate in-
dexes.
• Improved page load speed through lazy loading of images and components.
• Reduced redundant API calls using client-side caching with React Context API.
• Implemented pagination on restaurant and menu listings to improve data handling and reduce load
time.
• Minimized payload size by enabling Gzip compression on server responses.
• Utilized image hosting via Cloudinary CDN for faster and efficient media delivery.
13
Food Delivery App Using MERN STACK
7 Conclusion
The internship provided a valuable opportunity to work on a real-world application, leading to the
successful development of a fully functional Online Food Delivery App (Zomato Clone) using the
MERN stack. The project addressed essential aspects of modern food delivery systems such as restaurant
listing, menu browsing, cart management, and order placement.
Additionally, the project provided insights into real-world challenges such as:
• Database Structuring – Designed an efficient MongoDB schema for scalability and performance.
• UI/UX Design – Developed a responsive and engaging interface for end-users.
• State Management – Effectively handled cart and authentication state in React.
• Error Handling – Ensured stability through proper error messages and backend validations.
This internship significantly enhanced understanding of modern web development practices, project
deployment, and real-time user interaction handling. The skills acquired during this experience will
contribute greatly to future projects and professional growth in the technology domain.
14
Food Delivery App Using MERN STACK
8 Future Scope
The Zomato Clone has a strong foundation, but several features and enhancements can be added in
the future to further improve the system’s usability, scalability, and competitiveness. Some potential
developments are:
15