\n Flux Image Generator\n

\n\n

\n Generate images with{\" \"}\n \n Flux\n {\" \"}\n on{\" \"}\n \n Replicate\n , and host it on{\" \"}\n \n Val town\n .\n

\n\n

\n );\n}\n\nconst root = createRoot(document.getElementById(\"root\"));\nroot.render();",[],[150,168],{"_106":176,"_99":177,"_151":178,"_153":152,"_154":137,"_155":156,"_157":120,"_108":179,"_103":33,"_159":180,"_161":181,"_162":27,"_163":-5,"_164":182,"_102":183},"7e0bc0ec-f9f6-11ef-85ce-569c3dd06744","index.html","45f85f16-e91e-4b8f-9bd9-590a6e403836",["D",1741202254321],"file","\n\n\n\t\n\t\n\tFlux Image Generator\n\t\n\n\n\t

\n \n\t\n\n",[],[150,177],[150],{"_106":186,"_99":187,"_151":188,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":189,"_103":33,"_159":180,"_161":190,"_162":27,"_163":-5,"_164":191,"_102":192},"7e0bc56a-f9f6-11ef-85ce-569c3dd06744","README.md","60001710-21ac-485b-8d97-51410062bc49",["D",1741202254321],"# Getting started with Val Town and Replicate\n\nPorted from https://github.com/replicate/getting-started-cloudflare-workers\n\nThis is a template for a simple web app using [Hono](https://honojs.dev/), and [Replicate](https://replicate.com/) to generate images using [Flux Schnell](https://replicate.com/black-forest-labs/flux-schnell), a fast and high-quality open-source image generation model.\n\n![Screenshot 2025-03-04 at 10.51.39@2x.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/63806b79-4a28-4ca3-7bf5-e5a631986800/public)\n\n## Stack\n\n- [Hono](https://honojs.dev/) is a minimalist web framework for building serverless applications. It's built and maintained by Cloudflare.\n- [Replicate](https://replicate.com/) is a platform for building and running machine learning models.\n- [Flux Schnell](https://replicate.com/black-forest-labs/flux-schnell) is a fast and high-quality open-source image generation model, made by the original creators of Stable Diffusion.",[],[187],{"_106":194,"_99":195,"_151":196,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":197,"_103":33,"_159":180,"_161":198,"_162":27,"_163":-5,"_164":199,"_102":200},"7e0bdc58-f9f6-11ef-85ce-569c3dd06744","foo.txt","b238e38d-869c-4138-a600-5ce18974f489",["D",1741202254321],"hey you found foo!",[],[195],{"_106":202,"_99":203,"_151":118,"_153":-5,"_154":137,"_155":94,"_157":120,"_108":204,"_103":156,"_159":205,"_161":206,"_162":27,"_163":-5,"_164":207,"_102":208},"80a935fa-f9f6-11ef-b1a9-569c3dd06744","index.ts",["D",1741202258751],"http","import { parseProject, serveFile } from \"https://esm.town/v/std/utils@64-main/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport Replicate from \"npm:replicate\";\n\nconst app = new Hono();\n\n// Serve index.html at the root /\napp.get(\"/\", () => serveFile(\"/frontend/index.html\", import.meta.url));\n\n// Serve all /frontend files\napp.get(\"/**/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Generate image\napp.post(\"/generate-image\", async (c) => {\n try {\n const { prompt } = await c.req.json();\n\n const replicate = new Replicate({ auth: Deno.env.get(\"REPLICATE_API_TOKEN\") });\n const model = \"black-forest-labs/flux-schnell\";\n const output = await replicate.run(model, {\n input: {\n prompt,\n image_format: \"webp\",\n },\n }) as { url: string }[] | { url: string };\n\n // Some image models return an array of output files, others just a single file.\n const imageUrl = Array.isArray(output) ? output[0].url() : output.url();\n\n console.log({ imageUrl });\n\n return c.json({ imageUrl });\n } catch (error) {\n console.error(error);\n return c.json({ error: (error as Error).message }, 500);\n }\n});\n\n// Unwrap and rethrow Hono errors as the original error\n// If you delete this, all errors will be \"Internal Server Error\"\napp.onError((err, c) => {\n throw err;\n});\n\n// HTTP vals expect an exported \"fetch handler\"\n// This is how you \"run the server\" in Val Town with Hono\nexport default app.fetch;",[],[203],"files",[148,166,175,185,193,201],"counts",{"_213":33,"_214":156,"_215":33,"_216":156},"pulls","branches","forks","envVars","contents",[219,222,225,228],{"_106":149,"_99":150,"_151":152,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":220,"_103":33,"_159":160,"_161":-5,"_162":27,"_163":-5,"_102":221},["D",1741202254321],[150],{"_106":186,"_99":187,"_151":188,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":223,"_103":33,"_159":180,"_161":190,"_162":27,"_163":-5,"_102":224},["D",1741202254321],[187],{"_106":194,"_99":195,"_151":196,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":226,"_103":33,"_159":180,"_161":198,"_162":27,"_163":-5,"_102":227},["D",1741202254321],[195],{"_106":202,"_99":203,"_151":118,"_153":-5,"_154":137,"_155":94,"_157":120,"_108":229,"_103":156,"_159":205,"_161":206,"_162":27,"_163":-5,"_102":230},["D",1741202258751],[203],"upstream",{"_106":233,"_99":100,"_114":-5,"_115":-5,"_112":113,"_21":234},"4a7f3cbe-f9f5-11ef-8c5d-569c3dd06744",{"_97":235,"_133":236},"zeke","https://images.clerk.dev/oauth_github/img_2RSKLUEfwvvSHS27TthQA3zUV49.jpeg","screenshots","emptyEnvVars","routes/_app.x.$handle.$name.code.$",{"_97":98,"_99":100,"_101":43,"_103":-7,"_102":70,"_104":241,"_146":245,"_209":264,"_180":-7,"_217":265,"_231":274,"_285":27,"_286":-5},{"_106":107,"_99":100,"_108":242,"_110":-5,"_111":27,"_112":113,"_114":-5,"_115":-5,"_12":116,"_117":118,"_119":120,"_121":-5,"_122":33,"_123":124,"_125":124,"_126":127,"_128":127,"_129":127,"_130":124,"_131":27,"_21":243,"_135":244},["D",1741202254321],{"_97":98,"_133":134},{"_103":94,"_99":43,"_106":137,"_138":107,"_139":140,"_141":142,"_143":113,"_144":145},[246,255,258,261],{"_106":149,"_99":150,"_151":152,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":158,"_103":33,"_159":160,"_161":-5,"_162":27,"_163":-5,"_164":247,"_102":254},[248,251],{"_106":167,"_99":168,"_151":169,"_153":152,"_154":137,"_155":156,"_157":120,"_108":170,"_103":33,"_159":171,"_161":172,"_162":27,"_163":-5,"_164":249,"_102":250},[],[150,168],{"_106":176,"_99":177,"_151":178,"_153":152,"_154":137,"_155":156,"_157":120,"_108":179,"_103":33,"_159":180,"_161":181,"_162":27,"_163":-5,"_164":252,"_102":253},[],[150,177],[150],{"_106":186,"_99":187,"_151":188,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":189,"_103":33,"_159":180,"_161":190,"_162":27,"_163":-5,"_164":256,"_102":257},[],[187],{"_106":194,"_99":195,"_151":196,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":197,"_103":33,"_159":180,"_161":198,"_162":27,"_163":-5,"_164":259,"_102":260},[],[195],{"_106":202,"_99":203,"_151":118,"_153":-5,"_154":137,"_155":94,"_157":120,"_108":204,"_103":156,"_159":205,"_161":206,"_162":27,"_163":-5,"_164":262,"_102":263},[],[203],[246,248,251,255,258,261],[266,268,270,272],{"_106":149,"_99":150,"_151":152,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":220,"_103":33,"_159":160,"_161":-5,"_162":27,"_163":-5,"_102":267},[150],{"_106":186,"_99":187,"_151":188,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":223,"_103":33,"_159":180,"_161":190,"_162":27,"_163":-5,"_102":269},[187],{"_106":194,"_99":195,"_151":196,"_153":-5,"_154":137,"_155":156,"_157":120,"_108":226,"_103":33,"_159":180,"_161":198,"_162":27,"_163":-5,"_102":271},[195],{"_106":202,"_99":203,"_151":118,"_153":-5,"_154":137,"_155":94,"_157":120,"_108":229,"_103":156,"_159":205,"_161":206,"_162":27,"_163":-5,"_102":273},[203],{"_106":140,"_108":275,"_276":277,"_99":43,"_138":233,"_103":278,"_139":279,"_141":280,"_281":282,"_131":27,"_112":113,"_283":235,"_284":100},["D",1741201738385],"updatedAt",["D",1741202886189],8,"8792e5ba-f90f-11ef-bd10-569c3dd06744",21,"lockfileKey","1744748030275-esm.town_v_zeke_replicate_starter@8-main","userHandle","projectName","showCompareCallout","pull","routes/_app","actionData","errors"]