Meme management and sharing platform with video support, premium subscriptions, and a TikTok-style reels experience. Built as a full-stack React 19 application with server-side rendering.
Available in French and English.
- Video meme library with HLS streaming and reels navigation
- User authentication (email/password, Twitter OAuth)
- Bookmarking and favorites system
- Premium subscriptions via Stripe
- Full-text search powered by Algolia
- Admin dashboard for content management (upload, moderation, analytics)
- Meme import directly from Twitter/X URLs
- SEO-optimized with structured data and dynamic Open Graph images
- Transactional emails (verification, password reset)
| Category | Technology |
|---|---|
| Framework | TanStack Start (React 19, SSR, Nitro) |
| Routing | TanStack Router (file-based) |
| Data Fetching | TanStack Query |
| Forms | TanStack Form |
| Database | Prisma ORM + PostgreSQL |
| Auth | Better Auth |
| Payments | Stripe |
| Video | Bunny CDN + HLS.js |
| Search | Algolia |
| Resend + React Email | |
| Styling | Tailwind CSS 4 + shadcn/ui |
| Validation | Zod |
| State | Zustand |
| Analytics | Algolia Analytics |
| Service | Purpose |
|---|---|
| Vercel | Hosting (serverless, auto-deploy from main) |
| Neon | PostgreSQL database |
| Bunny CDN | Video storage and HLS delivery |
| Stripe | Payment processing and subscriptions |
| Algolia | Search indexing |
| Resend | Transactional emails |
| Algolia | Search and analytics |
- Node.js 24+
- pnpm 10+
- A PostgreSQL database
- Stripe account (test or live)
- Bunny CDN account with a video library
- Algolia account with a search index
- Resend account
git clone https://github.com/viclafouch/petit-meme
cd petit-meme
pnpm installCopy the example file and fill in your values:
cp .env.example .env.developmentPush the schema to your database:
pnpm exec prisma migrate devpnpm run devPrisma Migrate is used to manage schema changes safely across environments.
After modifying prisma/schema.prisma:
pnpm exec prisma migrate dev --name descriptive_nameThis creates a migration file, applies it to the local database, and regenerates the Prisma Client.
Vercel auto-deploys on push to main. After a deploy that includes new migrations:
pnpm run prisma:migrate:prodThis uses .env.production (pulled via vercel env pull .env.production) which contains the production DATABASE_URL. It applies only pending migrations and is safe and idempotent.
- Migrations must be additive only: new optional fields, new indexes, new tables
- Never drop or rename columns, tables, or enums on production
- New required fields must have a
@default()value - Never use
prisma db pushon production - Always review the generated SQL before committing
Stripe webhooks handle subscription lifecycle events (creation, renewal, cancellation).
Use the Stripe CLI to forward events to your local server:
stripe listen --forward-to localhost:3000/api/auth/stripe/webhookThe CLI outputs a webhook signing secret (whsec_...). Add it to your .env.development as STRIPE_WEBHOOK_SECRET.
- Go to Stripe Dashboard > Webhooks
- Add endpoint:
https://yourdomain.com/api/auth/stripe/webhook - Select the relevant subscription and checkout events
- Copy the signing secret to your production environment
| Command | Description |
|---|---|
pnpm run dev |
Start development server |
pnpm run build |
Build for production |
pnpm start |
Start production server |
pnpm run lint |
TypeScript check + ESLint |
pnpm run lint:fix |
Auto-fix lint issues |
pnpm run prisma:migrate:dev |
Apply pending migrations (via .env.development) |
pnpm run prisma:migrate:prod |
Apply pending migrations (via .env.production) |
pnpm run prisma:seed:dev |
Seed database (via .env.development) |
pnpm run email:dev |
Preview email templates on port 3001 |
src/
├── routes/ # Pages (TanStack Router file-based routing)
├── server/ # Server functions (auth, memes, admin, payments)
├── components/ # React components organized by domain
├── lib/ # Library integrations (auth, algolia, stripe, bunny)
├── constants/ # App constants, types, and env validation
├── helpers/ # Pure utility functions
├── utils/ # Business logic utilities
├── hooks/ # Custom React hooks
├── stores/ # Zustand stores
├── db/ # Prisma client and generated types
└── i18n/ # Internationalization
prisma/ # Schema and migrations
emails/ # React Email templates
crons/ # Scheduled jobs (Algolia sync, Bunny updates)
The app is deployed on Vercel with automatic deploys from the main branch.
Vercel automatically installs dependencies, builds the app, and deploys serverless functions. Database migrations must be applied separately after each deploy that includes schema changes.
Private - All rights reserved