A React-based application developed to practice and master CRUD operations within a component-based architecture. This project serves as a functional prototype for managing a recipe collection.
The primary goal of this project was to implement the four basic functions of persistent storage:
-
Create: Adding new recipes to the collection.
-
Read: Displaying recipes dynamically from state.
-
Update: Editing existing recipe titles or details.
-
Delete: Removing recipes from the list.
-
Framework: React.js
-
State Management: React Hooks (useState, useEffect)
-
Styling: CSS3 (Desktop-first)
-
Data Structure: Currently utilizes a "poor" or simplified database/JSON structure. Expanding the data schema to include full ingredients and instructions is a priority for the next sprint.
-
Responsiveness: Not currently mobile-friendly; designed for desktop use only.
-
Persistence: Data currently resets on page refresh (unless LocalStorage/Firebase is implemented).
-
Refactor CSS with Media Queries for Mobile Responsiveness.
-
Enhance the data model to support complex recipe instructions.
-
Connect to Firebase or MongoDB for permanent data storage.