Val Town Code SearchReturn to Val Town

1/** @jsxImportSource https://esm.sh/preact */
2import { blob } from "https://esm.town/v/std/blob";
3// import * as opaque from "npm:@cloudflare/opaque-ts";
4import { Hono } from "npm:hono@3";
5import { render } from "npm:preact-render-to-string";
6
7const resp = (content, status) =>

1/** @jsxImportSource https://esm.sh/react */
2import ReactDom from "https://esm.sh/react-dom";
3import { createStore } from "https://esm.sh/tinybase";
4import { createRemotePersister } from "https://esm.sh/tinybase/persisters/persister-remote";
5import { useValue } from "https://esm.sh/tinybase/ui-react";
6
7// The store is automatically persisted on the remote server
42}
43
44const root = ReactDom.createRoot(document.body);
45root.render(<App />);

1/** @jsxImportSource https://esm.sh/preact **/
2
3import { clsx } from "https://esm.sh/clsx";
4import { parse } from "https://esm.sh/content-type";
5import { Base64 } from "https://esm.sh/js-base64";
6import { render } from "https://esm.sh/preact";
7import { useEffect, useRef, useState } from "https://esm.sh/preact/hooks";
8
9declare module "https://esm.sh/preact" {
10  namespace JSX {
11    interface IntrinsicElements {

1// JSX can be used in the client val thanks to this magic comment
2/** @jsxImportSource https://esm.sh/react **/
3// Make sure to only import from esm.sh (npm: specifier are not supported in the browser)
4import React from "https://esm.sh/react";
5import ReactDOM from "https://esm.sh/react-dom";
6
7function Counter() {
8  const [counter, setCounter] = React.useState(0);
9
10  return (
22  return (
23    <>
24      <h1>React Example</h1>
25      <Counter />
26    </>
29
30// The app will be rendered inside the root div
31const root = ReactDOM.createRoot(document.getElementById("root"));
32root.render(<App />);

1/** @jsxImportSource https://esm.sh/react */
2import { renderToString } from "npm:react-dom/server";
3
4export const reactExample = () =>
5  new Response(renderToString(<div>Test {1 + 1}</div>), {
6    headers: {

1null
2
3Migrated from folder: examples/reactExample

1/** @jsxImportSource https://esm.sh/preact */
2import { render } from "npm:preact-render-to-string";
3
4export const preactExample = () =>
5  new Response(render(<div>Test {1 + 1}</div>), {
6    headers: {

1null
2
3Migrated from folder: examples/preactExample

38```
39
40See @pomdtr/react_example
41
42### Adding external resources to your example

1/** @jsxImportSource https://esm.sh/react */
2import { renderToString } from "npm:react-dom/server";
3
4export const personalWebsite = (request: Request) => {