# Pay It Forward Card Shows Case Study — Carter Steinhoff

> Pay It Forward Card Shows case study: a Next.js event platform for show discovery, dealer information, and table reservations.

- Carter's role: Design, full-stack development & CMS

- System: Next.js · Vercel Functions · Neon

- Status: Live and in production

- [Live site](https://www.payitforwardcardshows.com/)

## Overview

One event platform for collectors, dealers, and show operations.

I designed and built the public Next.js experience, custom CMS, serverless actions, and Neon data layer behind show discovery, venue details, dealer guidance, table reservations, and community content.

Each show appears across public pages and operational workflows. Dates, venues, reservation paths, email, and structured data have to stay aligned while collectors and dealers receive different routes through the same event.

## Project story

### Audiences: One show begins with two different questions.

Collectors need to know when to arrive, where to go, and what to expect. Dealers need table options, operating guidance, and a reservation path. The site serves both journeys without separating them from the event they share.

### Event data: A date change is an operational change, not a copy edit.

Show records drive the homepage, upcoming-show archive, dealer paths, email, and JSON-LD. A shared date model keeps same-day events, daylight-saving offsets, and public Eastern Time labels consistent across those surfaces.

### Reliability: Persistence and delivery need separate failure boundaries.

Serverless workflows confirm a reservation in the database before attempting transactional email. A delivery problem is logged separately, so saved data is not presented to the visitor as a failed submission.

## Decisions

### A saved form is a success, even if the email fails

A completed database write no longer becomes an apparent failure when email delivery fails. Persistence is confirmed first; delivery is attempted separately and logged if it fails.

### Every event time is one timezone, in one place

Homepage, archive, and JSON-LD now use one America/New_York date utility. Same-day events and DST offsets resolve consistently, and public copy labels times as ET.

### Reset links expire when the password changes

Reset tokens are tied to the current password hash, so changing the password immediately invalidates older links without another table or expiry system.

### User text is escaped before it reaches email HTML

Public form values are escaped before entering email HTML, including subjects and link attributes. Login and recovery rate limits use durable storage rather than a process-local map.

## Architecture

A custom event stack from page to database.

The Next.js experience is backed by a purpose-built CMS and serverless application layer, keeping event content and operational workflows in one deployable system.

- **Frontend:** Next.js experience deployed through Vercel
- **Content:** Custom CMS for shows, venues, dealers, and community information
- **Backend:** Vercel Serverless Functions for application and reservation workflows
- **Database:** Neon Postgres

## Technology and delivery

A full-stack event platform in one deployable system.

The public experience, custom administration, event data, and communication workflows share a typed Next.js codebase and managed serverless infrastructure.

### Experience

- **nextjs:** Public site, custom CMS, and server routes
- **react:** Show, dealer, and community interfaces
- **typescript:** Typed content and application contracts
- **tailwind:** Responsive visual system

### Data & operations

- **drizzle:** Typed schema and queries for the custom CMS
- **neon:** Managed serverless PostgreSQL
- **resend:** Transactional form and account email
- **vercel:** Application and serverless deployment

## What Carter owned

- Responsive visual direction and frontend development
- Custom CMS for shows, venues, dealer guidance, and community content
- Vercel Serverless Functions for backend and reservation workflows
- Neon Postgres data layer and Vercel deployment

## Selected screens

- **Show-first homepage:** The next event and the strongest visitor actions stay visible from the first screen. [Image](https://cartersteinhoff.co/images/pay-it-forward-project.webp) — Pay It Forward Card Shows homepage with event navigation and trading-card artwork
- **Upcoming shows:** Dates, venue details, and show information are organized around the next visit. [Image](https://cartersteinhoff.co/images/pay-it-forward-shows.webp) — Pay It Forward Card Shows upcoming shows page
- **Dealer information:** Practical guidance and reservation paths give dealers a clear way to participate. [Image](https://cartersteinhoff.co/images/pay-it-forward-dealers.webp) — Pay It Forward Card Shows dealer information and table reservation page
- **Community story:** The organization’s purpose and pay-it-forward mission have a dedicated place in the experience. [Image](https://cartersteinhoff.co/images/pay-it-forward-about.webp) — Pay It Forward Card Shows about page describing its community mission
- **Contact:** A direct contact path separates general questions from the structured dealer workflow. [Image](https://cartersteinhoff.co/images/pay-it-forward-contact.webp) — Pay It Forward Card Shows contact page with message form and organization contact details
- **Collector guide:** A focused guide signup extends the community content beyond event dates and logistics. [Image](https://cartersteinhoff.co/images/pay-it-forward-ebook.webp) — Pay It Forward Card Shows free ebook page with guide cover and signup form

## Current status

Available in production today; the live experience reflects the system shown throughout this case study.

- [Back to all case studies](https://cartersteinhoff.co/portfolio/index.md)

- [Discuss a similar project](https://cartersteinhoff.co/contact/index.md)