Public
Like
veo-feed
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.
index.ts
https://paulkinlan--5a85bb5e9f7911f0be2e0224a6c84d84.web.val.run
A web application that converts URLs into TikTok-style videos using AI-generated summaries and screenshots.
- 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
- Auto-play videos when scrolled into view
- Audio controls with mute/unmute toggle
- Admin interface for prompt management
- Configurable video generation prompts (no redeploy required)
- Video re-processing with updated prompts
- Version tracking for reprocessed videos
- HackerNews integration - Automated cron job to generate videos for top stories
βββ 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
POST /api/videos/generate- Generate video from URLGET /api/videos- Get all generated videosGET /api/videos/:id- Get specific videoDELETE /api/videos/:id- Delete videoPOST /api/videos/poll- Poll for processing video updates
GET /api/admin/prompt- Get current default video promptPUT /api/admin/prompt- Update default video promptGET /api/admin/videos- Get all videos for admin managementPOST /api/admin/reprocess- Reprocess selected videos with new prompt
GEMINI_API_KEY- Google Gemini API key for summaries (required)ADMIN_PASSWORD- Password for admin interface access (required for admin features)VEO_API_KEY- Veo API key for video generation (optional - currently using placeholder)
- Get a Gemini API key from Google AI Studio
- Add the
GEMINI_API_KEYenvironment variable in Val Town - The Veo integration is currently a placeholder - you'll need to implement the actual Veo API calls
- The application uses external services:
https://markdownify.val.run/for converting web pages to markdownhttps://screenshot.val.run/for taking page screenshots
- Enter URLs in the input form
- Videos are generated automatically using:
- Markdown content from the URL
- Screenshot of the page
- AI-generated summary
- Configurable video generation prompt
- Scroll through the TikTok-style feed to view videos
- Navigate to
/adminin your browser - Enter the admin password (set via
ADMIN_PASSWORDenvironment variable) - Edit the default video generation prompt
- Select videos to reprocess with the updated prompt
- Track video versions and regenerations
- Prompt Editor: Edit the default video generation prompt without redeploying
- Video Selector: Choose specific videos or all videos to reprocess
- Version Tracking: Each reprocessed video creates a new version while preserving the original
- Bulk Operations: Reprocess multiple videos at once with the updated prompt
- NEVER USE:
https://esm.sh/@google/generative-ai@0.1.3 - ALWAYS USE:
https://esm.sh/@google/genai - Correct Import:
import { GoogleGenAI } from "https://esm.sh/@google/genai"; - Correct Initialization:
const genAI = new GoogleGenAI({ apiKey: Deno.env.get("GEMINI_API_KEY") || "", });
- Correct API Call:
const result = await genAI.models.generateContent({ model: "gemini-flash-latest", contents: summaryPrompt, }); const summary = result.text;
- Markdown Service:
https://markdownifyurl.val.run/?url=${encodeURIComponent(url)} - Screenshot Service:
https://screenshot.val.run/?url=${encodeURIComponent(url)}
Create a funky, engaging video overview of this web page content.
Make it visually interesting with dynamic transitions, colorful graphics, and modern design elements.
The video should be vertical (9:16 aspect ratio) like a TikTok video.
Include text overlays highlighting key points from the summary.
Use the screenshot as a reference for the original page design but make it more dynamic and engaging.
Keep it under 30 seconds and make it scroll-friendly for social media.
This project includes an automated cron job that fetches top HackerNews stories and generates videos for them.
- Runs every hour automatically
- Processes top 10 stories (configurable)
- Only processes external URLs (skips Ask HN, Show HN text posts)
- Prevents duplicates - never processes the same URL twice
- Uses your default video generation prompt
- Cost-controlled with configurable limits
For detailed setup instructions, see HACKERNEWS_CRON_SETUP.md
Quick Start:
- Upload
hackernews-cron.tsto Val.Town as a new Val - Set the
BASE_URLenvironment variable to your deployed application URL - Schedule the Val to run every hour (
0 * * * *) - Adjust
TOP_STORIES_LIMITin the code to control how many stories to process
The cron job will automatically:
- Fetch the latest HackerNews top stories
- Filter for new URLs not already in your database
- Trigger video generation for each new URL
- Log detailed processing results
Videos generated by the cron job appear in your feed just like manually submitted URLs.