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

tijs

family-gpt-chat

Public
Like
family-gpt-chat
Home
Code
6
backend
2
frontend
3
shared
1
README.md
deno.json
deno.lock
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://tijs--781ccf526e3e11f084e90224a6c84d84.web.val.run
README.md

Family GPT Chat

A ChatGPT-like chat application built for Val Town using React and Hono with OpenAI integration.

Features

  • πŸ’¬ Real-time chat interface with ChatGPT-like styling
  • πŸ€– OpenAI GPT-3.5-turbo integration via Val Town's standard library
  • πŸ“± Responsive design with Tailwind CSS
  • ⚑ Fast TypeScript development with Deno
  • πŸ”„ Conversation history maintained during session
  • ⏳ Loading states and error handling
  • βœ… Full type safety with TypeScript

Project Structure

family-gpt/
β”œβ”€β”€ backend/
β”‚   β”œβ”€β”€ index.ts          # Hono server with chat API
β”‚   └── index.test.ts     # Backend tests
β”œβ”€β”€ frontend/
β”‚   β”œβ”€β”€ components/
β”‚   β”‚   β”œβ”€β”€ App.tsx       # Main chat interface
β”‚   β”‚   β”œβ”€β”€ ChatMessage.tsx # Individual message component
β”‚   β”‚   └── MessageInput.tsx # Message input form
β”‚   β”œβ”€β”€ index.html        # Bootstrap HTML file
β”‚   └── index.tsx         # React entry point
β”œβ”€β”€ shared/
β”‚   └── types.ts          # Shared TypeScript types
└── deno.json             # Deno configuration

API Endpoints

  • GET / - Serves the React frontend
  • POST /api/chat - Chat with OpenAI (requires message and optional conversation history)
  • GET /api/health - Health check endpoint
  • GET /frontend/* - Static file serving

Development

Prerequisites

  • Deno runtime
  • Val Town account (for deployment)

Local Development

# Type check deno task check # Format code deno task fmt # Lint code deno task lint # Run tests deno task test # Run all quality checks deno task quality

Deployment to Val Town

# Deploy (runs quality checks first) deno task deploy

Technology Stack

  • Backend: Hono framework
  • Frontend: React with TypeScript
  • Styling: Tailwind CSS (via CDN)
  • AI: OpenAI GPT-3.5-turbo via Val Town's standard library
  • Runtime: Deno
  • Platform: Val Town

Usage

  1. Open the application in your browser
  2. Type a message in the input field
  3. Press Enter or click Send
  4. The AI will respond with helpful information
  5. Continue the conversation - history is maintained during the session

Features to Add

  • Streaming responses for real-time chat feel
  • Conversation persistence across sessions
  • Message editing and deletion
  • Export conversation history
  • Custom system prompts
  • Multiple conversation threads

Contributing

This project follows Val Town development best practices:

  • TypeScript everywhere
  • Testable code with dependency injection
  • SOLID principles
  • Quality checks before deployment

πŸ€– Generated with opencode

HTTP
  • index.ts
    tijs--78…84.web.val.run
Code
backendfrontendsharedREADME.mddeno.jsondeno.lock
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
Open Source Pledge
Terms of usePrivacy policyAbuse contact
Β© 2025 Val Town, Inc.