13 {
14 headers: {
15 "Content-Type": "image/svg+xml",
16 },
17 },
40- Item 3
41
42### Images
43
44Images can be included using markdown syntax.
45
46## Conclusion
6---
7
8
9
10We migrated our blog to Val Town 🥳
79## A fast migration
80
81How did we migrate 65 blog posts – with images, videos, and intricate formatting and styles – to an entirely new blog in a single day?
82
83We didn't. We left them where they are, and proxy to them.
3This is a lightweight Blob Admin interface to view and debug your Blob data.
4
5
6
7To use this, fork it to your account.
60 const { ValTown } = await import("npm:@valtown/sdk");
61 const vt = new ValTown();
62 const { email: authorEmail, profileImageUrl, username } = await vt.me.profile.retrieve();
63 // const authorEmail = me.email;
64
128
129 c.set("email", email);
130 c.set("profile", { profileImageUrl, username });
131 await next();
132};
437 {profile && (
438 <div className="flex items-center space-x-4">
439 <img src={profile.profileImageUrl} alt="Profile" className="w-8 h-8 rounded-full" />
440 <span>{profile.username}</span>
441 <a href="/auth/logout" className="text-blue-400 hover:text-blue-300">Logout</a>
580 alt="Blob content"
581 className="max-w-full h-auto"
582 onError={() => console.error("Error loading image")}
583 />
584 </div>
630 <li>Create public shareable links for blobs</li>
631 <li>View and manage public folder</li>
632 <li>Preview images directly in the interface</li>
633 </ul>
634 </div>
5 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6 <title>Glancer!</title>
7 <link rel="icon" href="/frontend/favicon.svg" type="image/svg+xml" />
8 <script src="https://cdn.tailwindcss.com"></script>
9 <link
178
179- **Redirects:** Use `return new Response(null, { status: 302, headers: { Location: "/place/to/redirect" }})` instead of `Response.redirect` which is broken
180- **Images:** Avoid external images or base64 images. Use emojis, unicode symbols, or icon fonts/libraries instead
181- **AI Image:** To inline generate an AI image use: `<img src="https://maxm-imggenurl.web.val.run/the-description-of-your-image" />`
182- **Storage:** DO NOT use the Deno KV module for storage
183- **Browser APIs:** DO NOT use the `alert()`, `prompt()`, or `confirm()` methods
4import { Header } from "./components.tsx";
5import hemolog from "./frames/hemolog.tsx";
6import generateImageFromHtml from "./generateImageFromHtml.ts";
7
8export default async function(req: Request) {
9 const url = new URL(req.url);
10 const isImageRequest = url.searchParams.get("generate") === "image";
11 const isListRequest = url.searchParams.get("generate") === "list";
12 const frameId = url.searchParams.get("frame");
69 }
70
71 // get ?&generate=image&frame=S0mth1ingKrAzy
72 if (frameId && !frame_list.includes(frameId)) {
73 const html = renderToString(
85 const generateUrl = frames[frameId as keyof typeof frames];
86
87 // get ?&generate=image&frame=weather
88 if (isImageRequest) {
89 const width = 800;
90 const height = 480;
91
92 const imageResponse = await generateImageFromHtml(generateUrl, width, height);
93 return new Response(imageResponse.body, {
94 status: imageResponse.status,
95 headers: {
96 "Content-Type": "image/png",
97 },
98 });
299 >
300 <img
301 src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSIGEJA8-xL8Aa9oC7Y7gFqBoICxvhebGig6ADUJYSFVEzWRD0Y5GmuhnjW6B6e11C07iE&usqp=CAU"
302 alt="EEP Portal Logo"
303 style={{
1908 <meta charset="UTF-8">
1909 <style>${css}</style>
1910 <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📰</text></svg>">
1911 </head>
1912 <body>