From fea6a8e64bb25317601ef44cb6bdb8b364f3adac Mon Sep 17 00:00:00 2001 From: Till JS Date: Tue, 24 Mar 2026 10:04:59 +0100 Subject: [PATCH] feat: add it.mana.how landing page for European tech sovereignty MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit New Astro landing page at services/it-landing/ targeting European organizations that need independent, GDPR-compliant IT infrastructure. 10 sections: - Hero: "Technologische Souveränität für Europa" with 75% self-hosted stat - Problem: US Cloud Act, vendor lock-in, GDPR conflicts, Schrems II - Solution: IndependenceBar (animated 75% progress) + 3 principles - Infrastructure Grid: 21 components color-coded (green/amber/red) - GDPR: 6 compliance cards (all rights, breach notification, AI safety) - Open Source Stack: 8 comparisons (PostgreSQL vs DynamoDB, etc.) - Target Audiences: Government, healthcare, education, SMBs - Roadmap: Timeline from current state to 90%+ independence (2027) - FAQ: 8 questions about sovereignty, Cloud Act, local AI, costs - CTA: Contact for consultation Features: - Light EU Sovereign theme (#003399 EU blue, professional B2B design) - German (default) + English (/en/) with Astro i18n - Custom components: InfrastructureGrid, IndependenceBar (scroll animation) - Data from docs/TECH_STACK_INDEPENDENCE.md (real infrastructure stats) - Legal pages: Impressum, Datenschutz - Deploy: pnpm deploy:landing:it → Cloudflare Pages Co-Authored-By: Claude Opus 4.6 (1M context) --- package.json | 1 + services/it-landing/astro.config.mjs | 15 + services/it-landing/package.json | 26 ++ services/it-landing/public/favicon.svg | 4 + .../src/components/IndependenceBar.astro | 74 +++++ .../src/components/InfrastructureGrid.astro | 52 +++ services/it-landing/src/data/audiences.ts | 26 ++ services/it-landing/src/data/faq.ts | 42 +++ services/it-landing/src/data/features.ts | 97 ++++++ .../it-landing/src/data/infrastructure.ts | 116 +++++++ services/it-landing/src/data/roadmap.ts | 55 +++ services/it-landing/src/layouts/Layout.astro | 58 ++++ .../it-landing/src/pages/datenschutz.astro | 54 +++ services/it-landing/src/pages/en/index.astro | 314 ++++++++++++++++++ services/it-landing/src/pages/impressum.astro | 34 ++ services/it-landing/src/pages/index.astro | 170 ++++++++++ services/it-landing/src/styles/global.css | 25 ++ services/it-landing/tailwind.config.mjs | 40 +++ services/it-landing/tsconfig.json | 3 + services/it-landing/wrangler.toml | 3 + 20 files changed, 1209 insertions(+) create mode 100644 services/it-landing/astro.config.mjs create mode 100644 services/it-landing/package.json create mode 100644 services/it-landing/public/favicon.svg create mode 100644 services/it-landing/src/components/IndependenceBar.astro create mode 100644 services/it-landing/src/components/InfrastructureGrid.astro create mode 100644 services/it-landing/src/data/audiences.ts create mode 100644 services/it-landing/src/data/faq.ts create mode 100644 services/it-landing/src/data/features.ts create mode 100644 services/it-landing/src/data/infrastructure.ts create mode 100644 services/it-landing/src/data/roadmap.ts create mode 100644 services/it-landing/src/layouts/Layout.astro create mode 100644 services/it-landing/src/pages/datenschutz.astro create mode 100644 services/it-landing/src/pages/en/index.astro create mode 100644 services/it-landing/src/pages/impressum.astro create mode 100644 services/it-landing/src/pages/index.astro create mode 100644 services/it-landing/src/styles/global.css create mode 100644 services/it-landing/tailwind.config.mjs create mode 100644 services/it-landing/tsconfig.json create mode 100644 services/it-landing/wrangler.toml diff --git a/package.json b/package.json index 38a49353f..7fd2a71e5 100644 --- a/package.json +++ b/package.json @@ -248,6 +248,7 @@ "deploy:landing:clock": "pnpm --filter @clock/landing build && npx wrangler pages deploy apps/clock/apps/landing/dist --project-name=clocks-landing", "deploy:landing:mail": "pnpm --filter @mail/landing build && npx wrangler pages deploy apps/mail/apps/landing/dist --project-name=mail-landing", "deploy:landing:moodlit": "pnpm --filter @moodlit/landing build && npx wrangler pages deploy apps/moodlit/apps/landing/dist --project-name=moodlit-landing", + "deploy:landing:it": "pnpm --filter @mana/it-landing build && npx wrangler pages deploy services/it-landing/dist --project-name=it-landing", "deploy:landing:all": "pnpm deploy:landing:calendar && pnpm deploy:landing:chat && pnpm deploy:landing:picture && pnpm deploy:landing:manacore && pnpm deploy:landing:manadeck && pnpm deploy:landing:zitare && pnpm deploy:landing:presi && pnpm deploy:landing:clock && pnpm deploy:landing:mail && pnpm deploy:landing:nutriphi", "dev:docs": "pnpm --filter @manacore/docs dev", "build:docs": "pnpm --filter @manacore/docs build", diff --git a/services/it-landing/astro.config.mjs b/services/it-landing/astro.config.mjs new file mode 100644 index 000000000..0d04953ba --- /dev/null +++ b/services/it-landing/astro.config.mjs @@ -0,0 +1,15 @@ +import { defineConfig } from 'astro/config'; +import tailwind from '@astrojs/tailwind'; +import sitemap from '@astrojs/sitemap'; + +export default defineConfig({ + site: 'https://it.mana.how', + integrations: [tailwind(), sitemap()], + i18n: { + defaultLocale: 'de', + locales: ['de', 'en'], + routing: { + prefixDefaultLocale: false, + }, + }, +}); diff --git a/services/it-landing/package.json b/services/it-landing/package.json new file mode 100644 index 000000000..9cbafbfa1 --- /dev/null +++ b/services/it-landing/package.json @@ -0,0 +1,26 @@ +{ + "name": "@mana/it-landing", + "version": "0.1.0", + "private": true, + "type": "module", + "scripts": { + "dev": "astro dev --port 4330", + "start": "astro dev", + "build": "astro check && astro build", + "preview": "astro preview", + "astro": "astro", + "type-check": "astro check" + }, + "dependencies": { + "@astrojs/check": "^0.9.0", + "@astrojs/sitemap": "^3.2.1", + "@manacore/shared-landing-ui": "workspace:*", + "astro": "^5.16.0", + "typescript": "^5.0.0" + }, + "devDependencies": { + "@astrojs/tailwind": "^6.0.0", + "@tailwindcss/typography": "^0.5.16", + "tailwindcss": "^3.4.17" + } +} diff --git a/services/it-landing/public/favicon.svg b/services/it-landing/public/favicon.svg new file mode 100644 index 000000000..92bfa5331 --- /dev/null +++ b/services/it-landing/public/favicon.svg @@ -0,0 +1,4 @@ + + + IT + diff --git a/services/it-landing/src/components/IndependenceBar.astro b/services/it-landing/src/components/IndependenceBar.astro new file mode 100644 index 000000000..ab7cd9ce6 --- /dev/null +++ b/services/it-landing/src/components/IndependenceBar.astro @@ -0,0 +1,74 @@ +--- +interface Props { + percent: number; + target: number; + labelCurrent?: string; + labelTarget?: string; +} + +const { percent, target, labelCurrent = 'Self-Hosted', labelTarget = 'Ziel' } = Astro.props; +--- + +
+
+
+ {percent}% + {labelCurrent} +
+
+ {labelTarget}: {target}%+ +
+
+ +
+ +
+
+ + +
+
+
+ +
+
+ + Self-Hosted (14) +
+
+ + Cloud, ersetzbar (5) +
+
+ + Cloud, unvermeidbar (2) +
+
+
+ + diff --git a/services/it-landing/src/components/InfrastructureGrid.astro b/services/it-landing/src/components/InfrastructureGrid.astro new file mode 100644 index 000000000..801f3ff60 --- /dev/null +++ b/services/it-landing/src/components/InfrastructureGrid.astro @@ -0,0 +1,52 @@ +--- +import type { InfraComponent } from '../data/infrastructure'; + +interface Props { + items: InfraComponent[]; +} + +const { items } = Astro.props; + +const statusColors = { + 'self-hosted': { + bg: 'bg-green-50', + border: 'border-green-200', + badge: 'bg-green-100 text-green-800', + label: 'Self-Hosted', + }, + replaceable: { + bg: 'bg-amber-50', + border: 'border-amber-200', + badge: 'bg-amber-100 text-amber-800', + label: 'Migration geplant', + }, + unavoidable: { + bg: 'bg-red-50', + border: 'border-red-200', + badge: 'bg-red-100 text-red-800', + label: 'Cloud (unvermeidbar)', + }, +}; +--- + +
+ { + items.map((item) => { + const colors = statusColors[item.status]; + return ( +
+
{item.icon}
+

{item.name}

+

{item.technology}

+ + {colors.label} + +
+ ); + }) + } +
diff --git a/services/it-landing/src/data/audiences.ts b/services/it-landing/src/data/audiences.ts new file mode 100644 index 000000000..a9d10f612 --- /dev/null +++ b/services/it-landing/src/data/audiences.ts @@ -0,0 +1,26 @@ +export const audiences = [ + { + icon: '🏛️', + title: 'Öffentliche Verwaltung', + description: + 'Behörden und öffentliche Einrichtungen, die digitale Souveränität umsetzen müssen. DSGVO-konform, keine US-Cloud-Abhängigkeit, transparenter Open-Source-Stack.', + }, + { + icon: '🏥', + title: 'Gesundheitswesen', + description: + 'Krankenhäuser, Praxen und Gesundheitsorganisationen mit höchsten Datenschutzanforderungen. Patientendaten bleiben garantiert in Deutschland.', + }, + { + icon: '🎓', + title: 'Bildung & Forschung', + description: + 'Universitäten, Schulen und Forschungseinrichtungen, die unabhängige KI-Tools und sichere Kommunikation benötigen. Sonderkonditionen verfügbar.', + }, + { + icon: '🏢', + title: 'Mittelstand (KMU)', + description: + 'Europäische Unternehmen, die sich von Big-Tech-Abhängigkeit lösen und gleichzeitig modernste KI-Tools nutzen wollen. Flexibles Credit-System statt Abo-Falle.', + }, +]; diff --git a/services/it-landing/src/data/faq.ts b/services/it-landing/src/data/faq.ts new file mode 100644 index 000000000..0b9281dac --- /dev/null +++ b/services/it-landing/src/data/faq.ts @@ -0,0 +1,42 @@ +export const faqs = [ + { + question: 'Was bedeutet technologische Souveränität?', + answer: + 'Die Fähigkeit, Ihre IT-Infrastruktur unabhängig von ausländischen Anbietern zu betreiben und zu kontrollieren. Bei Mana heißt das: 75% unserer Infrastruktur läuft auf eigenen Servern in Deutschland — mit dem Ziel, 90%+ zu erreichen.', + }, + { + question: 'Warum ist der US Cloud Act ein Problem?', + answer: + 'Der US Cloud Act verpflichtet amerikanische Unternehmen, US-Behörden Zugang zu Daten zu gewähren — auch wenn diese auf Servern in Europa gespeichert sind. Das steht im direkten Widerspruch zur DSGVO und gefährdet die Datenhoheit europäischer Organisationen.', + }, + { + question: 'Welche Cloud-Abhängigkeiten bleiben bestehen?', + answer: + 'Nur zwei: Stripe für Zahlungsabwicklung (es gibt keinen vollständig europäischen Payment-Gateway-Ersatz) und Google OAuth für den optionalen Google-Kontakte-Import. Alle anderen Komponenten sind self-hosted oder werden aktiv migriert.', + }, + { + question: 'Wie funktioniert die lokale KI?', + answer: + 'Wir betreiben Ollama mit Modellen wie Gemma 3 auf unserem Server in Deutschland. FLUX.2 generiert Bilder lokal, Whisper transkribiert Sprache, Piper und Kokoro synthetisieren Sprache — alles ohne Cloud-API-Aufrufe. Bei Überlastung gibt es einen optionalen Fallback auf Google Gemini.', + }, + { + question: 'Ist der Open-Source-Stack enterprise-tauglich?', + answer: + 'Absolut. PostgreSQL, Redis und MinIO betreiben die Infrastruktur von Unternehmen wie Apple, Instagram und Netflix. Diese Technologien sind bewährter als viele proprietäre Alternativen.', + }, + { + question: 'Kann ich die Mana-Infrastruktur für meine Organisation nutzen?', + answer: + 'Ja. Wir bieten Beratung und Implementierung für Organisationen, die eine ähnliche unabhängige Infrastruktur aufbauen möchten. Kontaktieren Sie uns für ein individuelles Angebot.', + }, + { + question: 'Was kostet der Wechsel weg von US-Cloud-Anbietern?', + answer: + 'Langfristig sparen Sie. Open-Source-Software hat keine Lizenzkosten. Die Initialinvestition in eigene Server amortisiert sich typischerweise innerhalb von 12-18 Monaten gegenüber Cloud-Abonnements.', + }, + { + question: 'Wo stehen die Server?', + answer: + 'In Deutschland. Die Produktionsinfrastruktur läuft auf eigener Hardware mit 74 Docker-Containern, erreichbar über einen Cloudflare Tunnel (der mittelfristig durch WireGuard ersetzt wird).', + }, +]; diff --git a/services/it-landing/src/data/features.ts b/services/it-landing/src/data/features.ts new file mode 100644 index 000000000..b586ca310 --- /dev/null +++ b/services/it-landing/src/data/features.ts @@ -0,0 +1,97 @@ +export const problemFeatures = [ + { + icon: '🛡️', + title: 'US Cloud Act', + description: + 'US-Behörden können jederzeit auf Daten zugreifen, die bei amerikanischen Cloud-Anbietern gespeichert sind — selbst wenn die Server in Europa stehen.', + }, + { + icon: '🔒', + title: 'Vendor Lock-in', + description: + 'Proprietäre Systeme von AWS, Google und Microsoft schaffen Abhängigkeiten, die Millionen kosten und Innovationsfreiheit einschränken.', + }, + { + icon: '⚠️', + title: 'Fehlende Kontrolle', + description: + 'Bei Cloud-Ausfällen oder Preisänderungen gibt es keinen Plan B. Europäische Organisationen sind den Entscheidungen US-amerikanischer Konzerne ausgeliefert.', + }, + { + icon: '⚖️', + title: 'DSGVO-Konflikte', + description: + 'Schrems II hat gezeigt: Der Datentransfer in die USA ist rechtlich problematisch. Jedes Unternehmen, das US-Cloud nutzt, trägt ein Compliance-Risiko.', + }, +]; + +export const gdprFeatures = [ + { + icon: '✅', + title: 'Rechtmäßigkeit & Transparenz', + description: + 'Nur technisch notwendige Cookies. Explizite Einwilligung für alle Datenverarbeitungen. Keine versteckten Datensammlungen.', + }, + { + icon: '📉', + title: 'Datenminimierung', + description: + 'Nur E-Mail bei Registrierung. Automatische Löschung nach Zweckerfüllung. Anonymisierte Analytics mit self-hosted Umami.', + }, + { + icon: '👤', + title: 'Betroffenenrechte', + description: + 'Alle 6 Rechte umgesetzt: Auskunft, Berichtigung, Löschung, Übertragbarkeit, Widerspruch, Einschränkung — per Self-Service im Dashboard.', + }, + { + icon: '🔐', + title: 'Technische Sicherheit', + description: + 'TLS 1.3, AES-256 Verschlüsselung, EdDSA JWT-Authentifizierung, regelmäßige Sicherheitsaudits.', + }, + { + icon: '🚨', + title: '72h Breach Notification', + description: + 'Automatisierte Erkennung von Datenschutzverletzungen. Sofortige interne Eskalation. Meldung an Aufsichtsbehörde innerhalb von 72 Stunden.', + }, + { + icon: '🤖', + title: 'KI ohne Trainingsrisiko', + description: + 'Keine Nutzerdaten für KI-Training. Lokale Modelle verarbeiten Daten direkt auf dem Server — nichts verlässt die Infrastruktur.', + }, +]; + +export const stackFeatures = [ + { icon: '🗄️', title: 'PostgreSQL 16', description: 'Statt DynamoDB / Firestore' }, + { icon: '⚡', title: 'Redis 7', description: 'Statt ElastiCache' }, + { icon: '📦', title: 'MinIO', description: 'Statt AWS S3' }, + { icon: '🔐', title: 'Better Auth', description: 'Statt Auth0 / Okta' }, + { icon: '🔍', title: 'SearXNG', description: 'Statt Google / Algolia' }, + { icon: '💬', title: 'Matrix/Synapse', description: 'Statt Slack / Teams' }, + { icon: '🤖', title: 'Ollama + Gemma', description: 'Statt OpenAI API' }, + { icon: '📊', title: 'VictoriaMetrics', description: 'Statt Datadog' }, +]; + +export const principles = [ + { + icon: 'shield' as const, + title: 'Daten in Deutschland', + description: + 'Alle Nutzerdaten verbleiben auf eigenen Servern in Deutschland. Kein Datentransfer in Drittländer. Keine US-Cloud-Abhängigkeit.', + }, + { + icon: 'code' as const, + title: 'Open-Source-Stack', + description: + 'PostgreSQL, Redis, MinIO, Matrix — unsere Infrastruktur basiert auf bewährten Open-Source-Technologien. Kein proprietäres Lock-in.', + }, + { + icon: 'rocket' as const, + title: 'Lokale KI', + description: + 'LLM, Bilderzeugung, Spracherkennung und Sprachsynthese laufen lokal auf eigener Hardware. Keine Daten verlassen den Server.', + }, +]; diff --git a/services/it-landing/src/data/infrastructure.ts b/services/it-landing/src/data/infrastructure.ts new file mode 100644 index 000000000..c29c9f006 --- /dev/null +++ b/services/it-landing/src/data/infrastructure.ts @@ -0,0 +1,116 @@ +export type InfraStatus = 'self-hosted' | 'replaceable' | 'unavoidable'; + +export interface InfraComponent { + name: string; + technology: string; + status: InfraStatus; + icon: string; +} + +export const infrastructure: InfraComponent[] = [ + // Self-hosted (green) + { + name: 'Datenbank', + technology: 'PostgreSQL 16 + Drizzle ORM', + status: 'self-hosted', + icon: '🗄️', + }, + { name: 'Cache', technology: 'Redis 7', status: 'self-hosted', icon: '⚡' }, + { + name: 'Object Storage', + technology: 'MinIO (S3-kompatibel)', + status: 'self-hosted', + icon: '📦', + }, + { + name: 'Authentifizierung', + technology: 'Better Auth (EdDSA JWT)', + status: 'self-hosted', + icon: '🔐', + }, + { name: 'Suche', technology: 'SearXNG + mana-search', status: 'self-hosted', icon: '🔍' }, + { name: 'Messaging', technology: 'Matrix/Synapse + 13 Bots', status: 'self-hosted', icon: '💬' }, + { + name: 'Monitoring', + technology: 'VictoriaMetrics + Grafana', + status: 'self-hosted', + icon: '📊', + }, + { name: 'Analytics', technology: 'Umami', status: 'self-hosted', icon: '📈' }, + { + name: 'Error Tracking', + technology: 'GlitchTip (Sentry-kompatibel)', + status: 'self-hosted', + icon: '🐛', + }, + { name: 'Automation', technology: 'n8n', status: 'self-hosted', icon: '⚙️' }, + { name: 'LLM / KI-Chat', technology: 'Ollama + Gemma 3', status: 'self-hosted', icon: '🤖' }, + { + name: 'Spracherkennung', + technology: 'Whisper Large V3 (mana-stt)', + status: 'self-hosted', + icon: '🎤', + }, + { + name: 'Sprachsynthese', + technology: 'Piper + Kokoro (mana-tts)', + status: 'self-hosted', + icon: '🔊', + }, + { + name: 'Bildgenerierung', + technology: 'FLUX.2 klein (mana-image-gen)', + status: 'self-hosted', + icon: '🎨', + }, + + // Cloud but replaceable (amber) + { name: 'E-Mail', technology: 'Brevo SMTP → Postal geplant', status: 'replaceable', icon: '📧' }, + { + name: 'Landing Pages', + technology: 'Cloudflare Pages → Self-hosted geplant', + status: 'replaceable', + icon: '🌐', + }, + { + name: 'Tunnel/DNS', + technology: 'Cloudflare Tunnel → WireGuard geplant', + status: 'replaceable', + icon: '🔗', + }, + { + name: 'Bild-API', + technology: 'Replicate → mana-image-gen Migration', + status: 'replaceable', + icon: '🖼️', + }, + { + name: 'Vision-KI', + technology: 'Google Gemini → lokale Modelle testen', + status: 'replaceable', + icon: '👁️', + }, + + // Unavoidable cloud (red) + { + name: 'Zahlungen', + technology: 'Stripe (kein EU-Alternative)', + status: 'unavoidable', + icon: '💳', + }, + { + name: 'Google OAuth', + technology: 'Für Kontakte-Import nötig', + status: 'unavoidable', + icon: '🔑', + }, +]; + +export const stats = { + selfHosted: 14, + replaceable: 5, + unavoidable: 2, + total: 21, + percentSelfHosted: 75, + targetPercent: 90, +}; diff --git a/services/it-landing/src/data/roadmap.ts b/services/it-landing/src/data/roadmap.ts new file mode 100644 index 000000000..9a255925a --- /dev/null +++ b/services/it-landing/src/data/roadmap.ts @@ -0,0 +1,55 @@ +export const roadmapItems = [ + { + badge: '✅ Abgeschlossen', + title: 'Lokale KI-Infrastruktur', + text: 'LLM (Ollama + Gemma 3), Bilderzeugung (FLUX.2 klein), Spracherkennung (Whisper Large V3) und Sprachsynthese (Piper + Kokoro) laufen vollständig lokal.', + }, + { + badge: 'Q2 2026', + title: 'Cloud-KI eliminieren', + text: 'Picture App auf lokales mana-image-gen migrieren. Alle LLM-Calls über zentrales mana-llm Gateway routen mit automatischem Google-Fallback.', + }, + { + badge: 'Q3 2026', + title: 'E-Mail-Unabhängigkeit', + text: 'Brevo SMTP durch self-hosted Postal oder Stalwart ersetzen. DNS bei eigenem europäischen Provider.', + }, + { + badge: 'Q4 2026', + title: 'Landing Pages self-hosted', + text: 'Statische Seiten direkt vom eigenen Server ausliefern statt über Cloudflare Pages. Nginx/Caddy Container.', + }, + { + badge: '2027', + title: 'Server-Redundanz & 90%+ Unabhängigkeit', + text: 'Zweiter Server für Hochverfügbarkeit. PostgreSQL Streaming Replication. Kein Single Point of Failure. Ziel: über 90% Self-Hosted.', + }, +]; + +export const roadmapItemsEn = [ + { + badge: '✅ Completed', + title: 'Local AI Infrastructure', + text: 'LLM (Ollama + Gemma 3), image generation (FLUX.2), speech recognition (Whisper), and text-to-speech (Piper + Kokoro) run fully locally.', + }, + { + badge: 'Q2 2026', + title: 'Eliminate Cloud AI', + text: 'Migrate Picture App to local mana-image-gen. Route all LLM calls through central mana-llm gateway with automatic Google fallback.', + }, + { + badge: 'Q3 2026', + title: 'Email Independence', + text: 'Replace Brevo SMTP with self-hosted Postal or Stalwart. DNS with own European provider.', + }, + { + badge: 'Q4 2026', + title: 'Self-Hosted Landing Pages', + text: 'Serve static sites directly from own server instead of Cloudflare Pages.', + }, + { + badge: '2027', + title: 'Server Redundancy & 90%+ Independence', + text: 'Second server for high availability. PostgreSQL streaming replication. No single point of failure.', + }, +]; diff --git a/services/it-landing/src/layouts/Layout.astro b/services/it-landing/src/layouts/Layout.astro new file mode 100644 index 000000000..5aac726ed --- /dev/null +++ b/services/it-landing/src/layouts/Layout.astro @@ -0,0 +1,58 @@ +--- +import '../styles/global.css'; + +interface Props { + title: string; + description?: string; + lang?: string; +} + +const { + title, + description = 'Europäische Technologie-Souveränität — 75% self-hosted Infrastruktur, DSGVO-konform, Open Source', + lang = 'de', +} = Astro.props; +--- + + + + + + + + + + + + + + + + + + + + + + + + + { + import.meta.env.PUBLIC_UMAMI_WEBSITE_ID && ( +