🧘

Serenity

Completed 2025 • Dual Symfony apps (API + web) with React via UX React and Turbo/Stimulus enhancements

Serenity is a dual Symfony stack (API + web) delivering subscription-based access to curated book content and verb-generation exercises. The API handles books/chapters, histories, plans/subscriptions, invoices, gift cards, professionals/cabinets, testimonials, and Stripe webhooks. The web app embeds React dashboards via UX React with Tailwind/Flowbite/MUI styling, providing user and pro experiences (profiles, history, subscriptions, gift cards, client management, email campaigns, stats) plus Turbo/Stimulus-enhanced flows. Email is powered by Mailjet/SendGrid; Stripe manages checkout, invoices, and webhooks.

Full-Stack Development Web Development Backend Development SaaS Payments Subscriptions React Stripe

Overview

Serenity is a dual Symfony stack (API + web) delivering subscription-based access to curated book content and verb-generation exercises. The API handles books/chapters, histories, plans/subscriptions, invoices, gift cards, professionals/cabinets, testimonials, and Stripe webhooks. The web app embeds React dashboards via UX React with Tailwind/Flowbite/MUI styling, providing user and pro experiences (profiles, history, subscriptions, gift cards, client management, email campaigns, stats) plus Turbo/Stimulus-enhanced flows. Email is powered by Mailjet/SendGrid; Stripe manages checkout, invoices, and webhooks.

Key Features

✓

Stripe-powered subscriptions with webhook-driven activation and invoicing

✓

Gift card issuance and activation with email delivery

✓

Verb/chapter generation with history logging and free-access gating

✓

pages.portfolio.projects.serenity.features.3

✓

pages.portfolio.projects.serenity.features.4

✓

React components via UX React with Tailwind/Flowbite/MUI styling and Framer Motion animations

✓

API token + session auth, voters for access control, email verification & password reset

Technical Highlights

⚡

Implemented Stripe checkout and webhook handling for subscription lifecycle

⚡

Built React dashboards for users and professionals via UX React with Tailwind/Flowbite

⚡

Added gift card generation/activation with email delivery and verification

⚡

Secured verb access with history logging and free-usage gating

⚡

Hybrid Symfony + React architecture with Turbo/Stimulus for smooth UX

Challenges and Solutions

Subscription Lifecycle

Handled checkout, invoices, and webhook events while syncing local subscriptions and invoices

Gift Card Redemption

Generated and activated codes with email confirmations and cleanup

Hybrid Frontend

Embedded React components via UX React alongside Twig/Turbo while keeping styling consistent

Secure Access Control

Combined API token/session auth, voters, and history gating for verb access

Technologies

Backend

Symfony 6.2 PHP 8.1+ Doctrine ORM Stripe SDK PostgreSQL

Frontend

Symfony 6.2 React 18 (UX React) Tailwind CSS Flowbite MUI Framer Motion Stimulus Turbo

Services

StripeService SubscriptionService GiftCardService Mailjet/SendGrid Mailers UploadImage CodeGenerationService

Infrastructure

Docker Compose

Project Information

Status
Completed
Year
2025
Architecture
Dual Symfony apps (API + web) with React via UX React and Turbo/Stimulus enhancements
Category
Full-Stack Development
Back to Portfolio View Projects Full-Stack Development