diff --git a/public/webContent.json b/public/webContent.json
new file mode 100644
index 0000000..4c6d239
--- /dev/null
+++ b/public/webContent.json
@@ -0,0 +1,7 @@
+{
+    "landing": {
+      "cet_overview": "Founded in 1939, College of Engineering, Trivandrum (CET) is Kerala's first engineering college, established during the reign of Sri Chithira Thirunal Balarama Varma. Initially started with 21 students in Civil, Mechanical, and Electrical Engineering, CET moved to its expansive 125-acre campus in 1960 and is now managed by the Kerala Government.",
+      "cse_overview": "Established in 1984, the Computer Science and Engineering (CSE) department is known for its academic excellence and strong placement records. With 21 faculty members and a top student intake, CSE has a legacy of producing skilled engineers with alumni holding prominent positions globally in industry, academia, and research."
+    }
+  }
+  
\ No newline at end of file
diff --git a/src/pages/landing.tsx b/src/pages/landing.tsx
index 3169834..38a92b8 100644
--- a/src/pages/landing.tsx
+++ b/src/pages/landing.tsx
@@ -1,90 +1,120 @@
 "use client";
 import "../app/globals.css";
-import Image from 'next/image';
-import sampleDepartmentImage from '../app/assets/images/sampleDepartmentImage.svg';
-import landingImg1 from '../app/assets/images/landingImg1.svg';
-import landingImg2 from '../app/assets/images/landingImg2.svg';
-import { useState, useEffect } from 'react';
+import Image from "next/image";
+import sampleDepartmentImage from "../app/assets/images/sampleDepartmentImage.svg";
+import landingImg1 from "../app/assets/images/landingImg1.svg";
+import landingImg2 from "../app/assets/images/landingImg2.svg";
+import { useState, useEffect } from "react";
 
-export default function Landing() {
+type landingPageContent = {
+  cet_overview: string;
+  cse_overview: string;
+};
 
+export default function Landing() {
+  const [currentImage, setCurrentImage] = useState(0);
+  const images = [sampleDepartmentImage, landingImg1];
+  const [data, setData] = useState<landingPageContent>({
+    cet_overview: "",
+    cse_overview: "",
+  });
 
-    const [currentImage, setCurrentImage] = useState(0);
-    const images = [sampleDepartmentImage, landingImg1];
+  useEffect(() => {
+    // Fetch JSON data from the public folder
+    fetch("/webContent.json")
+      .then((response) => response.json())
+      .then((jsonData) => setData(jsonData.landing))
+      .catch((error) => console.error("Error fetching JSON:", error));
+  }, []);
 
-    useEffect(() => {
-        const imageSwitchInterval = setInterval(() => {
-        setCurrentImage((prevIndex) => (prevIndex + 1) % images.length);
-        }, 2000);
+  useEffect(() => {
+    const imageSwitchInterval = setInterval(() => {
+      setCurrentImage((prevIndex) => (prevIndex + 1) % images.length);
+    }, 2000);
 
-        return () => clearInterval(imageSwitchInterval);
-    }, []);
+    return () => clearInterval(imageSwitchInterval);
+  }, []);
 
-    const submitQUery = (e: React.FormEvent<HTMLFormElement>) => {
-        e.preventDefault();
-        alert("Query submitted!");
-    };
+  const submitQUery = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    alert("Query submitted!");
+  };
 
-    return (
-        <div className="overflow-x-hidden">
-            <div className="relative mt-[1.125rem] mx-[2.03125rem] h-[400px] text-white">
-                <div
-                className="absolute inset-0 bg-cover bg-center transition-opacity duration-500 rounded-[1.25rem]"
-                style={{
-                    backgroundImage: `url(${images[currentImage].src})`,
-                    transition: "background-image 0.5s ease-in-out"
-                }}
-                ></div>
-                <div className="absolute inset-0 flex flex-col justify-center items-center text-center z-10">
-                <h1 className="text-4xl md:text-6xl font-secondary">CS ASSOCIATION</h1>
-                <p className="text-lg md:text-2xl mt-1 md:mt-2">Department of Computer Science</p>
-                </div>
-                <div className="absolute bottom-14 left-5 md:bottom-10 md:left-5 z-10">
-                <button className="border border-white rounded-lg px-8 py-3 text-lg">
-                    Contact Us
-                </button>
-                </div>
-                <div className="absolute bottom-5 left-5  md:bottom-5 md:right-9 md:left-auto text-lg z-10">
-                College of Engineering Trivandrum
-                </div>
-            </div>
-            <div className="mx-[2.03125rem] mt-[1.875rem] flex flex-col md:flex-row bg-[#F4F4F4] px-[2rem] md:px-[4.875rem] py-[2rem] md:py-[3.3125rem] rounded-[1.25rem] space-y-4 md:space-x-6">
-                <Image src={landingImg1} alt="Department of Computer Science" className="rounded-md w-full" />
-                <div className="flex flex-col my-auto ml-0 md:ml-[6.25rem]">
-                    <h2 className="font-bold text-5xl">Department of Computer Science</h2>
-                    <p className="font-normal text-xl mt-[2.5rem]">
-                        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
-                    </p>
-                </div>
-            </div>
-            <div className="mx-[2.03125rem] mt-[1.875rem] flex flex-col md:flex-row bg-[#F4F4F4] px-[2rem] md:px-[4.875rem] py-[2rem] md:py-[3.3125rem] rounded-[1.25rem] space-y-4 md:space-x-6">
-                <div className="flex flex-col my-auto mr-[4.0625rem]">
-                    <h2 className="font-bold text-5xl">College Of Engineering Trivandrum</h2>
-                    <p className="font-normal text-xl mt-[2.5rem]">
-                        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
-                    </p>
-                </div>
-                <Image src={landingImg2} alt="Department of Computer Science" className="rounded-md" />
-            </div>
+  return (
+    <div className="overflow-x-hidden">
+      <div className="relative mt-[1.125rem] mx-[2.03125rem] h-[400px] text-white">
+        <div
+          className="absolute inset-0 bg-cover bg-center transition-opacity duration-500 rounded-[1.25rem]"
+          style={{
+            backgroundImage: `url(${images[currentImage].src})`,
+            transition: "background-image 0.5s ease-in-out",
+          }}
+        ></div>
+        <div className="absolute inset-0 flex flex-col justify-center items-center text-center z-10">
+          <h1 className="text-4xl md:text-6xl font-secondary">
+            CS ASSOCIATION
+          </h1>
+          <p className="text-lg md:text-2xl mt-1 md:mt-2">
+            Department of Computer Science
+          </p>
+        </div>
+        <div className="absolute bottom-14 left-5 md:bottom-10 md:left-5 z-10">
+          <button className="border border-white rounded-lg px-8 py-3 text-lg">
+            Contact Us
+          </button>
+        </div>
+        <div className="absolute bottom-5 left-5  md:bottom-5 md:right-9 md:left-auto text-lg z-10">
+          College of Engineering Trivandrum
+        </div>
+      </div>
+      <div className="mx-[2.03125rem] mt-[1.875rem] flex flex-col md:flex-row bg-[#F4F4F4] px-[2rem] md:px-[4.875rem] py-[2rem] md:py-[3.3125rem] rounded-[1.25rem] space-y-4 md:space-x-6">
+        <Image
+          src={landingImg1}
+          alt="Department of Computer Science"
+          className="rounded-md w-full"
+        />
+        <div className="flex flex-col my-auto ml-0 md:ml-[6.25rem]">
+          <h2 className="font-bold text-5xl">Department of Computer Science</h2>
+          <p className="font-normal text-xl mt-[2.5rem]">{data.cse_overview}</p>
+        </div>
+      </div>
+      <div className="mx-[2.03125rem] mt-[1.875rem] flex flex-col md:flex-row bg-[#F4F4F4] px-[2rem] md:px-[4.875rem] py-[2rem] md:py-[3.3125rem] rounded-[1.25rem] space-y-4 md:space-x-6">
+        <div className="flex flex-col my-auto mr-[4.0625rem]">
+          <h2 className="font-bold text-5xl">
+            College Of Engineering Trivandrum
+          </h2>
+          <p className="font-normal text-xl mt-[2.5rem]">{data.cet_overview}</p>
+        </div>
+        <Image
+          src={landingImg2}
+          alt="Department of Computer Science"
+          className="rounded-md"
+        />
+      </div>
 
-            <div className="flex flex-col my-[1.875rem] items-center justify-between mx-[2.03125rem] bg-[#2C2C2C]  rounded-lg shadow-lg px-min">
-                <div className='px-[2.6875rem]'>
-                <div className="text-[2rem] md:text-[3rem] font-bold text-white mb-4 mt-[2.625rem]">Do you have any queries?</div>
-                <form className="flex md:flex-row flex-col space-y-3 md:space-y-0 w-full mb-[4.625rem] items-center mx-auto" onSubmit={submitQUery}>
-                    <input
-                        type="text"
-                        placeholder="Write here..."
-                        className="px-4 py-2 mx-auto text-white placeholder:text-[#6A6A6A] rounded-[0.625rem] bg-[#424242]  md:mr-4 w-fit md:w-[27.6875rem] focus:outline-none"
-                    />
-                    <button
-                        type="submit"
-                        className="px-[2.1875rem] py-[0.625rem] font-medium text-white bg-transparent border  border-white rounded-[0.625rem] hover:bg-white hover:text-gray-800 transition duration-300"
-                    >
-                        Send
-                    </button>
-                </form>
-                </div>
-            </div>
+      <div className="flex flex-col my-[1.875rem] items-center justify-between mx-[2.03125rem] bg-[#2C2C2C]  rounded-lg shadow-lg px-min">
+        <div className="px-[2.6875rem]">
+          <div className="text-[2rem] md:text-[3rem] font-bold text-white mb-4 mt-[2.625rem]">
+            Do you have any queries?
+          </div>
+          <form
+            className="flex md:flex-row flex-col space-y-3 md:space-y-0 w-full mb-[4.625rem] items-center mx-auto"
+            onSubmit={submitQUery}
+          >
+            <input
+              type="text"
+              placeholder="Write here..."
+              className="px-4 py-2 mx-auto text-white placeholder:text-[#6A6A6A] rounded-[0.625rem] bg-[#424242]  md:mr-4 w-fit md:w-[27.6875rem] focus:outline-none"
+            />
+            <button
+              type="submit"
+              className="px-[2.1875rem] py-[0.625rem] font-medium text-white bg-transparent border  border-white rounded-[0.625rem] hover:bg-white hover:text-gray-800 transition duration-300"
+            >
+              Send
+            </button>
+          </form>
         </div>
-    );
+      </div>
+    </div>
+  );
 }