5-30. nextJS

src/components/Footer/Footer.tsx

@@ -0,0 +1,35 @@
+import { ExternalLink, Rss } from 'lucide-react';
+import { footerLinks } from '@/data/social';
+
+export function Footer() {
+  const currentYear = new Date().getFullYear();
+
+  return (
+    <footer>
+      <div className="container">
+        <ul className="social-links">
+          {footerLinks.map((link) => (
+            <li key={link.name}>
+              <a href={link.url} target="_blank" rel="noopener noreferrer">
+                  {link.name}
+              </a>
+            </li>
+          ))}
+        </ul>
+        <p>&copy;{currentYear} Charlotte Croce</p>
+        <p className="theme-note">
+        🍓 If you like the colors of this website, check out my{' '}
+          <a
+            href="https://marketplace.visualstudio.com/items?itemName=charlotte-dev.fruitbasket-theme"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            VS Code Theme
+            <ExternalLink className="icon-small" aria-hidden="true" />
+            <span className="visually-hidden">(opens in new tab)</span>
+          </a>
+        </p>
+      </div>
+    </footer>
+  );
+}