feat: add AboutSummary component with personal introduction and game preview

feat: create Chip component for displaying technology tags

feat: implement ExperienceCard component to showcase job experiences

feat: add Experience component to list multiple job experiences

feat: create Footer component with social links and copyright information

feat: implement Hero component for the landing section with social links

feat: add ImageCarousel component for displaying project images

feat: create Navbar component with scroll effect and navigation links

feat: implement ProjectItem component to display individual project details

feat: add Skills component to showcase technical skills

feat: create data module with skills, jobs, and projects information

feat: define types for Skill, Job, and Project in types module

chore: update package.json with new dependencies for Tailwind CSS and Lucide icons

chore: add CV PDF file to public directory

chore: remove unused SVG files from public directory

chore: add new images for background and hero sections

feat: implement formatDate utility function for date formatting

components/skills.tsx

@@ -0,0 +1,31 @@
+import Chip from "@/components/chip";
+import { Skill } from "@/lib/types";
+
+interface SkillsProps {
+  skills: Skill[];
+}
+
+const Skills = ({ skills }: SkillsProps) => {
+  return (
+    <div
+      id="skills"
+      className="flex flex-col items-center justify-center gap-4 p-4 rounded w-full"
+    >
+      <h3 className="mt-4 mb-2 text-5xl font-bold tracking-tight text-white">
+        Skills 🛠️
+      </h3>
+      <div className="flex flex-wrap justify-center w-full max-w-lg gap-4">
+        {skills.map((skill, index) => (
+          <div
+            key={index}
+            className="odd:motion-preset-slide-left even:motion-preset-slide-right odd:motion-delay-100"
+          >
+            <Chip text={skill.name} />
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};
+
+export default Skills;