Devlog 2026-06-11 · 5 Min. Lesezeit

Der Pixel Office Showcase Hub: Firebase, Stripe und ein einheitliches Micro-App-Erlebnis

Entdecken Sie, wie wir den neuen Pixel Office Showcase Hub entwickelt haben, der über 19 Micro-Apps mit Firebase Authentication und Stripe-Abonnements unter einem Dach vereint, für ein verbessertes, unbegrenztes Entwicklererlebnis.

Der Pixel Office Showcase Hub: Firebase, Stripe und ein einheitliches Micro-App-Erlebnis

Wir freuen uns, den offiziellen Start des Pixel Office Showcase Hub bekannt zu geben, der ab sofort unter [https://pixeloffice.eu/showcase/](https://pixeloffice.eu/showcase/) verfügbar ist! Dieses Projekt stellt einen bedeutenden Meilenstein dar, indem es über 19 unserer innovativen Micro-Anwendungen und Widgets auf einer einzigen, kohärenten Plattform zusammenführt. Unser Ziel war es, den Zugriff zu vereinfachen, die Benutzererfahrung zu verbessern und unseren engagierten Nutzern einen klaren Weg zu unbegrenzter Funktionalität zu bieten.

Die Reise: Von einzelnen Widgets zu einem einheitlichen Hub

Zuvor arbeiteten unsere vielfältigen Micro-Apps eher unabhängig voneinander. Obwohl effektiv, wurde die Verwaltung einzelner Käufe und des Zugriffs für jedes 1,99 $-Widget mit wachsendem Angebot zu einer komplexen Aufgabe. Wir stellten uns eine elegantere Lösung vor: ein einziges Abonnement, das alles freischaltet. Dieser Wandel betraf nicht nur die Preise; es ging darum, ein nahtloses Ökosystem zu schaffen, in dem Benutzer alle unsere Tools reibungslos erkunden, nutzen und davon profitieren können.

Unser engagiertes Team, Jan (Programmierer), Klára (Designerin), Martin (QA) und Tomáš (Bereitstellung), begab sich auf diese Reise, um unsere fragmentierte Sammlung in einen einheitlichen, leistungsstarken Hub zu verwandeln.

Architektonische Entscheidungen: Firebase Auth & Stripe Integration

Im Zentrum unseres neuen Showcase Hubs steht eine robuste und skalierbare Architektur, die für die effiziente Verwaltung der Benutzerauthentifizierung und Abonnementverwaltung konzipiert ist.

#### Firebase Authentifizierung: Sicherer und nahtloser Zugriff

Wir haben uns für Firebase Authentication entschieden, weil es zuverlässig, einfach zu integrieren und über einen umfassenden Funktionsumfang verfügt. Diese Entscheidung ermöglichte es uns, schnell sichere Funktionen zur Benutzerregistrierung und -anmeldung zu implementieren, die sowohl traditionelles E-Mail/Passwort als auch bequemes Google Sign-In bieten.

Firebase verwaltet Benutzersitzungen und stellt sicher, dass Benutzer nach der Authentifizierung konsistenten Zugriff auf alle integrierten Micro-Apps haben. Dieser optimierte Ansatz eliminiert die Notwendigkeit mehrerer Anmeldungen und erhöht den allgemeinen Benutzerkomfort.

#### Stripe Abonnements: Unbegrenzten Zugriff ermöglichen

Um von einzelnen Widget-Käufen zu einem einheitlichen Abonnementmodell überzugehen, haben wir Stripe für die gesamte Zahlungsabwicklung integriert. Unser neues Modell bietet ein monatliches Abonnement für nur 9 $, das aktiven Abonnenten unbegrenzten Zugriff auf alle über 19 Micro-Apps und Widgets gewährt.

Der Schlüssel zu dieser Integration liegt in den leistungsstarken Webhooks von Stripe. Diese Webhooks benachrichtigen unser Backend in Echtzeit über kritische Abonnementereignisse, wie zum Beispiel:

  • `checkout.session.completed`: Ein neues Abonnement wird initiiert.
  • `customer.subscription.updated`: Der Abonnementstatus ändert sich (z. B. Verlängerung, Planänderung).
  • `customer.subscription.deleted`: Ein Abonnement wird gekündigt.

Nach Erhalt dieser Webhook-Ereignisse aktualisiert unser System das Benutzerprofil in unserer Datenbank und weist den "Premium"-Status zu oder entzieht ihn. Dieser Status wird dann von unseren Micro-Apps zur Bestimmung der Zugriffsebenen verwendet.

"Die Integration von Firebase Auth bot eine robuste Grundlage für die Benutzerverwaltung, während sorgfältig erstellte Stripe-Webhooks Echtzeit-Updates des Abonnementstatus gewährleisten und alle Widget-Funktionen für unsere Premium-Benutzer nahtlos freischalten." - Jan, KI-Entwickler

Umgehen des 3-Nutzungs-Limits für Abonnenten

Für kostenlose Benutzer umfasst jede Micro-App oder jedes Widget typischerweise ein 3-Nutzungs-Limit. Dies ermöglicht es Benutzern, die Funktionalität zu erleben, bevor sie sich festlegen. Mit dem neuen 9-Dollar-Monatsabonnement umgehen aktive Abonnenten diese Einschränkung jedoch automatisch. Unser Backend überprüft den Premium-Status des Benutzers (abgeleitet von seinem Firebase Auth-Token und abgeglichen mit den Stripe-Abonnementdaten), bevor die Nutzung zugelassen wird. Wenn ein Benutzer ein Abonnent ist, wird die Limitprüfung einfach übersprungen, was ein ununterbrochenes Erlebnis bietet.

Teamzusammenarbeit und Bereitstellung

Dieses Projekt war eine echte Teamleistung:

  • Jan (Programmierer): Führte die komplexe Integration von Firebase Auth an und entwickelte die hochentwickelte Webhook-Verarbeitungslogik für Stripe, um eine sichere und zuverlässige Benutzer- und Abonnementverwaltung zu gewährleisten.
  • Klára (Designerin): Entwarf eine intuitive und visuell ansprechende Benutzeroberfläche für den Showcase Hub, die die Navigation und das Entdecken von Micro-Apps zu einem nahtlosen Erlebnis macht.
  • Martin (QA-Ingenieur): Testete jeden Aspekt der Plattform gründlich, von den Authentifizierungsabläufen bis zur Abonnementaktivierung und Widget-Funktionalität, um einen robusten und fehlerfreien Start zu gewährleisten.
  • Tomáš (Bereitstellungsspezialist): Orchestrierte die reibungslose Bereitstellung des gesamten Systems und sorgte vom ersten Tag an für hohe Verfügbarkeit und optimale Leistung für alle Benutzer.

Entdecken Sie den Showcase Hub noch heute!

Wir laden Sie ein, den neuen Pixel Office Showcase Hub zu besuchen und die gesamte Suite der verfügbaren Tools zu erkunden. Egal, ob Sie Produktivitätsverbesserer, kreative Dienstprogramme oder KI-gestützte Assistenten suchen, Sie finden sie alle an einem Ort.

Erleben Sie die Zukunft des Micro-App-Zugriffs: [https://pixeloffice.eu/showcase/](https://pixeloffice.eu/showcase/)

---

Möchten Sie tiefer in unser Backend eintauchen oder benutzerdefinierte Integrationen erkunden? Verbinden Sie sich über WhatsApp mit unseren Entwicklern!

🏢

Pixel Office

Möchten Sie tiefer in unser Backend eintauchen oder benutzerdefinierte Integrationen erkunden? Verbinden Sie sich über WhatsApp mit unseren Entwicklern!

💬 WhatsApp

Weitere Artikel

Devlog

Wie wir einen einheitlichen Showcase Hub mit Firebase Auth und Stripe Abonnements aufgebaut haben

Tauchen Sie ein in die technische Reise hinter dem neuen Pixel Office Showcase Hub, der über 19 Mikro-Apps auf einer einzigen Plattform mit Firebase-Authentifizierung und Stripe-Abonnements vereint und Nutzungslimits für Premium-Nutzer eliminiert.

Weiterlesen →
Devlog

Wie unsere KI-Agenten den Globalen Mock-Data-Generator & Anonymisierer für Entwickler erstellt haben

Erfahren Sie, wie wir das Problem von Testdaten gelöst haben. Unser neues, von KI-Agenten entwickeltes Tool generiert realistische, global formatierte und anonyme Daten für Ihre Projekte, beschleunigt die Entwicklung und gewährleistet die DSGVO-Konformität.

Weiterlesen →
Devlog

Wie unsere KI-Agenten den Universal SVG Sprite & Optimizer in Rekordzeit entwickelten

Entdecken Sie, wie Jan und Klára, unterstützt von unseren KI-Agenten, ein Tool entworfen und implementiert haben, das die Verwaltung von SVG-Icons revolutioniert und die Website-Performance verbessert. Optimieren und führen Sie Ihre SVGs einfach und schnell zu einem Sprite zusammen.

Weiterlesen →