first commit

src/components/Skills.astro

@@ -0,0 +1,27 @@
+---
+import { getCollection } from "astro:content";
+import { Icon } from "astro-icon/components";
+
+const collection = await getCollection("skills");
+
+const skills = await Promise.all(
+  collection.map(async (item) => {
+    const { Content } = await item.render();
+    return { ...item, Content };
+  }),
+);
+---
+
+<ul class="flex max-w-full list-none flex-wrap gap-4 px-0">
+  {
+    skills.map((entry) => (
+      <li>
+        <Icon
+          name={entry.data.icon}
+          title={entry.data.title}
+          class="h-12 w-auto text-secondary"
+        />
+      </li>
+    ))
+  }
+</ul>