hero square done

src/components/Home.jsx

@@ -0,0 +1,13 @@
+import React from "react";
+import Hero from "./subComponents/Hero";
+import "../css/Home.css";
+
+const Home = () => {
+  return (
+    <div className="gridContainer">
+      <Hero />
+    </div>
+  );
+};
+
+export default Home;

src/components/subComponents/Hero.jsx

@@ -0,0 +1,17 @@
+import React from "react";
+import "../../css/Hero.css";
+
+const Hero = () => {
+  return (
+    <div className="hero">
+      <p>
+        <span>
+          Hi, I'm Yousif. <br />
+        </span>{" "}
+        I'm a Full-Stack Developer from Germany.
+      </p>
+    </div>
+  );
+};
+
+export default Hero;