• Blog
  • Docs
  • Pricing
  • We’re hiring!
Log inSign up
Dalida025

Dalida025

untitled-7989

Public
Like
untitled-7989
Home
Code
5
backend
2
frontend
4
shared
2
README.md
main.tsx
Environment variables
Branches
2
Pull requests
Remixes
History
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
/
README.md
Code
/
README.md
Search
6/2/2025
Viewing readonly version of familytree branch: v13
View latest version
README.md

Family Tree Builder

A web application that helps users build and visualize their family trees through step-by-step data collection.

Features

  • Interactive step-by-step questionnaire to gather family information
  • Collects names, relationships, and birth years
  • Organizes data into a structured family tree format
  • Visual family tree display
  • Export functionality for the family data

Project Structure

β”œβ”€β”€ backend/
β”‚   β”œβ”€β”€ index.ts             # Main Hono server
β”‚   └── README.md
β”œβ”€β”€ frontend/
β”‚   β”œβ”€β”€ components/
β”‚   β”‚   β”œβ”€β”€ App.tsx          # Main React application
β”‚   β”‚   β”œβ”€β”€ FamilyForm.tsx   # Step-by-step form component
β”‚   β”‚   └── FamilyTree.tsx   # Visual tree display
β”‚   β”œβ”€β”€ index.html           # Main HTML template
β”‚   β”œβ”€β”€ index.tsx            # Frontend entry point
β”‚   └── style.css            # Custom styles
β”œβ”€β”€ shared/
β”‚   β”œβ”€β”€ types.ts             # Shared TypeScript types
β”‚   └── utils.ts             # Shared utility functions
└── README.md

Usage

  1. Visit the application
  2. Follow the step-by-step questionnaire
  3. Add family members with their relationships
  4. View the generated family tree
  5. Export or save your family data

Technology Stack

  • Backend: Hono (TypeScript)
  • Frontend: React with TypeScript
  • Styling: TailwindCSS
  • Storage: Browser localStorage (can be extended to use Val Town blob storage)
FeaturesVersion controlCode intelligenceCLIMCP
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
Β© 2026 Val Town, Inc.