feat: initialize portfolio site with core components, pages, and content structure, and update Next.js configuration.

2026-03-17 20:08:00 -03:00
1 parent 223746b898
commit d00258dcd1
@@ -0,0 +1,114 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import { caseStudies, siteName, siteUrl } from "@/lib/site-content";
+
+export const metadata: Metadata = {
+  title: `Cases de Engenharia de Software, Next.js e IoT | ${siteName}`,
+  description:
+    "Cases selecionados em engenharia de software, Next.js, IoT, integracoes e software para contextos criticos. Portfolio tecnico com foco em clareza, performance e execucao.",
+  alternates: {
+    canonical: `${siteUrl}/cases`,
+  },
+  openGraph: {
+    title: `Cases de Engenharia de Software, Next.js e IoT | ${siteName}`,
+    description:
+      "Cases selecionados em engenharia de software, Next.js, IoT, integracoes e software para contextos criticos.",
+    url: `${siteUrl}/cases`,
+    siteName,
+    type: "website",
+  },
+};
+
+export default function CasesPage() {
+  const jsonLd = {
+    "@context": "https://schema.org",
+    "@graph": [
+      {
+        "@type": "CollectionPage",
+        "@id": `${siteUrl}/cases#page`,
+        name: "Cases de engenharia de software",
+        url: `${siteUrl}/cases`,
+        description:
+          "Colecao de cases em Next.js, IoT, integracoes e software para operacoes criticas.",
+      },
+      {
+        "@type": "ItemList",
+        itemListElement: caseStudies.map((caseStudy, index) => ({
+          "@type": "ListItem",
+          position: index + 1,
+          name: caseStudy.title,
+          url: caseStudy.demoUrl ?? caseStudy.githubUrl ?? `${siteUrl}/cases`,
+        })),
+      },
+    ],
+  };
+
+  return (
+    <main>
+      <script
+        type="application/ld+json"
+        dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
+      />
+
+      <section className="ds-section ds-section-dark">
+        <div className="ds-section-shell">
+          <div className="max-w-[860px]">
+            <p className="ds-eyebrow">Selected work</p>
+            <h1 className="ds-section-title max-w-[14ch] text-balance text-white">
+              Cases em software, Next.js, integracoes e produtos conectados.
+            </h1>
+            <p className="ds-copy max-w-[64ch] !text-[rgba(255,255,255,0.78)]">
+              Esta pagina organiza projetos com leitura mais indexavel e comercial, conectando stack,
+              contexto tecnico e tipo de problema resolvido.
+            </p>
+          </div>
+        </div>
+      </section>
+
+      <section className="ds-section">
+        <div className="ds-section-shell">
+          <div className="ds-grid-2">
+            {caseStudies.map((caseStudy) => (
+              <article key={caseStudy.id} className="ds-card">
+                <div className="ds-kicker">{caseStudy.title}</div>
+                <h2 className="ds-card-title">{caseStudy.subtitle}</h2>
+                <p className="ds-copy">{caseStudy.summary}</p>
+                <p className="mt-sp-4 text-[13px] leading-7 text-[var(--meta)]">
+                  {caseStudy.impact}
+                </p>
+                <ul className="ds-tags mt-sp-6">
+                  {caseStudy.stack.map((item) => (
+                    <li key={item} className="ds-tag">
+                      {item}
+                    </li>
+                  ))}
+                </ul>
+                <div className="mt-sp-6 flex flex-wrap gap-sp-3">
+                  {caseStudy.demoUrl ? (
+                    <a href={caseStudy.demoUrl} className="ds-link ds-link-accent" target="_blank" rel="noreferrer">
+                      Abrir projeto
+                    </a>
+                  ) : null}
+                  {caseStudy.githubUrl ? (
+                    <a href={caseStudy.githubUrl} className="ds-link ds-link-muted" target="_blank" rel="noreferrer">
+                      Ver codigo
+                    </a>
+                  ) : null}
+                </div>
+              </article>
+            ))}
+          </div>
+
+          <div className="mt-sp-10 flex flex-wrap gap-sp-3">
+            <Link href="/servicos" className="ds-link ds-link-accent">
+              Ver servicos
+            </Link>
+            <Link href="/#contact" className="ds-link ds-link-muted">
+              Ir para contato
+            </Link>
+          </div>
+        </div>
+      </section>
+    </main>
+  );
+}