A self-updating web application with visual editing, authentication, and version control. Build and edit your website directly in the browser - no code required.
Click the remix button in Val.town to create your own copy of this project.
In your Val.town settings, add these environment variables:
ADMIN_EMAIL
- Your email address (required for authentication)APP_NAMESPACE
- Optional namespace for storage (defaults to "default")
The val is already configured as an HTTP trigger. Just save and it's live at your Val.town URL.
Visit your Val.town URL (e.g., https://yourusername-yourval.web.val.run
) - you should see the Hyperclay starter template in read-only mode.
- Go to
/auth/edit
(e.g.,https://yourusername-yourval.web.val.run/auth/edit
) - Enter your admin email address
- Check your email for the magic link
- Click the magic link to authenticate
After authentication, return to your main URL. You should now see:
- Edit controls and buttons
- Contenteditable areas become editable
- Auto-save functionality (Ctrl+S)
- Access to version history at
/versions
Your public URL is now ready to share! Others will see the read-only version while you can edit by authenticating.
Hyperclay is a platform for hosting and editing HTML applications. It provides code editing capabilities, multi-tenant support, and instant deployment - think of it as "Google Docs meets web hosting." Users can edit content directly in the browser without touching code.
- Hosting Platform: Hyperclay hosts your HTML applications with built-in persistence
- Visual Editing: Authorized users can edit content directly in the browser
- Multi-Tenant Support: Build apps that support multiple users/organizations
- Instant Updates: Changes are live immediately - no deployment needed
- Version Control: Automatic versioning and history tracking
This Val.town app provides a single-tenant implementation of Hyperclay so anyone can experience an HTML app with 0 effort:
- Self-hosted: Runs on Val.town's infrastructure, but can be run anywhere
- Single Admin: One admin user per HTML App vs Hyperclay's multi-tenant support
- Custom Auth: Email-based authentication instead of Hyperclay's built-in auth
- Val.town Storage: Uses Val.town's blob storage for persistence
<!-- Text editing --> <div persist edit-mode-input> Click to edit this text </div> <!-- Rich text editing --> <div persist edit-mode-rich> <h2>Format me</h2> <p>Bold, italic, lists, etc.</p> </div> <!-- Image editing --> <img persist edit-mode-image src="photo.jpg" />
Here are some ideas to get you started:
Create your portfolio or personal site. Edit your bio, update projects, change styling - all from your browser.
Build product landing pages that you can update instantly. Change headlines, update pricing, test different CTAs.
Maintain docs that stay current. Fix typos immediately, add new sections on the fly.
Write and publish posts directly on your site. No CMS needed.
Build and iterate on designs in real-time. Perfect for demos and user testing.
Val.town is a cloud platform for running JavaScript/TypeScript code instantly.
- Vals: Units of code that run in the cloud
- HTTP Vals: Web endpoints (like this app)
- Automatic Hosting: Every val gets a public URL
- Built-in Services: Storage, email, cron jobs
- No Build Step: Just save and it's deployed
https://[username]-[valname].web.val.run
Val.town provides built-in blob storage:
- Free: 10MB
- Pro: 1GB
- Can't authenticate: Check
ADMIN_EMAIL
environment variable matches exactly - Magic link not received: Check spam folder, verify email service is working
- Magic link expired: Links expire after 15 minutes, request a new one
- Changes not saving: Verify you're authenticated (check browser cookies for
session
) - Version history empty: Versions are only created after first save
- Edit mode not working: Ensure Hyperclay.js is loading (check browser console)
- Enable debug logging: Set
DEBUG=true
in environment variables - Check browser cookies for
session
andisAdminOfCurrentResource=true
- Verify network requests to
/save/app
are successful - Test authentication flow by visiting
/auth/edit
- Check Val.town logs for server-side errors (especially with DEBUG=true)
- Verify
ADMIN_EMAIL
environment variable is set correctly
Open source - use freely on Val.town.
Need help? Check out DEV_GUIDE.md for development documentation or valtown.md for Val.town platform details.