• Townie
    AI
  • Blog
  • Docs
  • Pricing
  • We’re hiring!
Log inSign up
jessicaocean

jessicaocean

OUT-app

Public
Like
OUT-app
Home
Code
10
.vscode
1
backend
3
frontend
3
shared
1
.gitignore
CONTRIBUTING.md
LICENSE
README.md
package.json
tsconfig.json
Branches
1
Pull requests
Remixes
History
Environment variables
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://jessicaocean--86583e9e61d711f0939e0224a6c84d84.web.val.run
README.md

OUT - Neighborhood Parenting App

OUT is an app that makes raising children together in the city as effortless as possible. It helps parents discover spontaneous opportunities to connect with their community - from open doors at neighbors' houses to impromptu playground meetups.

Note: This repository contains the source code for a Val Town application. It's primarily intended for code sharing and AI tool access. The application is designed to run on Val Town's platform.

Core Concept

The app solves the "computational problem" of parenting social coordination by knowing:

  • Where everyone is and what they're up for
  • What sort of hanging out they want (energy levels, social circles)
  • How to get there and the effort required
  • What affordances exist for childcare at each location

Features

πŸ” Magic Link Authentication

  • Passwordless login: Sign in with just your email address
  • Magic links: Receive secure login links via email (15-minute expiration)
  • Persistent sessions: Stay logged in across browser sessions
  • Easy account recovery: No passwords to forget or reset

Social Circles

  • Old Pals: Effortless, energizing relationships - see all your activities
  • Friends: Some energy required but enjoyable bonds - see friend and old pal activities
  • New Friends: Getting-to-know-you relationships - see activities targeted to all circles

Activity Types

  • Open Door: "Come over anytime" invitations with duration
  • Public Outings: Scheduled activities anyone can join
  • Private Outings: Planned activities for specific circles
  • Help Requests: Mutual aid opportunities

Smart Discovery

  • Distance-based filtering: Only see activities within reasonable travel time
  • Transport optimization: Calculates best travel mode (walk, bike, transit, car)
  • Social targeting: Only see activities from people in your circles
  • Natural language: "Go to Bob's place (5 min bike ride)"

Friend Management

  • Add friends by email: No more cryptic user IDs - just enter their email
  • Drag & drop organization: Move friends between circles by dragging their cards
  • Remove friends: Drag to trash zone to stop sharing activities
  • Visual interface: See all your social connections organized by intimacy level

Project Structure

β”œβ”€β”€ backend/
β”‚   β”œβ”€β”€ database/
β”‚   β”‚   β”œβ”€β”€ migrations.ts    # Database schema setup
β”‚   β”‚   └── queries.ts       # Database query functions
β”‚   β”œβ”€β”€ routes/
β”‚   β”‚   β”œβ”€β”€ users.ts         # User management endpoints
β”‚   β”‚   β”œβ”€β”€ activities.ts    # Activity management endpoints
β”‚   β”‚   └── static.ts        # Static file serving
β”‚   └── index.ts             # Main Hono app entry point
β”œβ”€β”€ frontend/
β”‚   β”œβ”€β”€ components/
β”‚   β”‚   β”œβ”€β”€ App.tsx          # Main React app
β”‚   β”‚   β”œβ”€β”€ ActivityList.tsx # List of available activities
β”‚   β”‚   β”œβ”€β”€ CreateActivity.tsx # Form to create new activities
β”‚   β”‚   β”œβ”€β”€ FriendsManager.tsx # Manage social circles and friends
β”‚   β”‚   └── UserSetup.tsx    # Initial user registration
β”‚   β”œβ”€β”€ index.html           # Main HTML template
β”‚   β”œβ”€β”€ index.tsx            # Frontend entry point
β”‚   └── style.css            # Styling
β”œβ”€β”€ shared/
β”‚   └── types.ts             # Shared TypeScript types
└── README.md

Technology Stack

  • Backend: Hono (lightweight web framework)
  • Database: Val Town SQLite
  • Frontend: React with TypeScript
  • Styling: TailwindCSS
  • Deployment: Val Town

Getting Started

This project is designed to run on Val Town, a platform for hosting serverless TypeScript applications.

Prerequisites

  • A Val Town account
  • Basic knowledge of TypeScript/React

Deployment on Val Town

  1. Import the project: Copy all files to your Val Town workspace
  2. Set up the database: The SQLite database will be automatically created when you first run the app
  3. Configure environment variables: Set up any required environment variables in Val Town
  4. Deploy: The main entry point is backend/index.ts which serves both the API and the frontend

Local Development

While this project is optimized for Val Town, you can explore the code locally:

# Clone the repository git clone <your-repo-url> cd OUT-app # Install dependencies (for IDE support) npm install # Note: This project uses Val Town's runtime and won't run locally without modifications

Val Town Specific Features

This project uses several Val Town-specific features:

  • SQLite database: Via @stevekrouse/sqlite
  • Blob storage: Via @std/blob
  • Email service: Via @std/email
  • File utilities: Via @std/utils

API Endpoints

Authentication

  • POST /api/auth/login - Request magic link login email
  • POST /api/auth/verify - Verify login token from email link

Users

  • POST /api/users - Register a new user
  • GET /api/users/:id - Get user information
  • PUT /api/users/:id - Update user information
  • POST /api/users/:id/friends - Add friend by email
  • PUT /api/users/:id/friends/:friendId - Move friend to different circle
  • DELETE /api/users/:id/friends/:friendId - Remove friend from all circles

Activities

  • POST /api/activities - Broadcast a new activity
  • GET /api/activities/:id - Get activity details
  • PUT /api/activities/:id/deactivate - Deactivate an activity
  • GET /api/activities/owner/:ownerId - Get activities by owner

Discovery

  • GET /api/discovery/:userId - Get available options for a user
  • GET /api/discovery/:userId/formatted - Get formatted options with natural language

Data Models

User

  • Basic profile information
  • Location and transport modes
  • Social circles (old pals, friends, new friends)
  • Children information and sleep schedules

Activity

  • Type (open_door, public_outing, private_outing, help_request)
  • Location and timing information
  • Target audience (which social circles can see it)
  • Affordances (bathroom, shade, food, etc.)

Future Enhancements

  • Real-time updates via WebSockets
  • Google Calendar and Huckleberry integrations
  • Push notifications
  • In-app messaging
  • Recurring activities
  • User feedback and ratings
HTTP
  • index.ts
    jessicaocean--86…84.web.val.run
Code
.vscodebackendfrontendshared.gitignoreCONTRIBUTING.mdLICENSEREADME.mdpackage.jsontsconfig.json
FeaturesVersion controlCode intelligenceCLI
Use cases
TeamsAI agentsSlackGTM
DocsShowcaseTemplatesNewestTrendingAPI examplesNPM packages
PricingNewsletterBlogAboutCareers
We’re hiring!
Brandhi@val.townStatus
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Terms of usePrivacy policyAbuse contact
Β© 2025 Val Town, Inc.