🎓 Certificate Generator

From participant data → personalized certificates → verified credentials.

A full-stack certificate issuance, delivery & verification platform.

✦ The Problem

Issuing certificates for an event sounds simple.

Until you have 500 participants.

Spreadsheet
     ↓
Copy names manually
     ↓
Design certificate
     ↓
Generate PDFs one-by-one
     ↓
Rename files
     ↓
Send emails manually
     ↓
Track who received what
     ↓
Handle verification requests

That's where the workflow breaks.

Certificate Generator turns all of this into one system.

                 ┌──────────────────────┐
                 │       ORGANIZER       │
                 └──────────┬───────────┘
                            │
                            ▼
                 ┌──────────────────────┐
                 │     CREATE EVENT     │
                 └──────────┬───────────┘
                            │
                            ▼
                 ┌──────────────────────┐
                 │    IMPORT CSV DATA   │
                 └──────────┬───────────┘
                            │
                            ▼
                 ┌──────────────────────┐
                 │   REVIEW PARTICIPANTS│
                 └──────────┬───────────┘
                            │
                            ▼
                 ┌──────────────────────┐
                 │   CHOOSE TEMPLATE    │
                 └──────────┬───────────┘
                            │
                            ▼
              ┌─────────────────────────────┐
              │   BULK CERTIFICATE ENGINE   │
              └─────────────┬───────────────┘
                            │
              ┌─────────────┼─────────────┐
              ▼             ▼             ▼
          ┌───────┐     ┌───────┐     ┌───────┐
          │  PDF  │     │  ZIP  │     │ EMAIL │
          └───┬───┘     └───────┘     └───┬───┘
              │                            │
              └────────────┬───────────────┘
                           ▼
                ┌─────────────────────┐
                │     PARTICIPANT     │
                │      DASHBOARD      │
                └──────────┬──────────┘
                           │
                           ▼
                ┌─────────────────────┐
                │ PUBLIC VERIFICATION │
                └─────────────────────┘

✨ What It Does

👨‍💼 Organizer

Secure signup/login
Create events
Upload participants
Preview imported data
Select certificate templates
Generate certificates in bulk
Download ZIP archives
Email certificates
Manage certificate records

👤 Participant

Secure login
Personal dashboard
Event-wise certificates
Certificate downloads
Unique certificate IDs
Public verification
Access certificates anytime

🚀 Features

01 — 🔐 Authentication

Two sides of the platform:

             Authentication
                   │
          ┌────────┴────────┐
          ▼                 ▼
      Organizer          Participant
          │                 │
          ▼                 ▼
       Dashboard         Dashboard

Authentication and authorization are handled using Supabase Auth.

02 — 📅 Event Management

Organizers can create an event and associate participants and certificates with it.

Event
 ├── Name
 ├── Date
 ├── Participants
 ├── Template
 └── Certificates

This keeps large certificate batches organized instead of treating every certificate as an isolated file.

03 — 📊 CSV Import

Upload participant data instead of manually entering hundreds of records.

participants.csv
        │
        ▼
   Papa Parse
        │
        ▼
   Data Validation
        │
        ▼
 Duplicate Check
        │
        ▼
 Participant Preview
        │
        ▼
      Import

Package: papaparse

04 — 👀 Participant Preview

Before generating anything, organizers can inspect imported participants.

┌──────────────────────────────────────────────────┐
│ PARTICIPANTS                                     │
├──────────────────────────────────────────────────┤
│ Name             Email                    Status  │
├──────────────────────────────────────────────────┤
│ Aryansh Gupta    aryansh@email.com         ✓     │
│ Stuti Verma      stuti@email.com           ✓     │
│ Shaurya Agrawal  shaurya@email.com         ✓     │
└──────────────────────────────────────────────────┘

This prevents bad data from becoming bad certificates.

🎨 05 — Certificate Templates

The platform currently supports:

Classic

Traditional certificate styling.

Modern

A cleaner contemporary certificate layout.

              CERTIFICATE
                  OF
              ACHIEVEMENT

             This certifies that

              SHAURYA AGRAWAL

        has successfully participated in

              EVENT NAME 2026

             CERT-2026-305NDF

⚙️ 06 — Bulk Certificate Engine

This is the core of the application.

Instead of:

1 participant → 1 manual certificate

the system handles:

500 participants
      │
      ▼
500 personalized certificates

Each certificate gets:

Participant name
Event information
Personalized content
Unique certificate ID
PDF output

🆔 07 — Unique Certificate IDs

Every certificate receives a unique identifier.

CERT-YYYY-XXXXXX

Example:

CERT-2026-305NDF

The repository currently documents this certificate ID format and uses it as part of the verification flow.

📦 08 — ZIP Export

Generating hundreds of certificates shouldn't mean downloading hundreds of files individually.

                Generated PDFs
                     │
       ┌─────────────┼─────────────┐
       ▼             ▼             ▼
    Alice.pdf      Bob.pdf       Charlie.pdf
       │             │             │
       └─────────────┼─────────────┘
                     ▼
                  JSZip
                     │
                     ▼
            certificates.zip

Package: jszip

📧 09 — Email Delivery

Certificates can be distributed directly to participants.

Certificate PDF
      │
      ▼
    Resend
      │
      ▼
Participant Email
      │
      ▼
📬 Certificate Delivered

Package: resend

👤 10 — Participant Dashboard

Participants get their own certificate library.

┌──────────────────────────────────────────┐
│             MY CERTIFICATES              │
├──────────────────────────────────────────┤
│                                          │
│  Hackathon 2026              [Download]  │
│  CERT-2026-305NDF                        │
│                                          │
│  Workshop 2026              [Download]   │
│  CERT-2026-81K2PQ                        │
│                                          │
└──────────────────────────────────────────┘

Certificates are grouped by event for easier discovery.

🔎 11 — Public Verification

A certificate isn't useful if nobody can verify it.

The verification system allows a certificate ID to be checked independently.

          CERT-2026-305NDF
                  │
                  ▼
         Verification Page
                  │
                  ▼
           Database Lookup
                  │
          ┌───────┴───────┐
          ▼               ▼
       VALID            INVALID
          │               │
          ▼               ▼
   Certificate Info     Not Found

This turns the PDF from a static document into a verifiable digital credential.

🛡️ Security Architecture

Security is built into the data layer.

                  ┌──────────────┐
                  │    Client    │
                  └──────┬───────┘
                         │
                         ▼
                  ┌──────────────┐
                  │    Supabase  │
                  │     Auth     │
                  └──────┬───────┘
                         │
                         ▼
                  ┌──────────────┐
                  │ PostgreSQL   │
                  │              │
                  │     RLS      │
                  └──────────────┘

Security features

Supabase Authentication
PostgreSQL Row Level Security
Authenticated dashboards
Organizer/participant separation
Duplicate participant protection
Unique certificate identifiers
Controlled public verification

Supabase provides the project's authentication, PostgreSQL database and RLS layer.

🧠 Complete System Architecture

                         ┌──────────────────────┐
                         │       Browser        │
                         │   Next.js + React    │
                         └──────────┬───────────┘
                                    │
                         ┌──────────▼───────────┐
                         │    Authentication    │
                         │     Supabase Auth    │
                         └──────────┬───────────┘
                                    │
                   ┌────────────────┼────────────────┐
                   │                │                │
                   ▼                ▼                ▼
              Organizer         Participant       Public
              Dashboard         Dashboard       Verification
                   │                │                │
                   └────────────────┼────────────────┘
                                    │
                                    ▼
                         ┌──────────────────────┐
                         │   Next.js API Layer │
                         │      Node.js        │
                         └──────────┬───────────┘
                                    │
                  ┌─────────────────┼─────────────────┐
                  │                 │                 │
                  ▼                 ▼                 ▼
             Supabase            pdf-lib            Resend
             PostgreSQL          PDF Engine       Email Service
                  │                 │                 │
                  └─────────────────┼─────────────────┘
                                    │
                                    ▼
                                  JSZip
                                    │
                                    ▼
                            Download / Delivery

🧩 Technology Stack

Frontend

Technology	Purpose
Next.js 16	Full-stack React framework
React 19	UI & component architecture
TypeScript 5	Type-safe development
Tailwind CSS 4	Styling
React Compiler	React optimization

Backend

Technology	Purpose
Next.js API Routes	Server-side APIs
Node.js	Runtime
Zod	Validation

Database & Authentication

Technology	Purpose
Supabase	Backend platform
PostgreSQL	Relational database
Supabase Auth	Authentication
RLS	Database-level authorization

Document & Data Processing

Package	Purpose
`pdf-lib`	Generate PDFs
`papaparse`	Parse CSV files
`jszip`	Create ZIP archives
`nanoid`	Generate unique IDs
`zod`	Validate structured data

Communication

Package	Purpose
`resend`	Certificate email delivery

Deployment

GitHub
   │
   ▼
Vercel
   │
   └── Next.js Application
          │
          ├── Supabase
          └── Resend

These packages and versions are reflected in the current repository's package.json.

📦 Package Architecture

One of the things I wanted to make clear in this project is why each dependency exists.

                    certificate-generator
                             │
       ┌─────────────────────┼─────────────────────┐
       │                     │                     │
       ▼                     ▼                     ▼
     UI / App             Data Layer           Services
       │                     │                     │
       ▼                     ▼                     ▼
   next.js              supabase-js            resend
   react                @supabase/ssr
   tailwind             zod
       │
       ├─────────────────────────────────────────┐
       │                                         │
       ▼                                         ▼
 Document Processing                       File Processing
       │                                         │
       ▼                                         ▼
    pdf-lib                                    jszip
    papaparse                                  nanoid

Dependency summary

next              → Application framework
react              → UI
typescript         → Type safety
tailwindcss        → Styling
supabase-js        → Database + Auth
@supabase/ssr      → Supabase server integration
pdf-lib            → PDF generation
papaparse          → CSV processing
jszip              → ZIP generation
resend             → Email delivery
nanoid             → Unique identifiers
zod                → Runtime validation

The current dependency set includes all of the above packages.

🔄 End-to-End Flow

Organizer Flow

LOGIN
  │
  ▼
DASHBOARD
  │
  ▼
CREATE EVENT
  │
  ▼
UPLOAD CSV
  │
  ▼
PARSE CSV
  │
  ▼
VALIDATE
  │
  ▼
CHECK DUPLICATES
  │
  ▼
PREVIEW
  │
  ▼
SELECT TEMPLATE
  │
  ▼
GENERATE PDFs
  │
  ├──────────────┐
  ▼              ▼
DOWNLOAD ZIP    SEND EMAILS
  │              │
  └───────┬──────┘
          ▼
       DATABASE

Participant Flow

RECEIVE CERTIFICATE
        │
        ▼
      LOGIN
        │
        ▼
    DASHBOARD
        │
        ▼
  VIEW CERTIFICATE
        │
        ▼
     DOWNLOAD
        │
        ▼
   SHARE / VERIFY

Verification Flow

Certificate ID
      │
      ▼
Public Verification
      │
      ▼
Database Query
      │
   ┌──┴──┐
   ▼     ▼
 VALID  INVALID
   │       │
   ▼       ▼
Details  Failed

🗂️ Project Structure

certificate-generator/
│
├── public/
│   └── assets
│
├── src/
│   ├── app/
│   │   ├── api/
│   │   ├── dashboard/
│   │   ├── login/
│   │   ├── verify/
│   │   └── ...
│   │
│   ├── components/
│   │   └── reusable UI
│   │
│   └── lib/
│       ├── supabase/
│       ├── validation/
│       ├── certificates/
│       └── utilities/
│
├── package.json
├── next.config.ts
├── tsconfig.json
├── eslint.config.mjs
├── postcss.config.mjs
└── README.md

🧪 Development

Clone

git clone https://github.com/shaurya3571/certificate-generator.git
cd certificate-generator

Install

npm install

Environment

Create:

.env.local

Configure your Supabase and Resend credentials.

NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key

RESEND_API_KEY=your_resend_api_key

Run

npm run dev

Then open:

http://localhost:3000

Available scripts in the current project include:

npm run dev
npm run build
npm run start
npm run lint

📊 Current Feature Status

✅ Built

Feature	Status
Organizer authentication	✅
Participant authentication	✅
Event creation	✅
CSV participant import	✅
Participant preview	✅
Classic template	✅
Modern template	✅
Bulk PDF generation	✅
Unique certificate IDs	✅
ZIP export	✅
Email delivery	✅
Participant dashboard	✅
Event-wise grouping	✅
Certificate downloads	✅
Public verification	✅
Supabase RLS	✅
Duplicate protection	✅
Vercel deployment	✅

The current GitHub README documents these as the project's implemented main features.

🔮 What's Next?

🎨 Certificate Designer

Move from predefined templates to a visual editor.

┌────────────────────────────────────┐
│          CANVAS                    │
│                                    │
│     ┌──────────────────────┐       │
│     │ CERTIFICATE           │       │
│     │                       │       │
│     │      {{NAME}}         │       │
│     │                       │       │
│     └──────────────────────┘       │
│                                    │
└────────────────────────────────────┘
       │
       ▼
 Drag • Drop • Resize • Customize

🖼️ Custom Branding

Future support for:

Organization logos
Custom colors
Custom fonts
Signature uploads
Background images
Brand presets

🔗 QR Verification

Add a QR code directly to every certificate.

Certificate
      │
      ▼
   QR Code
      │
      ▼
Scan
      │
      ▼
Verification Page

📈 Analytics

Future organizer analytics:

Certificates Generated     1,248
Certificates Delivered       982
Certificates Downloaded      734
Verification Checks          421

👥 Organizations & Teams

Move beyond individual organizers.

Organization
      │
 ┌────┼────┐
 ▼    ▼    ▼
Admin Staff Staff

Role-based access could allow teams to collaboratively manage events and certificates.

🌐 Custom Verification Domains

Future:

verify.yourorganization.com/CERT-2026-305NDF

instead of a generic verification route.

🛣️ Product Roadmap

                    NOW
                     │
                     ▼
        ┌──────────────────────┐
        │ Certificate Platform │
        └──────────┬───────────┘
                   │
        ┌──────────┼──────────┐
        ▼          ▼          ▼
    Templates   Delivery   Verification
        │          │          │
        └──────────┼──────────┘
                   │
                   ▼
          ┌─────────────────┐
          │ Visual Designer │
          └────────┬────────┘
                   │
                   ▼
             QR Verification
                   │
                   ▼
               Analytics
                   │
                   ▼
           Organizations
                   │
                   ▼
            SaaS Platform

💭 Engineering Takeaways

Building this project involved solving problems beyond UI development.

Data

How should participant records, events and certificates relate?

Security

Who should be allowed to access each certificate?

Scale

How should hundreds of certificates be generated efficiently?

Documents

How do you reliably create personalized PDFs programmatically?

Distribution

How can generated certificates be delivered automatically?

Verification

How can a third party determine whether a certificate is legitimate?

UX

How can a complicated workflow feel simple to an organizer?

🧰 What This Project Demonstrates

                    FULL STACK
                        │
        ┌───────────────┼────────────────┐
        │               │                │
        ▼               ▼                ▼
      Frontend        Backend         Database
        │               │                │
      Next.js        API Routes       PostgreSQL
      React          Node.js          Supabase
      TypeScript                        RLS
        │
        ├─────────────────────────────────────┐
        │                                     │
        ▼                                     ▼
   Document Systems                       DevOps
        │                                     │
      pdf-lib                              Vercel
      JSZip                               Deployment
      Papa Parse

Name		Name	Last commit message	Last commit date
public		public
src		src
.gitignore		.gitignore
AGENTS.md		AGENTS.md
CLAUDE.md		CLAUDE.md
README.md		README.md
eslint.config.mjs		eslint.config.mjs
next.config.ts		next.config.ts
package-lock.json		package-lock.json
package.json		package.json
postcss.config.mjs		postcss.config.mjs
tsconfig.json		tsconfig.json

Latest commit

History

Folders and files

Repository files navigation