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!
8
91. Click `Fork`
102. Change `location` (Line 4) to describe your location. It accepts fairly flexible English descriptions which it turns into locations via [nominatim's geocoder API](https://www.val.town/v/stevekrouse/nominatimSearch).
113. Click `Run`
12
13Change the `query` variable for what you want to get notified for.
14
15You can use [Twitter's search operators](https://developer.twitter.com/en/docs/twitter-api/v1/rules-and-filtering/search-operators) to customize your query, for some collection of keywords, filtering out others, and much more!
16
17## 3. Notification
16 <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
17 <style>
18 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@500;700&display=swap");
19 @import url("https://esm.sh/tldraw@2.1.0/tldraw.css");
20
10assistant > Here are a few fun Val ideas you could build on Val Town:
11
121. **Random Joke Generator:** Fetch a random joke from an API and display it.
132. **Daily Weather Update:** Pull weather data for your location using an API and create a daily summary.
143. **Mini Todo List:** Create a simple to-do list app with add, edit, and delete functionalities.
154. **Chuck Norris Facts:** Display a random Chuck Norris fact sourced from an API.
165. **Motivational Quote of the Day:** Fetch and display a random motivational quote each day.
17
16
17while (!message) {
18 const adviceResponse = await fetch("https://api.adviceslip.com/advice");
19 const adviceJson: AdviceResponse = await adviceResponse.json();
20 const newMessage = adviceJson.slip.advice + "@ x.arruda.dev/v";
13Change the `query` variable for what you want to get notified for.
14
15You can use [Twitter's search operators](https://developer.twitter.com/en/docs/twitter-api/v1/rules-and-filtering/search-operators) to customize your query, for some collection of keywords, filtering out others, and much more!
16
17## 3. Notification
58);
59
60const airtableApiKey = Deno.env.get("AIRTABLE_API_KEY");
61const defaultBaseId = "app1wLB4irV14mxMU";
62const defaultTableName = "ExampleItems";
66
67async function fetchAirtableData(baseId, tableName, nameColumn, contentColumn, embeddingColumn) {
68 const base = new Airtable({ apiKey: airtableApiKey }).base(baseId);
69 const records = await base(tableName).select().all();
70 const documents = records.map(record => ({
12}));
13
14const airtableApiKey = Deno.env.get("AIRTABLE_API_KEY");
15const defaultBaseId = "app1wLB4irV14mxMU";
16const defaultTableName = "ExampleItems";
19
20async function fetchAirtableData(baseId, tableName, contentColumn, embeddingColumn) {
21 const base = new Airtable({ apiKey: airtableApiKey }).base(baseId);
22 const records = await base(tableName).select().all();
23
9[](https://www.val.town/v/stevekrouse/blob_admin_app/fork)
10
11It uses [basic authentication](https://www.val.town/v/pomdtr/basicAuth) with your [Val Town API Token](https://www.val.town/settings/api) as the password (leave the username field blank).
12
13# TODO