SSA 2025 - Sun* Kudo System

A modern web application for sending and receiving Kudos, built with Next.js and deployed on Cloudflare Workers.

Tech Stack

Frontend

• Next.js 15 - React framework with App Router
• React 18 - UI library
• TypeScript 5 - Type-safe JavaScript
• Tailwind CSS 4 - Utility-first CSS framework
• Tiptap - Rich text editor

Backend & Database

• Supabase - Backend as a Service (PostgreSQL, Auth, Storage)

Deployment & Infrastructure

• Cloudflare Workers - Edge runtime deployment
• OpenNext - Next.js adapter for Cloudflare
• Wrangler - Cloudflare CLI tool

Testing & Quality

• Vitest - Unit testing framework
• Testing Library - React testing utilities
• ESLint - Code linting

Getting Started

Prerequisites

• Node.js 20+
• Yarn 1.x

Installation

# Install dependencies
yarn install

# Copy environment variables
cp .env.local.example .env.local
# Then edit .env.local with your Supabase credentials

Development

# Start development server
yarn dev

Open http://localhost:3000 in your browser.

Testing

# Run tests in watch mode
yarn test

# Run tests once
yarn test:run

Linting

yarn lint

Deployment

This project is deployed on Cloudflare Workers using OpenNext adapter.

Deploy Commands

Command	Description
yarn build:cloudflare	Build for Cloudflare Workers
yarn preview:cloudflare	Local preview before deployment
yarn deploy:cloudflare	Deploy to Cloudflare Workers

Quick Deploy

# Build and deploy in one step
yarn build:cloudflare && yarn deploy:cloudflare

Environment Variables

Configure environment variables in Cloudflare Dashboard:

1. Go to Cloudflare Dashboard
2. Navigate to: Workers & Pages → ssa-2025-ex → Settings → Variables
3. Add the following variables:

Variable	Description
NEXT_PUBLIC_SUPABASE_URL	Supabase project URL
NEXT_PUBLIC_SUPABASE_ANON_KEY	Supabase anonymous key

For local development, use .dev.vars file.

Production URL

https://ssa-2025-ex.nguyen-ngoc-hung-b.workers.dev

Project Structure

├── app/                    # Next.js App Router
│   ├── (auth)/            # Auth routes (login)
│   ├── (main)/            # Main app routes
│   ├── api/               # API routes
│   └── auth/              # Auth callback
├── components/            # React components
├── hooks/                 # Custom React hooks
├── lib/                   # Utilities and services
│   ├── i18n/             # Internationalization
│   ├── services/         # Business logic
│   ├── supabase/         # Supabase clients
│   └── utils/            # Helper functions
├── types/                 # TypeScript types
└── public/               # Static assets

Scripts Reference

Script	Description
yarn dev	Start development server
yarn build	Build for production (Node.js)
yarn start	Start production server (Node.js)
yarn lint	Run ESLint
yarn test	Run tests in watch mode
yarn test:run	Run tests once
yarn build:cloudflare	Build for Cloudflare Workers
yarn preview:cloudflare	Preview Cloudflare build locally
yarn deploy:cloudflare	Deploy to Cloudflare Workers