prepare hero content

src/web/src/app/page.jsx

@@ -1,11 +1,11 @@
 // Imports
+import { HeroSection1, HeroSection2, HeroSection3 } from "@/components/hero";
 
 // Metadata
 
 // Exports
 export default function Index() {
   return (
-    <div> 
-    </div>
+    <div></div>
   );
 }

src/web/src/components/hero.jsx

@@ -0,0 +1,22 @@
+"use client";
+
+import { motion, AnimatePresence } from "framer-motion";
+import { useState, useEffect } from "react";
+
+function HeroSection1() {
+
+}
+
+function HeroSection2() {
+
+}
+
+function HeroSection3() {
+
+}
+
+export default function () {
+  HeroSection1,
+  HeroSection2,
+  HeroSection3
+}