diff --git a/.github/workflows/check-frontend-pull-request.yml b/.github/workflows/check-frontend-pull-request.yml
new file mode 100644
index 00000000..5aa5f530
--- /dev/null
+++ b/.github/workflows/check-frontend-pull-request.yml
@@ -0,0 +1,42 @@
+name: Frontend CI
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16'
+
+      - name: Install dependencies
+        run: npm install
+        working-directory: ./frontend
+
+      # - name: Run tests
+      #   run: npm test
+      #   working-directory: ./frontend
+
+      - name: Lint code
+        run: npm run lint
+        working-directory: ./frontend
+
+      # - name: Check formatting
+      #   run: npm run format:check
+      #   working-directory: ./frontend
+
+      - name: Build the project
+        run: npm run build
+        working-directory: ./frontend
\ No newline at end of file
diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 53938a36..17938ef4 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { Container, Typography } from '@mui/material';
+// import React from 'react';
+import { Container } from '@mui/material';
 import MainContentSection from './Maincontent';
 import "./App.css"
 const App = () => {
diff --git a/frontend/src/Maincontent.jsx b/frontend/src/Maincontent.jsx
index 79a7334e..9f5c8b9e 100644
--- a/frontend/src/Maincontent.jsx
+++ b/frontend/src/Maincontent.jsx
@@ -1,13 +1,14 @@
 // /*
-import React, { useState } from "react";
+// import React from "react";
+import { useState } from "react";
 import {
   TextField,
   Button,
   Grid,
-  createTheme,
-  ThemeProvider,
+  // createTheme,
+  // ThemeProvider,
   Typography,
-  Box,
+  // Box,
   Snackbar,
   MenuItem,
   FormControl,
@@ -22,11 +23,11 @@ import ContentCopyIcon from "@mui/icons-material/ContentCopy";
 import LaunchIcon from "@mui/icons-material/Launch";
 import axios from "axios";
 
-const darkTheme = createTheme({
-  palette: {
-    mode: "dark",
-  },
-});
+// const darkTheme = createTheme({
+//   palette: {
+//     mode: "dark",
+//   },
+// });
 
 const MainContentSection = () => {
   const [longUrl, setLongUrl] = useState("");