Batch 2023- 2026

Project Report
On
“MY FAST FOOD WEBSITE”

Prepared for
Continuous Assessment 3
2024

PROJECT SUBMIT: - SUBMITTED BY: -

Dr.Kartik Paneerselvam AFTAB ALAM
Reg no: - 12303861
 DECLARATION

I hereby declare that the project work entitled “MY FOOD WEBSITE”
submitted to the LOVELY PROFESSIONAL UNIVERSITY is a record
of an original work doneby me under the guidance of “Dr.Kartik
Paneerselvam”, and this project work is submitted in the partial
fulfillment of the requirements for the award of the degree of
BACHELOR OF COMPUTER ENGINEERING. The results
embodied in this thesishave not been submitted to any other University or
Institute for the award of any degree or diploma.

Aftab Alam

Reg no:-12303861

Session: - 2023-2026
TABLE OF CONTENTS PAGE NO

1. INTRODUCTION ............................................................. 09

2. OBJECTIVE OF THE PROJECT ................................ 10

3. SYSTEM CONFIGURATION ........................................ 12

4. SYSTEM IMPLEMENTATION .................................... 14

5. ADVANTAGES OF TESTING............................................. 47

6. CONCLUSION .................................................................. 50

7. A D R E E S S … … … … … … … … … … … … … … … 5 1

8. P A Y E M N T P R O O F … … … … … … … … … … . . 5 2

9. P R O O F I D … … … … … … … … … … … … … … . . 5 3
 ABSTRACT

This Food delivery project is based on Web Development. This is

developed using HTML5, CSS and React Js . Code Editor used for this
project is VS Code. It displays the professional background of an
individual. It displays brief information about work experiences till date,
education, skills and contact details along with social media links. All
the elements are rendered distinctively on the website.

LIST OF FIGURES

1. Home section

2. Menu Section

3. Food Items

5. Frequently Ask Question

6. Cart Total

7. Delivery Information

8. Payment option
INTRODUCTION
Welcome to Desi food
Indulge your taste buds in a gastronomic adventure like no other at
DESIFOOD. We are dedicated to delivering not just meals but
experiences that ignite your senses and leave you craving for more.
Experience Culinary Excellence
At Desi Food, we believe that food is more than just sustenance; it's
an art form. Our chefs are passionate about creating dishes that not
only satisfy your hunger but also tantalize your taste buds with a
symphony of flavors and textures.
Explore Our Menu
From delectable pizza to succulent desert dishes, from
mouthwatering pizzas to juicy burgers, our menu offers a diverse
selection of culinary delights to suit every palate. Each dish is crafted
with the finest ingredients and cooked to perfection, ensuring a
memorable dining experience with every bite.
Join Us
Whether you're dining in at our restaurant or ordering from the
comfort of your home, Desi food welcomes you to embark on a
culinary journey filled with passion, flavor, and delight.
OBJECTIVE OF THE PROJECT

The primary objective of creating this food website is to establish a

vibrant and engaging online platform that celebrates culinary artistry
and showcases our passion for food. Through this project, we aim to
achieve the following goals:
1. Showcase Culinary Skills:-Display a food of our culinary
creations, highlighting our expertise in crafting delicious and visually
appealing dishes.
2. Highlight Unique Offerings:-Showcase our unique menu items,
signature dishes, and specialty cuisines to entice visitors and
showcase the diversity of our offerings.
3. Promote Dining Experience:-Provide an immersive experience
that captures the essence of dining at our restaurant, from the
ambiance to the presentation of our dishes.
4. Drive Engagement:-Encourage interaction and engagement with
our audience through features such as user reviews, ratings, and
feedback, fostering a sense of community and trust.
5. Boost Online Presence:-Enhance our online visibility and reach by
leveraging SEO strategies, social media integration, and cross-
platform promotion to attract new customers and retain existing ones.
6. Facilitate Online Ordering:-Provide seamless online ordering
functionality, allowing customers to browse our menu, place orders,
ad schedule deliveries or pickups with ease.
 7. Deliver Value:- Offer value-added content such as cooking tips,
recipe ideas, and behind-the-scenes insights to enrich the visitor
experience and establish our brand as a trusted authority in the
culinary industry.
By accomplishing these goals, we aim to create a compelling and
memorable online destination that not only promotes our brand but
also delights and inspires food enthusiasts around the world.

1. Inspiration: To inspire aspiring individuals in [your

field/industry] by showcasing the transformative power of
dedication, hard work, and a relentless pursuit of excellence.
2. Adaptability: To create a responsive and adaptable website that
performs optimally across various devices and screen sizes,
catering to the diverse preferences of visitors.
3. Continuous Improvement: To use visitor feedback and data
analytics to continually refine and improve the website's content,
functionality, and user experience.
4. Overall, this project is a testament to my commitment to growth,
innovation, and meaningful engagement in the Software
Developer community. It's my way of inviting you to join me on a
journey of discovery, learning, and inspiration. Thank you for
being a part of it."
 SYSTEM CONFIGURATION

1. Domain Name: Choose and register a domain name that represents

you or your brand.
2. Hosting: Select a web hosting provider to store your website files and
make it accessible on the internet.
3. Content Management System (CMS): Consider using platforms
like WordPress, Wix, or Squarespace to easily manage and create
your website's content.
4. Design and Theme: Pick a visually appealing theme or design that
suits your portfolio's style and showcases your work effectively.
5. Content: Create high-quality content, including project descriptions,
images, videos, and any other materials relevant to your food website.
6. Navigation: Organize your content with clear and intuitive
navigation menus.
7. Responsive Design: Ensure your website is responsive, meaning it
looks and functions well on various devices and screen sizes.
8. Contact Information: Provide a way for visitors to get in touch
with you, such as a contact form or email address.
9. About Me: Include an "About Me" section to introduce my
food website and your background.
10.Projects Showcase: Display your projects prominently, including
images, descriptions, and any relevant links.
11.Social Media Integration: Include links to your social media
profiles to connect with visitors.
12.Security: Implement security measures, such as SSL certificates, to
protect your website and user data.
13.Legal Pages: Include essential legal pages, such as privacy policy and
terms of use.
14.Regular Updates: Keep your online food delivery updated with new
projects and content to showcase your latest work.
 SYSTEM IMPLEMENTATION

For implementing the provided code, you can use various technologies
and tools depending on your preferences and requirements.

1. HTML/CSS: You've already provided the HTML and CSS code for
the website design. HTML is used for structuring the web pages,
while CSS is used for styling and layout.
2. React :_React is a JavaScript library used to build user interfaces
(UI), particularly single-page applications (SPA). It enables
developers to create large web applications that can update and render
efficiently in response to changing data without requiring a page
reload. React works by breaking down the UI into reusable
components, managing state, and using virtual DOM for efficient
rendering.
3. version Control: Using version control software like Git can help
you manage changes to your codebase and collaborate with others if

needed.
4. Responsive Design Frameworks: While your design seems
responsive, you might consider using front-end frameworks like
Bootstrap, Foundation, or Tailwind CSS to simplify responsive
design and ensure compatibility across different devices and screen
sizes.
5. Content Management Systems (CMS): If you prefer a more user-
friendly approach for managing website content, you could consider
using CMS platforms like WordPress, Joomla, or Drupal. However,
this would require customization to match the provided design.
6. Deployment: Once your website is ready, you'll need to deploy it to
a web server. Services like AWS, DigitalOcean, Heroku, or platforms
like Netlify (for static sites) can be used for deployment.

Testing and Optimization: Don't forget to test your website across

different browsers and devices to ensure compatibility. You may also
want to optimize performance by minimizing file sizes, caching
resources, and following best practices for web development.

Depending on your specific needs and goals, you can choose the
appropriate technologies and tools from the options mentioned above.
 HOME PAGE

ru

MENU SECTION
FOOD ITEMS
FREQUENTLY ASK QUESTION

CART TOTAL
DELIVERY INFORMATION

PAYMENT OPTION
ADVANTAGES OF TESTING

Testing is a crucial step in the development of any website,

including your portfolio website. Here are some advantages of
testing your portfolio website:
1. Quality Assurance: Testing ensures that your portfolio website
is of high quality, free from bugs, glitches, and errors. A polished
and error-free website reflects positively on your professionalism
and attention to detail.
2. Smooth User Experience: Testing helps you identify and fix
issues that could disrupt the user experience. A smooth and intuitive
user experience is essential for visitors to navigate your website
easily and appreciate your work.
3. Cross-Browser Compatibility: Different web browsers can
render websites differently. Testing ensures that your portfolio
website looks and functions consistently across various browsers
like Chrome, Firefox, Safari, and Edge.
4. Responsive Design:Your FOOD website should be responsive,
adapting to different screen sizes and devices (desktops, tablets,
smartphones). Testing helps ensure that your website looks and
works well on all devices.
5. Load Time Optimization: Slow-loading websites can
discourage visitors. Testing helps you optimize images, scripts, and
other elements to improve your website's load times, providing a
better user experience.
6. SEO Performance: Testing helps you ensure that your website's
on-page SEO elements (meta tags, headings, keywords) are properly
implemented. Good SEO practices can improve your website's
visibility in search engine results, helping potential clients or
employers find you.
7. Accessibility: Testing helps you identify potential accessibility
issues, ensuring that your website can be used by people with
disabilities. This inclusivity is important for reaching a broader
audience and adhering to web accessibility standards.
8. Functionality Verification: Testing verifies that all interactive
elements (links, buttons, forms) work as intended. This prevents
users from encountering broken links or malfunctioning features.
9. Content Validation: Testing ensures that the content you've
uploaded (project descriptions, images, videos) is accurate, up-to-
date, and displayed correctly.
10. Security: While a portfolio website might not handle sensitive
data, security vulnerabilities can still be exploited. Testing helps
identify and address potential security risks, protecting your website
and its visitors
 .
11. Professionalism: A thoroughly tested portfolio website
demonstrates your professionalism to potential clients, employers,
or collaborators. It shows that you care about delivering a high-
quality experience.
12. Continuous Improvement: Regular testing allows you to
gather user feedback, analyze user behavior, and make informed
updates to enhance your website over time.

Overall, testing ensures that your portfolio website not only

showcases your work effectively but also provides visitors with a
positive and seamless experience. It's an investment that can
contribute to your online reputation and help you achieve your goals.

CONCLUSION

At last, to conclude, I have developed a s Website using React js

HTML5, CSS and VS Code as IDE which I will continue to
maintain in the future t
REFERENCES

React official website : https://react.dev/

Stack Overflow: How to modify Google drive links to embed in anchor tag in
HTML.

W3 Schools: How to give all social media and contacting links.

Hosting : https://hpanel.hostinger.com

Image: https://www.freepik.com/free-photos-vectors/chowmin

LINK: https://desifoodc.shop/

The mentioned link in the project report directs to [My Fast Food]
ADDRESS
PAYMENT
ID PROOF