/** @jsxImportSource https://esm.sh/react@18.2.0 */ import React, { useState } from "https://esm.sh/react@18.2.0"; import { createRoot } from "https://esm.sh/react-dom@18.2.0/client"; function generateShortCode(length = 6) { const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; return Array.from(crypto.getRandomValues(new Uint8Array(length))) .map((x) => chars[x % chars.length]) .join(''); } function App() { const [longUrl, setLongUrl] = useState(''); const [shortUrl, setShortUrl] = useState(''); const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); const response = await fetch('/', { method: 'POST', body: JSON.stringify({ longUrl }), headers: { 'Content-Type': 'application/json' } }); const result = await response.text(); setShortUrl(result); }; return (

🔗 Link Shortener

{shortUrl && (

Short Link: {shortUrl}

)}

); } function client() { createRoot(document.getElementById("root")).render(); } if (typeof document !== "undefined") { client(); } export default async function server(request: Request): Promise { const { sqlite } = await import("https://esm.town/v/stevekrouse/sqlite"); const KEY = new URL(import.meta.url).pathname.split("/").at(-1); const SCHEMA_VERSION = 1; // Create table if not exists await sqlite.execute(` CREATE TABLE IF NOT EXISTS ${KEY}_links_${SCHEMA_VERSION} ( id INTEGER PRIMARY KEY AUTOINCREMENT, short_code TEXT UNIQUE NOT NULL, long_url TEXT NOT NULL, created_at DATETIME DEFAULT CURRENT_TIMESTAMP ) `); // Handle redirects const url = new URL(request.url); if (url.pathname.length > 1 && url.pathname !== '/') { const shortCode = url.pathname.slice(1); const result = await sqlite.execute( `SELECT long_url FROM ${KEY}_links_${SCHEMA_VERSION} WHERE short_code = ?`, [shortCode] ); if (result.rows.length > 0) { return new Response(null, { status: 302, headers: { Location: result.rows[0].long_url } }); } } // Handle URL shortening if (request.method === 'POST') { const { longUrl } = await request.json(); const shortCode = generateShortCode(); const baseUrl = 'https://ck.new'; await sqlite.execute( `INSERT INTO ${KEY}_links_${SCHEMA_VERSION} (short_code, long_url) VALUES (?, ?)`, [shortCode, longUrl] ); return new Response(`${baseUrl}/${shortCode}`); } // Serve HTML return new Response(` Link Shortener

View Source `, { headers: { 'Content-Type': 'text/html' } }); } const css = ` body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; background-color: #f4f4f4; } `;

shortener