A modern, full-featured notary directory platform built with Next.js 15, featuring tiered membership, advanced search capabilities, and comprehensive business tools for notary professionals.

• Advanced Search & Filtering: Location-based search with ZIP code, city, and service type filters
• Interactive Google Maps: Cluster markers, location visualization, and mobile-friendly interface
• Tiered Membership System: FREE, PRO, and PREMIUM plans with progressive feature unlocking
• Public Profile Pages: SEO-optimized profiles with custom URLs for Premium members
• Mobile-Responsive Design: Optimized for all screen sizes and devices

• Basic profile listing
• 1 profile photo
• 5 service areas
• Standard search placement
• Email support

• Featured listing placement
• 5 profile photos
• 15 service areas
• Sample document uploads
• Social media links
• Advanced analytics
• Priority support
• Review management

• Everything in PRO plus:
• Custom branded URLs (yourname.notarydirectory.com)
• QR code profile sharing
• Unlimited photos and documents
• Unlimited service areas
• API access
• Dedicated support
• Custom branding options

• Stripe Integration: Secure payment processing and subscription management
• Email Notifications: Automated communications via Resend
• SEO Optimization: Structured data, meta tags, and search engine friendly URLs
• Analytics Dashboard: Comprehensive business insights for Pro/Premium members
• Lead Generation: Contact forms and inquiry management

• Next.js 15: React framework with App Router
• TypeScript: Type safety and developer experience
• Tailwind CSS 4: Modern utility-first styling
• Headless UI: Accessible component primitives

• Cloudflare Workers: Edge computing platform
• Cloudflare D1: SQLite database at the edge
• Cloudflare R2: Object storage for files and images
• Next.js API Routes: Server-side functionality

• Google Maps API: Location services and mapping
• Stripe: Payment processing and subscriptions
• Resend: Transactional email service
• Cloudflare: CDN, security, and hosting

Before setting up the project, you'll need accounts and API keys for:

1. Cloudflare Account (Free tier available)
2. Google Cloud Platform (Google Maps API)
3. Stripe Account (Test mode available)
4. Resend Account (Free tier available)

git clone https://github.com/your-username/notary-directory.git
cd notary-directory
npm install

Copy the example environment file and configure your API keys:

cp .env.example .env.local

Edit .env.local with your API keys (see Configuration section below).

npm run dev

The application will be available at http://localhost:3000.

npm run build
npm run pages:build  # For Cloudflare Pages deployment

Create a .env.local file with the following variables:

# Database
DATABASE_URL="your-d1-database-url"

# Authentication
AUTH_SECRET="your-jwt-secret-key-change-in-production"

# Email Service (Resend)
RESEND_API_KEY="your-resend-api-key"

# Google Maps
NEXT_PUBLIC_GOOGLE_MAPS_API_KEY="your-google-maps-api-key"

# Stripe (use test keys for development)
STRIPE_SECRET_KEY="sk_test_..."
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY="pk_test_..."
STRIPE_WEBHOOK_SECRET="whsec_..."

# App Configuration
NEXT_PUBLIC_BASE_URL="http://localhost:3000"  # Change for production

• Sign up at cloudflare.com
• Add your domain to Cloudflare (optional for development)

# Install Wrangler CLI
npm install -g wrangler

# Login to Cloudflare
wrangler login

# Create D1 database
wrangler d1 create notary-directory

# Run database migrations
wrangler d1 execute notary-directory --file=./database/schema.sql

# Create R2 bucket for file uploads
wrangler r2 bucket create notary-directory-uploads

# Deploy to Cloudflare Pages
npm run deploy

• Go to Google Cloud Console
• Create a new project or select existing project

Enable the following APIs:

• Maps JavaScript API
• Places API
• Geocoding API

• Go to "Credentials" → "Create Credentials" → "API Key"
• Restrict the API key to your domain for security
• Set usage quotas to prevent unexpected charges

HTTP referrers:
- https://yourdomain.com/*
- https://*.yourdomain.com/*

API restrictions:
- Maps JavaScript API
- Places API
- Geocoding API

• Sign up at stripe.com
• Complete account setup for live payments

Create the following products in Stripe Dashboard:

PRO Membership

• Monthly: $19.00
• Yearly: $190.00 (save $38/year)

PREMIUM Membership

• Monthly: $29.00
• Yearly: $290.00 (save $58/year)

Set up webhook endpoints:

Endpoint URL: https://yourdomain.com/api/webhooks/stripe
Events to send:
- customer.subscription.created
- customer.subscription.updated
- customer.subscription.deleted
- invoice.payment_succeeded
- invoice.payment_failed

Use Stripe test cards for development:

Success: 4242 4242 4242 4242
Decline: 4000 0000 0000 0002

• Sign up at resend.com
• Verify your sending domain

Add these DNS records to your domain:

CNAME: em.yourdomain.com → track.resend.dev
CNAME: feedback-smtp.yourdomain.com → feedback-smtp.resend.dev
TXT: yourdomain.com → "v=spf1 include:_spf.resend.dev ~all"

• Generate API key in Resend dashboard
• Add to .env.local as RESEND_API_KEY

The application uses Cloudflare D1 (SQLite) with the following main tables:

• users - User accounts and authentication
• notaries - Notary profiles and business information
• memberships - Subscription and billing information
• searches - Saved search preferences
• inquiries - Customer inquiries and leads

Run migrations with:

wrangler d1 execute notary-directory --file=./database/schema.sql

POST /api/auth/signin     - User login
POST /api/auth/signup     - User registration
POST /api/auth/signout    - User logout

GET  /api/search/location  - Location-based notary search
GET  /api/search/suggest   - Location autocomplete suggestions

GET    /api/profile/notary       - Get notary profile
PUT    /api/profile/notary       - Update notary profile
POST   /api/profile/notary/photo - Upload profile photo

POST /api/subscriptions/create   - Create subscription
POST /api/subscriptions/cancel   - Cancel subscription
GET  /api/subscriptions/status   - Get subscription status

POST /api/webhooks/stripe  - Stripe webhook handler

1. Build the application:

npm run build
npm run pages:build

2. Deploy via Wrangler:

wrangler pages deploy .next --project-name=notary-directory

3. Set up custom domain:

• Add your domain in Cloudflare Pages dashboard
• Configure DNS to point to Cloudflare

Set these in Cloudflare Pages dashboard:

• All variables from .env.local
• Update NEXT_PUBLIC_BASE_URL to your production domain
• Use live Stripe keys instead of test keys

• Never commit API keys to version control
• Use environment variables for all sensitive data
• Rotate API keys regularly

• Use webhook signatures to verify Stripe events
• Implement proper error handling for payment failures
• Use HTTPS in production

• Implement proper authentication checks
• Sanitize all user inputs
• Use prepared statements to prevent SQL injection

npm run test          # Unit tests
npm run test:e2e      # End-to-end tests
npm run test:coverage # Coverage report

Create test accounts for each membership tier:

• [email protected]
• [email protected]
• [email protected]

• Monitor page views and performance
• Track API usage and errors
• Set up alerts for downtime

• Monitor subscription metrics
• Track revenue and churn
• Analyze payment failures

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Add tests for new functionality
5. Submit a pull request

• Follow TypeScript best practices
• Use Tailwind CSS for styling
• Write tests for new features
• Update documentation

This project is licensed under the MIT License - see the LICENSE file for details.

• Next.js Documentation
• Cloudflare Workers Documentation
• Stripe Documentation
• Google Maps API Documentation

• GitHub Issues for bug reports
• GitHub Discussions for questions
• Discord community for real-time help

• Mobile app (React Native)
• Advanced analytics dashboard
• Multi-language support
• White-label solutions
• Integration marketplace
• Advanced SEO tools

• v1.0.0 - Initial release with core functionality
• v1.1.0 - Google Maps integration and search improvements
• v1.2.0 - Enhanced profile system and tier-based features

Built with ❤️ using Next.js, Cloudflare, and modern web technologies.