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

paulkinlan

veo-feed

Public
Like
veo-feed
Home
Code
5
backend
3
frontend
4
shared
2
README.md
test-db.ts
Branches
1
Pull requests
Remixes
History
Environment variables
4
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
10/2/2025
Viewing readonly version of main branch: v105
View latest version
README.md

TikTok-Style Video Feed Generator

A web application that converts URLs into TikTok-style videos using AI-generated summaries and screenshots.

Features

  • Convert any URL into a video using Veo AI
  • Fetch markdown content and screenshots from URLs
  • Generate AI summaries using Gemini API
  • TikTok-style scrolling feed with scroll-snap
  • Customizable video generation prompts

Project Structure

β”œβ”€β”€ backend/
β”‚   β”œβ”€β”€ index.ts           # Main Hono server
β”‚   β”œβ”€β”€ routes/
β”‚   β”‚   β”œβ”€β”€ videos.ts      # Video generation endpoints
β”‚   β”‚   └── static.ts      # Static file serving
β”‚   └── database/
β”‚       β”œβ”€β”€ migrations.ts  # SQLite schema
β”‚       └── queries.ts     # Database operations
β”œβ”€β”€ frontend/
β”‚   β”œβ”€β”€ index.html         # Main HTML template
β”‚   β”œβ”€β”€ index.tsx          # React app entry point
β”‚   β”œβ”€β”€ components/
β”‚   β”‚   β”œβ”€β”€ App.tsx        # Main app component
β”‚   β”‚   β”œβ”€β”€ VideoFeed.tsx  # TikTok-style feed
β”‚   β”‚   β”œβ”€β”€ VideoCard.tsx  # Individual video component
β”‚   β”‚   └── URLInput.tsx   # URL input form
β”‚   └── style.css          # Custom styles
└── shared/
    β”œβ”€β”€ types.ts           # Shared TypeScript types
    └── utils.ts           # Shared utility functions

API Endpoints

  • POST /api/videos/generate - Generate video from URL
  • GET /api/videos - Get all generated videos
  • GET /api/videos/:id - Get specific video
  • DELETE /api/videos/:id - Delete video

Environment Variables

  • GEMINI_API_KEY - Google Gemini API key for summaries (using @google/genai package)
    • Required for: AI summary generation
    • Used with: gemini-2.0-flash-exp model
    • API: genAI.models.generateContent()
  • VEO_API_KEY - Veo API key for video generation (if required)

Technical Implementation Notes

Database Schema

  • Uses SQLite with table name changes for schema updates
  • Video records include: id, url, title, summary, screenshotUrl, videoUrl, status, prompt, error, createdAt, updatedAt

Video Generation Pipeline

  1. Markdown Extraction: markdownifyurl.val.run service
  2. Screenshot Capture: screenshot.val.run service
  3. AI Summary: Google Gemini via @google/genai package
  4. Video Generation: Veo API (placeholder implementation)
  5. Database Storage: SQLite with status tracking

Error Handling

  • Failed markdown fetch: Check URL accessibility
  • AI generation errors: Verify GEMINI_API_KEY and model availability
  • Database errors: Check table schema and migrations

Usage

  1. Enter URLs in the input form
  2. Videos are generated automatically using:
    • Markdown content from the URL
    • Screenshot of the page
    • AI-generated summary
    • Custom video generation prompt
  3. Scroll through the TikTok-style feed
  4. Customize video prompts in the settings
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.