FOOD AR WEB APP

The Food AR Web App was build inorder to fetch the review from the Food AR App. The app fetch details like Name, Phonenumber and Review of the Customer and store it in the Firesstore database. The data from the Firestore database is fetched using an API Key and also it Firebase configuration and is displayed in the webapp in the form of cards. When the reviews are added in the Food AR app it gets added in the firestore database as well get updated in the webapp as new cards formed for each review.

Project Contributors:

• R Harikrishnan
• Prabhav Narayanan
• Dipesh V Sabu
• Muhammed Jaseel T A

Deployed Link: FOODAR WEB APP for seeing the reviews by the customer.

Setup Firestore in WebStorm for a Web App

Follow these steps to connect Firestore with WebStorm:

---

1. Install WebStorm

• Download and install WebStorm from JetBrains.
• Open WebStorm and create a new Empty Project.

---

2. Initialize Firebase in WebStorm

1. Open the Terminal in WebStorm.
2. Run the following command to initialize a package.json file:

   npm init -y

3. Install Firebase SDK using npm:

   npm install firebase  

---

3. Configure Firestore in WebStorm

1. Create a Firebase Project

   • Go to Firebase Console.
   • Click Create a Project → Follow the steps → Enable Firestore.

2. Add Firestore to Web App

   • In Firebase Console, go to Project Settings.
   • Scroll to Your Apps → Click Add App → Select Web.
   • Register your app and click Next.
   • Copy the Firebase configuration.

3. Create Firebase Config File in WebStorm

   • Inside WebStorm, create a file firebase-config.js.
   • Paste the following code and replace your Firebase config:

   import { initializeApp } from "firebase/app";
   import { getFirestore } from "firebase/firestore";
   
   // Your Firebase configuration (from Firebase Console)
   const firebaseConfig = {
       apiKey: "YOUR_API_KEY",
       authDomain: "YOUR_AUTH_DOMAIN",
       projectId: "YOUR_PROJECT_ID",
       storageBucket: "YOUR_STORAGE_BUCKET",
       messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
       appId: "YOUR_APP_ID"
   };
   
   // Initialize Firebase
   const app = initializeApp(firebaseConfig);
   const db = getFirestore(app);
   
   export { db };

---

4. Allow Firestore Access (Security Rules - for Development)

1. In Firestore Database → Rules tab → Click Edit Rules.
2. Set rules to allow read/write for testing:

   rules_version = '2';
   service cloud.firestore {
       match /databases/{database}/documents {
           match /{document=**} {
               allow read, write: if true;
           }
       }
   }

3. Click Publish.

---

Desktop	Mobile