@@ -0,0 +1,179 @@
import type { Metadata } from "next" ;
import Link from "next/link" ;
import { ArrowUpRight , Box , Check , Code2 , Puzzle , Terminal } from "lucide-react" ;
import Nav from "@/components/nav" ;
import Footer from "@/components/footer" ;
function GithubIcon ( { className } : { className? : string } ) {
return (
< svg viewBox = "0 0 24 24" fill = "none" stroke = "currentColor" strokeWidth = "2" strokeLinecap = "round" strokeLinejoin = "round" className = { className } aria-hidden = "true" >
< path d = "M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 0 6 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4" / >
< path d = "M9 18c-4.51 2-5-2-7-2" / >
< / svg >
) ;
}
export const metadata : Metadata = {
title : "Decision Kit – ,
description : "Open-Source-Tools von Entscheidomat: Repository, VS Code Extension, Chrome Extension, npm-Paket, Python SDK und GitHub Action." ,
openGraph : {
title : "Decision Kit – ,
description : "Zufalls-Entscheidungstools für VS Code, Chrome, Node.js, Python und GitHub Actions." ,
url : "https://entscheidomat.com/developer" ,
} ,
} ;
type Asset = {
title : string ;
eyebrow : string ;
description : string ;
icon : typeof Puzzle ;
action? : string ;
href? : string ;
snippet? : string ;
status : string ;
} ;
const assets : Asset [ ] = [
{
title : "GitHub Repository" ,
eyebrow : "Open Source · MIT" ,
description : "Der vollständige Decision-Kit-Quellcode mit Releases, Issues und Contribution Guide – ,
icon : Code2 ,
action : "Repository öffnen" ,
href : "https://github.com/knuthtimo-lab/decision-kit" ,
snippet : "git clone https://github.com/knuthtimo-lab/decision-kit.git" ,
status : "knuthtimo-lab/decision-kit" ,
} ,
{
title : "Decision Kit für VS Code" ,
eyebrow : "Extension · v1.0.0" ,
description : "Ziehe einen Gewinner aus markiertem Text, würfle mit Notation wie 2d6+3 und öffne das Glücksrad direkt in deiner IDE." ,
icon : Puzzle ,
action : "Im VS Code Store öffnen" ,
href : "https://marketplace.visualstudio.com/items?itemName=TimoKnuth.decisionkit-vscode" ,
status : "Visual Studio Marketplace" ,
} ,
{
title : "Decision Kit für Chrome" ,
eyebrow : "Browser-Erweiterung · Manifest V3" ,
description : "Random Picker, Glücksrad, Würfel, Münzwurf und praktische Kontextmenü-Kürzel für schnelle Entscheidungen im Browser." ,
icon : Puzzle ,
status : "Chrome Web Store – ,
} ,
{
title : "TypeScript Library" ,
eyebrow : "npm · v1.0.0" ,
description : "Zufallsalgorithmen, Würfel-Parser, Glücksrad-Logik und React Hooks als wiederverwendbare Bausteine." ,
icon : Box ,
action : "npm-Paket ansehen" ,
href : "https://www.npmjs.com/package/decision-kit" ,
snippet : "npm install decision-kit" ,
status : "Node.js & React" ,
} ,
{
title : "Python SDK & CLI" ,
eyebrow : "PyPI · v1.0.0" ,
description : "Decision-Kit für Python-Skripte, Automatisierungen und die Kommandozeile." ,
icon : Terminal ,
action : "PyPI-Projekt ansehen" ,
href : "https://pypi.org/project/decision-kit/" ,
snippet : "pip install decision-kit" ,
status : "Python Package Index" ,
} ,
{
title : "GitHub Action" ,
eyebrow : "GitHub Marketplace" ,
description : "Nutze Auslosungen, Teamaufteilungen und Zufallsentscheidungen direkt in deinen CI/CD-Workflows." ,
icon : Code2 ,
action : "Action ansehen" ,
href : "https://github.com/marketplace/actions/decision-kit-action" ,
snippet : "uses: knuthtimo-lab/decision-kit@v1.0.0" ,
status : "Für GitHub Actions" ,
} ,
] ;
export default function DeveloperPage() {
const jsonLd = {
"@context" : "https://schema.org" ,
"@type" : "SoftwareApplication" ,
name : "Decision Kit" ,
operatingSystem : "All" ,
applicationCategory : "DeveloperApplication" ,
author : { "@type" : "Organization" , name : "Entscheidomat" } ,
codeRepository : "https://github.com/knuthtimo-lab/decision-kit" ,
} ;
return (
< >
< script type = "application/ld+json" dangerouslySetInnerHTML = { { __html : JSON.stringify ( jsonLd ) . replace ( /</g , "\\u003c" ) } } / >
< Nav / >
< main className = "flex-1 bg-paper pb-20 pt-28 sm:pt-32" >
< div className = "mx-auto w-full max-w-6xl px-5 sm:px-8" >
< header className = "max-w-3xl" >
< p className = "text-xs font-semibold uppercase tracking-[0.18em] text-[#0d7a57]" > Entscheidomat für Entwickler < / p >
< h1 className = "mt-4 text-balance font-display text-5xl font-semibold leading-[0.9] tracking-[-0.045em] text-ink sm:text-6xl" > Decision Kit , dort wo du arbeitest . < / h1 >
< p className = "mt-6 max-w-2xl text-base leading-7 text-ink-soft sm:text-lg" > Eine offene Sammlung von Tools für faire Zufallsentscheidungen – im Editor , im Browser , im Terminal und im Workflow . < / p >
< / header >
< section className = "relative mt-12 overflow-hidden rounded-[2rem] bg-[#0b241b] px-6 py-7 text-white shadow-[0_22px_60px_rgb(13_122_87/0.22)] sm:px-10 sm:py-10" >
< div className = "pointer-events-none absolute -right-24 -top-36 h-80 w-80 rounded-full bg-[#38b98c]/25 blur-3xl" / >
< div className = "relative grid gap-8 lg:grid-cols-[1.25fr_0.75fr] lg:items-end" >
< div >
< div className = "inline-flex items-center gap-2 text-sm font-semibold text-emerald-200" > < GithubIcon className = "h-4 w-4" / > Open Source · MIT - Lizenz < / div >
< h2 className = "mt-5 max-w-xl text-3xl font-semibold tracking-tight sm:text-4xl" > Der gesamte Code lebt auf GitHub . < / h2 >
< p className = "mt-4 max-w-xl text-sm leading-6 text-emerald-50/75 sm:text-base" > Quellcode , Issues , Releases und Contribution Guide findest du im offiziellen Decision - Kit - Repository . < / p >
< a href = "https://github.com/knuthtimo-lab/decision-kit" target = "_blank" rel = "noopener noreferrer" className = "mt-7 inline-flex items-center gap-2 rounded-full bg-white px-5 py-3 text-sm font-semibold text-[#0b241b] transition duration-200 hover:-translate-y-0.5 hover:bg-emerald-50 active:translate-y-0" >
GitHub - Repository ö ffnen < ArrowUpRight className = "h-4 w-4" / >
< / a >
< / div >
< div className = "rounded-2xl border border-white/15 bg-black/20 p-5 font-mono text-xs leading-6 text-emerald-50 shadow-inner" >
< p className = "text-emerald-200/70" > # Starte lokal < / p >
< p className = "mt-2 break-all" > git clone https : //github.com/knuthtimo-lab/decision-kit.git</p>
< div className = "my-4 h-px bg-white/10" / >
< p className = "text-emerald-200/70" > # Oder als Paket < / p >
< p className = "mt-2" > npm install decision - kit < / p >
< / div >
< / div >
< / section >
< section className = "mt-16" aria-labelledby = "integrations-heading" >
< div className = "flex flex-col justify-between gap-4 border-b border-line pb-5 sm:flex-row sm:items-end" >
< div >
< p className = "text-xs font-semibold uppercase tracking-[0.18em] text-[#0d7a57]" > Integrationen < / p >
< h2 id = "integrations-heading" className = "mt-2 text-2xl font-semibold tracking-tight text-ink sm:text-3xl" > Installieren , einbinden , loslegen . < / h2 >
< / div >
< p className = "max-w-sm text-sm leading-6 text-ink-soft" > Jede Integration ist unabhängig nutzbar und verweist direkt auf ihren offiziellen Kanal . < / p >
< / div >
< div className = "mt-6 grid gap-4 md:grid-cols-2" >
{ assets . map ( ( asset ) = > {
const Icon = asset . icon ;
return (
< article key = { asset . title } className = "group flex min-h-64 flex-col rounded-3xl border border-line bg-surface p-6 transition duration-200 hover:-translate-y-1 hover:border-[#0d7a57]/40 hover:shadow-lift" >
< div className = "flex items-start justify-between gap-4" >
< div className = "flex h-11 w-11 shrink-0 items-center justify-center rounded-2xl bg-[#e6f7f0] text-[#0d7a57]" > < Icon className = "h-5 w-5" / > < / div >
< p className = "pt-1 text-right text-[11px] font-semibold uppercase tracking-[0.12em] text-[#0d7a57]" > { asset . eyebrow } < / p >
< / div >
< h3 className = "mt-6 text-xl font-semibold tracking-tight text-ink" > { asset . title } < / h3 >
< p className = "mt-2 max-w-md text-sm leading-6 text-ink-soft" > { asset . description } < / p >
{ asset . snippet && < code className = "mt-5 block overflow-x-auto rounded-xl bg-[#111412] px-3.5 py-3 font-mono text-xs text-emerald-100" > { asset . snippet } < / code > }
< div className = "mt-auto flex items-center justify-between gap-4 pt-6" >
< span className = "inline-flex items-center gap-1.5 text-xs font-medium text-ink-soft" > < Check className = "h-3.5 w-3.5 text-[#0d7a57]" / > { asset . status } < / span >
{ asset . href && asset . action ? (
< a href = { asset . href } target = "_blank" rel = "noopener noreferrer" className = "inline-flex shrink-0 items-center gap-1.5 text-sm font-semibold text-[#0d7a57] transition hover:text-[#095c41] hover:underline" > { asset . action } < ArrowUpRight className = "h-4 w-4" / > < / a >
) : < span className = "text-xs font-semibold text-[#0d7a57]" > Bald verfügbar < / span > }
< / div >
< / article >
) ;
} ) }
< / div >
< / section >
< div className = "mt-14 border-t border-line pt-8 text-sm text-ink-soft" > Zurück zu den < Link href = "/" className = "font-semibold text-[#0d7a57] hover:underline" > Entscheidungstools < / Link > . < / div >
< / div >
< / main >
< Footer / >
< / >
) ;
}
