Tribhuvan University
Faculty of Humanities and Social Sciences
Delicious Recipe
A Project Proposal
Submitted To
Department Of Computer Application
Hetauda City College
Hetauda-5, Piple
In Partial Fulfillment of
BACHELOR OF COMPUTER APPLICATION (BCA)
Submitted By:
Arpit Paudel
Rohan Kumar Baruwal
Introduction .............................................................................................................................................3
Problem Statement ..............................................................................................................................3
1.2 Objective ......................................................................................................................................3
1.3 Scope of Project ...........................................................................................................................4
Methodology ...........................................................................................................................................4
3. SDLC Model ......................................................................................................................................4
Backend (Node.js & Express.js) ............................................................................................................4
Methods Used in the Backend: ........................................................................................................4
Expected Outcome ...................................................................................................................................4
Reference .................................................................................................................................................4
Introduction
The "Delicious Recipe" website is a platform where users can easily find and explore a variety
of recipes. Whether someone is a beginner or an experienced cook, this website will help
them discover new dishes, learn cooking, and get inspired to try different cuisines.
The website will have a simple and user-friendly design, allowing users to search for recipes,
browse different categories (like vegetarian, desserts, and international cuisines), and help
them try their favorite recipes.
Built using React.js and Vite, the platform will be fast, interactive, and visually appealing. Users
will also be able to share recipes, engage with the community. Our goal is to make cooking
fun, easy, and accessible for everyone.
Problem Statement
1.1 Problem Statement
With the rise of digital platforms, there is a growing demand for a well-organized and user-
friendly recipe website. Many existing platforms lack a structured approach to categorizing
recipes, detailed nutritional information, and interactive community engagement. "Delicious
Recipe" aims to address these gaps by offering a comprehensive and interactive solution.
1.2 Objective
• The proposed Delicious Recipe aims to: Develop an easy-to-use platform where users
can explore, share, and review recipes.
• Provide clear, structured recipe instructions.
• Incorporate features such as ingredient substitutions, cooking tips, and personalized
recommendations.
• Ensure scalability and mobile responsiveness.
1.3 Scope of Project
❖ Design and develop a web-based recipe-sharing platform.
❖ Support user-generated content, including recipe uploads and reviews.
❖ Implement advanced search and filtering mechanisms.
❖ Ensure seamless user interaction through ratings, comments, and social media
sharing.
[1]. [2] [2]. [3] [3] [4] [4]
Methodology
3. SDLC Model
The Agile model is being used for the Declicious Recipe project to facilitate iterative
development and flexibility. It allows for the project to be broken down into small,
manageable sprints, enabling incremental delivery of features. This approach ensures
continuous feedback from stakeholders, allowing quick adjustments based on evolving user
needs and requirements.
Key benefits of using Agile include:
1. Flexibility to accommodate changes in functionality and user requirements.
2. Incremental delivery of features, allowing early releases and faster time-to-market.
3. Continuous collaboration with stakeholders (venue owners, users, admins) to ensure
the system meets their needs.
4. Early risk mitigation by identifying issues in smaller, manageable parts.
5. Improved user experience through rapid prototyping and frequent testing.
By using Agile, the project can be adapted to changing conditions and user feedback, ensuring
successful and efficient development.
Method used in frontend
1. React Components:
❖ The website is built using reusable React components like Header, Recipe Card,
Search Bar, etc.
❖ This makes the UI modular, maintainable, and reusable.
2. React Router (Routing System):
❖ Allows users to navigate between different pages like Home, Categories, and
Recipe Details.
❖ Example: react-router-dom is used to create paths like /recipe/:id to show
individual recipes.
3. State Management (use State & use Effect):
❖ useState() helps manage dynamic data like search results or selected categories.
❖ useEffect() is used to fetch data from APIs when a page loads.
4. Material-UI & Styled Components:
❖ Used for designing the UI with attractive buttons, cards, and responsive layouts.
❖ Styled components allow applying CSS directly inside React components.
5. API Integration (Fetching Recipes):
❖ The frontend fetches recipe data from an external API or a backend server using
fetch () or Axios.
❖ Example:
Backend (Node.js & Express.js)
The backend handles requests, processes data, and communicates with the database.
Methods Used in the Backend:
1. Express.js (Server Creation & Routing):
a. Express.js is used to create an API that handles requests from the frontend.
b. Example:
MongoDB (Database) or MySQL (Relational Database):
• Stores recipe details like ingredients, preparation steps, and user reviews.
• Example (MongoDB with Mongoose):
JWT Authentication (User Login & Security):
1. If user authentication is needed, JWT (JSON Web Token) is used for secure login and
data access.
2. API Communication (CRUD Operations):
3. Create (POST): Add new recipes to the database.
4. Read (GET): Fetch recipe details.
5. Update (PUT): Modify recipe information.
6. Delete (DELETE): Remove a recipe.
7. Example:
Technical Feasibility
The technical feasibility of this project is strong because:
1. Scalability:
a. React allows adding new features easily, and Node.js with MongoDB can
handle large amounts of data.
2. Performance:
a. Vite ensures fast loading speeds, and optimized database queries improve
backend performance.
3. Security:
a. Uses JWT Authentication for user login, crypt for password hashing, and HTTPS
for secure communication.
4. Cost-Effective:
a. Can be deployed on free-tier services like Versel (Frontend), Render (Backend),
or MongoDB Atlas (Database).
5. User Experience:
a. Material-UI and responsive design make the app accessible on mobile, tablet,
and desktop.
4. Gannt Chart
Gantt Chart
Planning
System Design
Implementation & Coding
Testing & Debugging
Documentation
Testing & Implementation &
Documentation System Design Planning
Debugging Coding
Start Date 01/02/2025 25/04/2025 03/03/2025 12/02/2025 01/02/2025
Days to complete 93 10 50 15 10
Figure 1 Gannt Chart
Expected Outcome
• A fully functional and visually appealing recipe-sharing website.
• A growing community of users engaged in recipe discussions.
• Increased accessibility to diverse cooking ideas and inspirations.
• Monetization possibilities through ads, affiliate marketing, and premium content.
5. References:
Relevant research papers, existing recipe websites, and technological documentation used
in project development.
Reference
[1] S. N. Ghule, H. M. Mohurle, A. P. Shegaonkar and Z. P. A. Saleem, "researchgate," [Online].
Available:
https://www.researchgate.net/publication/331364846_A_Review_Venue_Booking_System.
[2] N. m. d. m. Aakansha ghuse, "Web based venue booking system," IJCRT, vol. 8, no. 4 april 2020,
p. 1, 2020.
[3] "eventpro," [Online]. Available: https://www.eventpro.net/venue-management-software.html.
[4] J. L. Can Li*, "matec-conference," [Online]. Available: https://www.matec-
conferences.org/articles/matecconf/pdf/2017/14/matecconf_gcmm2017_02024.pdf.
