diff --git a/.github/workflows/main_harisgram-backend.yml b/.github/workflows/main_harisgram-backend.yml
new file mode 100644
index 00000000..adbead12
--- /dev/null
+++ b/.github/workflows/main_harisgram-backend.yml
@@ -0,0 +1,76 @@
+# Docs for the Azure Web Apps Deploy action: https://github.com/Azure/webapps-deploy
+# More GitHub Actions for Azure: https://github.com/Azure/actions
+# More info on Python, GitHub Actions, and Azure App Service: https://aka.ms/python-webapps-actions
+
+name: Build and deploy Python app to Azure Web App - harisgram-backend
+
+on:
+  push:
+    branches:
+      - main
+  workflow_dispatch:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Set up Python version
+        uses: actions/setup-python@v1
+        with:
+          python-version: '3.12'
+
+      - name: Create and start virtual environment
+        run: |
+          python -m venv venv
+          source venv/bin/activate
+      
+      - name: Install dependencies
+        run: pip install -r requirements.txt
+        
+      # Optional: Add step to run tests here (PyTest, Django test suites, etc.)
+
+      - name: Zip artifact for deployment
+        run: zip release.zip ./* -r
+
+      - name: Upload artifact for deployment jobs
+        uses: actions/upload-artifact@v3
+        with:
+          name: python-app
+          path: |
+            release.zip
+            !venv/
+
+  deploy:
+    runs-on: ubuntu-latest
+    needs: build
+    environment:
+      name: 'Production'
+      url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}
+    
+    steps:
+      - name: Download artifact from build job
+        uses: actions/download-artifact@v3
+        with:
+          name: python-app
+
+      - name: Unzip artifact for deployment
+        run: unzip release.zip
+
+      
+      - name: 'Deploy to Azure Web App'
+        uses: azure/webapps-deploy@v2
+        id: deploy-to-webapp
+        with:
+          app-name: 'harisgram-backend'
+          slot-name: 'Production'
+          publish-profile: ${{ secrets.AZUREAPPSERVICE_PUBLISHPROFILE_6DA7FA66310746DA8F5F53883FB52D49 }}
+      - name: 'deploy chatbot'
+        uses: azure/appservice-settings@v1
+        with:
+          app-name: 'harisgram-backend'
+          slot-name: 'Production'  # Optional and needed only if the settings have to be configured on the specific deployment slot
+          app-settings-json: '[{ "name": "CHAT_API_KEY", "value": "${{ secrets.CHAT_API_KEY }}", "slotSetting": false }, { "name": "CHAT_API_ENDPOINT", "value":  "${{ secrets.CHAT_API_ENDPOINT }}", "slotSetting": false }, { "name": "AZURE_OPENAI_MODEL_NAME", "value": "${{ secrets.AZURE_OPENAI_MODEL_NAME }}", "slotSetting": false }]'
+        id: settings
\ No newline at end of file
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index e23f5213..ad070f31 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -9,130 +9,24 @@
         <router-view :key="screen" class="router-view-c"></router-view>
       </vue-page-stack>
     </transition>
+    <footer class="footer">
+      Made with love ❤️
+    </footer>
   </div>
 </template>
 
-<script lang="ts">
-import { Component, Vue, Watch } from "vue-property-decorator";
-import ImageList from "./components/ImageList.vue";
-import Profile from "./components/Profile.vue";
-import Navbar from "./components/Navbar.vue";
-
-@Component({
-  components: {
-    Profile,
-    ImageList,
-    Navbar,
-  },
-})
-export default class App extends Vue {
-  transitionName = "forward";
-  screen = "home";
-
-  @Watch("$route")
-  route(to: any, from: any) {
-    if (to.params["stack-key-dir"] === "forward") {
-      this.transitionName = "forward";
-    } else {
-      this.transitionName = "back";
-    }
-  }
-}
-</script>
-
 <style lang="scss">
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-  position: relative;
-  height: 100%;
-
-  .cube-btn {
-    border-radius: 5px;
-    padding: 15px;
-    margin: 5px 0;
-  }
+/* Existing styles */
 
-  .cube-input {
-    margin: 5px 0;
-    input {
-      padding: 8px;
-    }
-  }
-  .cube-input_active::after {
-    border-radius: 5px;
-  }
-  @keyframes show {
-    0% {
-      transform: translateY(100px);
-    }
-    60% {
-      transform: translateY(-80upx);
-    }
-    100% {
-      transform: translateY(0px);
-    }
-  }
-}
-.router-view-c {
-  position: absolute;
-  transition: opacity 0.5s, transform 0.5s;
-  width: 100%;
-}
-.forward-enter,
-.back-leave-active {
-  opacity: 0.5;
-  transform: translateX(100%);
-}
-.forward-leave-active,
-.back-enter {
-  opacity: 0.5;
-  transform: translateX(-100%);
-}
-@font-face {
-  font-family: HaloHandletter;
-  src: url("../fonts/HaloHandletter.otf") format("opentype");
-}
-#top,
-#bottom,
-#left,
-#right {
-  background: linear-gradient(
-    45deg,
-    #f09433 0%,
-    #e6683c 25%,
-    #dc2743 50%,
-    #cc2366 75%,
-    #bc1888 100%
-  );
+.footer {
   position: fixed;
-}
-#left,
-#right {
-  top: 0;
   bottom: 0;
-  width: 2px;
-}
-#left {
   left: 0;
-}
-#right {
   right: 0;
-}
-
-#top,
-#bottom {
-  left: 0;
-  right: 0;
-  height: 2px;
-}
-#top {
-  top: 0;
-}
-#bottom {
-  bottom: 0;
+  padding: 10px;
+  background-color: #3f0f0f;
+  text-align: center;
+  font-size: 14px;
+  color: #888888;
 }
 </style>
diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue
index 16cd3818..7e450be1 100644
--- a/frontend/src/views/Home.vue
+++ b/frontend/src/views/Home.vue
@@ -6,8 +6,8 @@
         <div id="right"></div>
         <div id="top"></div>
         <div id="bottom"></div>
-        <b-navbar-item id="fontnavbar" class="title is-2">
-          Milligram
+        <b-navbar-item id="fontnavbar" class="title is-2" style="color: greenyellow">
+         MiniApp HarisGram
         </b-navbar-item>
       </template>
     </b-navbar>