diff --git a/.gitignore b/.gitignore
index e3c2ccc..83d42ca 100644
--- a/.gitignore
+++ b/.gitignore
@@ -27,6 +27,7 @@ yarn-error.log*
 
 # local env files
 .env*.local
+.env
 
 # vercel
 .vercel
diff --git a/package-lock.json b/package-lock.json
index 5b57bdd..fa7f3e8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
         "@emotion/styled": "^11.13.0",
         "@mui/icons-material": "^5.16.5",
         "@mui/material": "^5.16.5",
+        "dotenv": "^16.4.5",
         "firebase": "^10.12.4",
         "next": "14.2.5",
         "react": "^18",
@@ -2457,6 +2458,17 @@
         "csstype": "^3.0.2"
       }
     },
+    "node_modules/dotenv": {
+      "version": "16.4.5",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.5.tgz",
+      "integrity": "sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
+      }
+    },
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
diff --git a/package.json b/package.json
index 44e5dbe..80abd55 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
     "@emotion/styled": "^11.13.0",
     "@mui/icons-material": "^5.16.5",
     "@mui/material": "^5.16.5",
+    "dotenv": "^16.4.5",
     "firebase": "^10.12.4",
     "next": "14.2.5",
     "react": "^18",
diff --git a/src/app/page.tsx b/src/app/page.tsx
index c6e066c..47d8485 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -49,12 +49,10 @@ export default function Home() {
   const fetchCollection = async () => {
     try {
       const querySnapShot = await getDocs(collection(db, "pantry"));
-      console.log("🚀 ~ fetchCollection ~ querySnapShot:", querySnapShot);
       const data: any = querySnapShot.docs.map((doc) => ({
         name: doc.id,
         ...doc.data(),
       }));
-      console.log("🚀 ~ fetchCollection ~ data:", data);
       setPantryData(data);
     } catch (error) {
       console.log("Error fetching collection: ", error);
diff --git a/src/firebase.ts b/src/firebase.ts
index 489c606..14e5632 100644
--- a/src/firebase.ts
+++ b/src/firebase.ts
@@ -3,13 +3,13 @@ import { initializeApp } from "firebase/app";
 import { getFirestore } from "firebase/firestore";
 
 const firebaseConfig = {
-  apiKey: "AIzaSyD-XoJuJ8NjN3EUSwHO6KdmKw6ShJySeUg",
-  authDomain: "pantry-track.firebaseapp.com",
-  projectId: "pantry-track",
-  storageBucket: "pantry-track.appspot.com",
-  messagingSenderId: "894667218839",
-  appId: "1:894667218839:web:0778a13db8acc33df2eed2",
-  measurementId: "G-007BN9XB9M",
+  apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
+  authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,
+  projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
+  storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET,
+  messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGE_SENDER_ID,
+  appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID,
+  measurementId: process.env.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID,
 };
 
 // Initialize Firebase