FeaturesTemplatesShowcaseTownie
AI
BlogDocsPricing
Log inSign up
colel
colelrust-coasts-new-community-form
Public
Like
1
rust-coasts-new-community-form
Home
Code
10
backend
1
frontend
3
shared
2
.vtignore
AGENT.md
BRAND_STYLE_GUIDE.md
FEATURE_SPEC.md
README.md
deno.json
main.tsx
Branches
1
Pull requests
Remixes
History
Environment variables
1
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
Sign up now
Code
/
Code
/
Search
index.ts
https://colel--2ae437feacd4439c834d2f85457f1131.web.val.run
README.md

Community Interest Capture System

A location-based community interest capture system for collecting potential event organizers and attendees across multiple cities.

Features

  • Location-Based Pages: Customizable landing pages for different cities (SF, LA, NYC, etc.)
  • Community Interest Form: Collects contact info and event participation preferences
  • Admin Dashboard: Password-protected admin interface with analytics and CSV export
  • Database Storage: Tracks all community interest submissions with SQLite
  • Responsive UI: Clean, modern interface following nostalgic technical design principles
  • Discord Integration: Maintained for future event coordination (optional)

How It Works

  1. Location Access: Users visit city-specific URLs (e.g., /SF, /LA, /NYC)
  2. Interest Submission: Users fill out community interest form with their preferences
  3. Database Storage: Submission is saved to SQLite with location-specific data
  4. Admin Management: Organizers can view, filter, and export all submissions via admin dashboard
  5. CSV Export: Download submissions for outreach and event planning

Project Structure

├── backend/
│   └── index.ts              # Main API server with Hono
├── frontend/
│   ├── index.html           # Main HTML template
│   ├── index.tsx            # React app entry point
│   └── components/
│       ├── App.tsx          # Main app component with routing
│       ├── LocationPage.tsx # Location-specific landing pages
│       ├── CommunityInterestForm.tsx # Community interest form
│       ├── AdminDashboard.tsx # Admin interface
│       ├── TalkSubmissionForm.tsx  # Legacy talk submission form
│       └── SubmissionSuccess.tsx   # Success page component
├── shared/
│   └── types.ts             # Shared TypeScript types
├── FEATURE_SPEC.md          # Feature specification document
├── BRAND_STYLE_GUIDE.md     # Design system and styling guidelines
└── README.md

Setup

Environment Variables

Required

  • ADMIN_PASSWORD: Password for admin dashboard access

Optional (Discord Integration)

You can optionally set up Discord integration for future event coordination:

  • DISCORD_BOT_TOKEN: Your Discord bot token
  • DISCORD_GUILD_ID: Your Discord server ID
  • DISCORD_ORGANIZERS_CHANNEL_ID: Channel ID where organizer notifications are sent
  • DISCORD_CATEGORY_ID (optional): Category ID for organizing talk channels
  • DISCORD_TEST_CATEGORY_ID (optional): Category ID for organizing test channels
  • DISCORD_TEST_ORGANIZERS_CHANNEL_ID (optional): Channel ID for test announcements

Testing Environment Variables

The following environment variables are used for testing the Discord integration without affecting production channels:

  • ENABLE_TEST_API: Set to "true" to enable the test API endpoint (required for testing)
  • DISCORD_TEST_CATEGORY_ID: Separate category for test channels to keep them organized
  • DISCORD_TEST_ORGANIZERS_CHANNEL_ID: Separate channel for test notifications to avoid spamming production organizers

Testing the Discord Integration:

curl -X POST https://rustnyc-talks.val.run/api/discord/test \ -H "Content-Type: application/json" \ -d '{"channelName": "my-test-channel", "firstMessage": "Hello from test endpoint!"}'

Parameters:

  • channelName (required): Name for the test channel (will be sanitized for Discord)
  • firstMessage (required): First message to send to the channel

This will create a test channel with the specified name, send the first message, and return an invite link. If test environment variables are configured, it will also notify the test organizers channel.

Testing Discord Invite Creation Directly:

You can also test the Discord invite creation process directly using Discord's API:

curl -X POST https://discord.com/api/v10/channels/CHANNEL_ID/invites \ -H "Authorization: Bot YOUR_BOT_TOKEN" \ -H "Content-Type: application/json" \ -d '{ "max_age": 0, "max_uses": 0, "unique": true }'

Replace CHANNEL_ID with an existing channel ID and YOUR_BOT_TOKEN with your Discord bot token. This matches exactly how the bot creates invitation links internally.

Discord Bot Setup

  1. Create a Discord application at https://discord.com/developers/applications
  2. Create a bot and copy the token
  3. Invite the bot to your server with the following permissions:
    • Manage Channels
    • Send Messages
    • Create Instant Invite
    • View Channels

Database

The system uses SQLite with the following schemas:

Community Interest Table

CREATE TABLE community_interest_1 ( id INTEGER PRIMARY KEY AUTOINCREMENT, name TEXT NOT NULL, email TEXT NOT NULL, phone TEXT, interest_type TEXT NOT NULL, comments TEXT, location TEXT NOT NULL, created_at DATETIME DEFAULT CURRENT_TIMESTAMP );

Legacy Talk Submissions Table (maintained for existing data)

CREATE TABLE talk_submissions_3 ( id INTEGER PRIMARY KEY AUTOINCREMENT, speaker_name TEXT NOT NULL, talk_context TEXT NOT NULL, is_on_behalf BOOLEAN NOT NULL, submitter_name TEXT, discord_channel_id TEXT, discord_invite_link TEXT, created_at DATETIME DEFAULT CURRENT_TIMESTAMP );

API Endpoints

Community Interest

  • POST /api/community-interest - Submit community interest
  • GET /api/admin/community-interest - Get all community interest entries (admin, password protected)
  • GET /api/admin/community-interest/export - Export community interest as CSV (admin, password protected)

Legacy Talk Submissions (maintained)

  • POST /api/submissions - Submit a new talk proposal
  • GET /api/submissions - Get all submissions (admin)

Discord Integration (optional)

  • POST /api/discord/test - Test Discord integration (creates test channel and sends message)

Discord Integration Status

✅ Discord integration is fully implemented with comprehensive logging

The system will automatically:

  • Create Discord channels for each talk submission
  • Generate invite links for the channels
  • Post notifications to the organizers channel

Comprehensive Logging: The system includes detailed logging throughout the Discord integration process:

  • 🔍 Environment variable checks on startup
  • 🎯 API request tracking with submission details
  • 🔧 Discord channel creation with API responses
  • 🔗 Invite link generation with full details
  • 📢 Organizer notifications with message content
  • 💥 Detailed error logging with stack traces and specific Discord error codes
  • 📊 Final result summaries

Fallback behavior: If Discord credentials are not provided, the system will use placeholder values and log what would have been done, allowing the form to still function for testing.

Debugging: Use the requests tool to view detailed logs of each submission, including all Discord API interactions and any errors that occur.

Usage

Community Interest Capture

  1. Visit a location-specific URL (e.g., /SF, /LA, /NYC)
  2. Fill out the community interest form with your contact info and preferences
  3. Submit the form to express interest in organizing or attending events
  4. Form submissions are stored for organizers to review and follow up

Admin Dashboard

  1. Visit /admin to access the admin dashboard
  2. Enter the admin password to authenticate
  3. View analytics and filter submissions by location or interest type
  4. Download CSV exports for outreach and event planning

Legacy Talk Submissions

  1. Visit the root URL (/) to access the original talk submission form
  2. Fill out the talk submission form
  3. Submit the form and receive a Discord invite link (if configured)
  4. Join the Discord channel to discuss your talk with organizers

Tech Stack

  • Backend: Hono (API framework)
  • Frontend: React 18.2.0 with TypeScript
  • Database: SQLite
  • Styling: CSS with custom properties (following brand style guide)
  • Platform: Val Town (Deno runtime)
  • Design System: Nostalgic minimal technical theme with Instrument Serif headings
HTTP
  • index.ts
    colel--2a…31.web.val.run
Code
backendfrontendshared.vtignoreAGENT.mdBRAND_STYLE_GUIDE.mdFEATURE_SPEC.mdREADME.mddeno.jsonmain.tsx
Go to top
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Product
FeaturesPricing
Developers
DocsStatusAPI ExamplesNPM Package Examples
Explore
ShowcaseTemplatesNewest ValsTrending ValsNewsletter
Company
AboutBlogCareersBrandhi@val.town
Terms of usePrivacy policyAbuse contact
© 2025 Val Town, Inc.