Getting Started

This guide walks through setting up Surflink for local development.

Prerequisites

Node.js 18+ (LTS recommended)
npm (comes with Node.js) or yarn
A Supabase project (create one free)
(Optional) An Adobe Frame.io developer account for video import
(Optional) Xcode 15+ for the Apple Watch companion app

Installation

Clone the repository and install dependencies:

git clone https://github.com/your-org/surflink-app.git
cd surflink-app
npm install

Environment Variables

Create a .env.local file in the project root with the following variables:

# Required -- Modal (SurfVision AI backend)
NEXT_PUBLIC_MODAL_API_URL=https://your-modal-deployment.modal.run

# Required -- Supabase
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key

# Required -- Email
RESEND_API_KEY=your-resend-key
RESEND_FROM_EMAIL=admin@yourdomain.com

# Required -- Video stream security
STREAM_SIGNING_SECRET=generate-a-random-secret

# Optional -- Frame.io integration
FRAMEIO_CLIENT_ID=your-frameio-client-id
FRAMEIO_CLIENT_SECRET=your-frameio-client-secret
FRAMEIO_REDIRECT_URI=http://localhost:3000/api/auth/frameio/callback

# Optional -- Apple Push Notifications
APNS_KEY_ID=your-key-id
APNS_TEAM_ID=your-team-id
APNS_PRIVATE_KEY=your-private-key
APNS_BUNDLE_ID=com.yourorg.surflink
APNS_ENVIRONMENT=development

Variable	Required	Description
`NEXT_PUBLIC_MODAL_API_URL`	Yes	Modal (SurfVision) API base URL
`NEXT_PUBLIC_SUPABASE_URL`	Yes	Your Supabase project URL
`NEXT_PUBLIC_SUPABASE_ANON_KEY`	Yes	Supabase anonymous/public key
`RESEND_API_KEY`	Yes	Resend email API key
`RESEND_FROM_EMAIL`	Yes	Sender address for emails
`STREAM_SIGNING_SECRET`	Yes	HMAC secret for signed video stream URLs
`FRAMEIO_CLIENT_ID`	No	Adobe Frame.io OAuth client ID
`FRAMEIO_CLIENT_SECRET`	No	Adobe Frame.io OAuth client secret
`FRAMEIO_REDIRECT_URI`	No	Frame.io OAuth callback URL
`APNS_KEY_ID`	No	Apple Push Notification key ID
`APNS_TEAM_ID`	No	Apple Developer Team ID
`APNS_PRIVATE_KEY`	No	APNs private key (p8 format)
`APNS_BUNDLE_ID`	No	iOS app bundle identifier
`APNS_ENVIRONMENT`	No	`development` or `production`

Database Setup

The full database schema lives in supabase/schema.sql. To apply it:

Open your Supabase project dashboard
Navigate to SQL Editor
Paste the contents of supabase/schema.sql
Click Run to create all 35+ tables and their RLS policies

The schema creates tables for coaches, students, sessions, clips, annotations, drills, lessons, skills, achievements, messages, billing, competitions, and more -- all with comprehensive Row Level Security policies.

Running the Dev Server

npm run dev

Open http://localhost:3000. The landing page will load. Sign up to create a coach account and you'll be redirected to the dashboard.

Available Scripts

Command	Description
`npm run dev`	Start the development server
`npm run build`	Create an optimized production build
`npm run start`	Start the production server
`npm run lint`	Run ESLint checks

Overview

Architecture