Feature/30 filtering recipes home page

.claude/settings.json

@@ -0,0 +1,7 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(npx vite *)"
+    ]
+  }
+}

.gitignore

@@ -0,0 +1,13 @@
+.env
+
+# SQLite databases
+*.db
+
+# VSCode settings
+.vscode/
+
+# Logs
+*.log
+
+# modules
+node_modules

README.md

@@ -1,44 +1,77 @@
-# [your app name here]
+# EatRite
 
 CodePath WEB103 Final Project
 
-Designed and developed by: [your names here]
+Designed and developed by: 
+Ashok Gaire,
+Ousseynou Diop,
+Mohammad Naeem,
+Khadeja Ahmar,
+Oscar Mochizaki,
+Noah Mckegney
 
 🔗 Link to deployed app:
 
 ## About
 
 ### Description and Purpose
 
-[text goes here]
+The purpose of the App is to create meal plans based on specified available ingredients. Users can enter ingredients they already have at home, set dietary preferences, and get recipe suggestions. Users could also save favorite recipes to their profile.
 
 ### Inspiration
 
-[text goes here]
+Many people want to eat healthier or add more variety to their meals, but coming up with new ideas for breakfast, lunch, dinner, or snacks can be difficult. People often fall back on the same recipes they already know or spend time searching through multiple websites for inspiration. This app helps solve that problem by generating personalized recipe suggestions based on ingredients users already have on hand while also considering their dietary preferences.
 
 ## Tech Stack
 
-Frontend:
+Frontend: React
 
-Backend:
+Backend: Express
 
 ## Features
 
-### [Name of Feature 1]
+### Home page ✅
 
-[short description goes here]
+- Recipe results page
+- Shows all available recipes
+- Sorts them based on star rating
+- Can ajust results: new, favorite, etc.
 
-[gif goes here]
+[![Demo Video](https://img.youtube.com/vi/sg9T2A7yaAI/0.jpg)](https://www.youtube.com/watch?v=sg9T2A7yaAI)
+
+### User kitchen Page ✅
+
+- Cards with all Ingredients in users kitchen
+- Link to page to input new ingredients
+
+[![Demo Video](https://img.youtube.com/vi/fpdyUssrY04/0.jpg)](https://youtu.be/fpdyUssrY04)
+
+### Ingredients input page ✅
 
-### [Name of Feature 2]
+- Ingredient input form
+- linked from User kitchen page
+- Metrics for dietary info
 
-[short description goes here]
+[![Demo Video](https://img.youtube.com/vi/x-i2w46ggYo/0.jpg)](https://youtu.be/x-i2w46ggYo)
+
+### User Profile
+
+- Link to Page to edit Ditary preferences
+- Link to User kitchen Page
+- User Logo
 
 [gif goes here]
 
-### [Name of Feature 3]
+### User Authentication ✅
+
+- login page
+
+[![Demo Video](https://img.youtube.com/vi/mr_CoBDzWKs/0.jpg)](https://youtu.be/mr_CoBDzWKs)
+
+### Meal Calendar
 
-[short description goes here]
+- Tracks what you ate on what days
+- Can schedule meals
 
 [gif goes here]
 

client/.gitignore

@@ -0,0 +1,25 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+.claude/*

client/README.md

@@ -0,0 +1,16 @@
+# React + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs)
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/)
+
+## React Compiler
+
+The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the [TS template](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-react-ts) for information on how to integrate TypeScript and [`typescript-eslint`](https://typescript-eslint.io) in your project.

client/eslint.config.js

@@ -0,0 +1,21 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import { defineConfig, globalIgnores } from 'eslint/config'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{js,jsx}'],
+    extends: [
+      js.configs.recommended,
+      reactHooks.configs.flat.recommended,
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      globals: globals.browser,
+      parserOptions: { ecmaFeatures: { jsx: true } },
+    },
+  },
+])

client/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>client</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>