Val Town Code SearchReturn to Val Town

1# lit
2
3[Lit](https://lit.dev/docs/ssr/server-usage/) is kind of like Google's answer to React: it's a little more reliant on browser APIs like custom elements and the shadow DOM, a little less 'magic', like using JSX.
4
5This is an example of using Lit and rendering it straight to a string, which is something that's recently popular. It works pretty well, right off the bat: Lit provides nice ESM modules and a pretty smooth workflow!

2
3TL;DR: you can see a Figma board in a website
4![An image of a screenshot of Figma the visual design software and a browser, showing how something drawn in Figma can be rendered individually in the browser](https://air-prod.imgix.net/fb0a5caa-72b5-4002-ad23-1e2628f48362.jpg?w=2000&h=4664&auto=compress&ixlib=react-9.5.4 "Figma frame to HTML")
5
6Migrated from folder: Figma/FigmaFrameToHTML

11```
12
13Contrast with [@stevekrouse.sparklineEx](/v/@stevekrouse.sparklineEx) which uses react-sparklines.
14
15Migrated from folder: utils/sparklines/sparklineEx2

1# Server-Rendered React Sparkline Example
2
3Vaguely inspired by [Easy SVG sparklines](https://alexplescan.com/posts/2023/07/08/easy-svg-sparklines/), but totally different because that had zero dependencies and this has all the dependencies: react, htm, react-sparklines.
4
5This is the live-generated SVG that this very val generates:

1Migrated from folder: imports/react

1# @easrng.preactWebApp example
2[![Open](https://easrng-button.express.val.run/Open)](https://easrng-examplepreactwebapp.express.val.run/)

1# @easrng.preactWebApp
2[![Example](https://easrng-button.express.val.run/Example)](https://www.val.town/v/easrng.examplePreactWebApp/)
3Make a web app on val.town with server-side rendered Preact components

1Migrated from folder: react_demo/REACT_TODO_LIST_CONTENTS

1Migrated from folder: react_cdn/REACT_CDN_VAL

1Migrated from folder: react_cdn/REACT_DOM_CDN_VAL