Search results for "react client side"

resumeDetails

@siygle

💼 Thomas Seeley's resume in the JSON Resume standard

HTTP (deprecated)

"summary":

applications, always ensuring development is business-oriented and based on client and user needs. I bring a unique blend of

"location": {

"highlights": [

platform with secure authentication and full CRUD capabilities, streamlining client operations",

"Crafted a website for a food truck that captures their unique branding and playful image. The site features a fun,

eloped a responsive, accessibility-focused website for a law firm, improving client accessibility and increasing inquiries by

"name": "Mindpool",

"level": "",

"keywords": ["HTML5", "CSS", "Tailwind CSS", "React", "Next.js", "Vite", "FastAPI", "Hono", "Framer Motion"],

"name": "Programming",

"Integrated GPT-3.5 for prompt enhancement, significantly improving image and video quality",

"Overcame the challenge of running FFmpeg client-side in Next.js, enabling real-time video processing in the browse

"keywords": ["TypeScript", "Next.js", "Tailwind CSS", "Fal.ai", "FFmpeg"],

valTownBadgeExample

@jxnblk

Example of how to add a Val Town badge to your val Demo: https://jxnblk-valtownbadgeexample.web.val.run/ Option 1 Wrap your HTTP response handler with https://www.val.town/v/jxnblk/valTownBadgeMiddleware [^1] import wrapper from "https://esm.town/v/jxnblk/valTownBadgeMiddleware"; async function handler(req: Request): Promise<Response> { const html = ` <h1>Hello, world</h1> `; return new Response(html, { headers: { "Content-Type": "text/html; charset=utf-8", }, }); } export default wrapper(handler, import.meta.url); Option 2 Get the HTML string for the badge using https://www.val.town/v/jxnblk/valTownBadge Add the HTML to your response's HTML string wherever you like import valTownBadge from "https://esm.town/v/jxnblk/valTownBadge"; export default async function(req: Request): Promise<Response> { const badge = valTownBadge(import.meta.url); const html = ` <h1>Hello, world</h1> ${badge} `; return new Response(html, { headers: { "Content-Type": "text/html; charset=utf-8", }, }); } Manual options You can also edit the snippet below to manually add the badge in HTML <a href="https://www.val.town/v/jxnblk/valTownBadgeExample" target="_blank" style="text-decoration:none;color:inherit"> <img src="https://jxnblk-valtownbadgesvg.web.val.run/" width="160" height="160"> </a> Or markdown: [![View source on Val Town](https://jxnblk-valtownbadgesvg.web.val.run/)](https://www.val.town/v/jxnblk/valTownBadgeExample) [^1]: Middleware is not recommended when using client-side hydration in apps like React or when returning a full, valid HTML response

0

HTTP

[![View source on Val Town](https://jxnblk-valtownbadgesvg.web.val.run/)](https://www.val.town/v/jxnblk/valTownBadgeExample)

[^1]: Middleware is not recommended when using client-side hydration in apps like React or when returning a full, valid HTML

/** @jsxImportSource npm:preact */

import valTownBadge from "https://esm.town/v/jxnblk/valTownBadge";

import wrapper from "https://esm.town/v/jxnblk/valTownBadgeMiddleware";

import { render } from "npm:preact-render-to-string";

function handler(req: Request): Promise<Response> {

val_town_by_example_toc

@iamseeley

// edit this if you want to add new items to the home page

0

Cron

todo("Creating a Discord Webhook"),

todo("Scrapping Website Data"),

title: "Client-Side",

items: [

"pomdtr/react_example",

todo("Val Town Islands"),

todo("Creating Web Component"),

val_town_by_example_toc

@pomdtr

// edit this if you want to add new items to the home page

1 2

0

Cron

todo("Creating a Discord Webhook"),

todo("Scrapping Website Data"),

title: "Client-Side",

items: [

"pomdtr/react_example",

todo("Val Town Islands"),

todo("Creating Web Component"),

topHNThreadByHour

@elsif_maj

// set at Thu Nov 30 2023 14:22:53 GMT+0000 (Coordinated Universal Time)

6

0

Email

// set at Thu Nov 30 2023 14:22:53 GMT+0000 (Coordinated Universal Time)

out of Yahoo as a separate company","Top thread on Hackernews for 4:00 is: President Speaking: Spoofing Alerts in 4G LTE Netw

pkmnTypesTiers

@bl3

@jsxImportSource https://esm.sh/react

1

0

HTTP

/** @jsxImportSource https://esm.sh/react **/

import React from "https://esm.sh/react";

import { hydrateRoot } from "https://esm.sh/react-dom/client";

import { renderToString } from "https://esm.sh/react-dom/server";

const X: React.FC<{ size: number }> = ({ size }) => (

const Combobox: React.FC<ComboboxProps> = ({ options, value, onChange, placeholder }) => {

const [isOpen, setIsOpen] = React.useState(false);

const [inputValue, setInputValue] = React.useState("");

const [highlightedIndex, setHighlightedIndex] = React.useState(0);

const [filteredOptions, setFilteredOptions] = React.useState(extendedOptions);

shySapphireLeopard

@stevekrouse

@jsxImportSource https://esm.sh/react

1

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/react */

import { renderToString } from "npm:react-dom/server";

import React from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

function App() {

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") { client(); }

async function server(request: Request): Promise<Response> {

honEmeraldSnail

@stevekrouse

@jsxImportSource https://esm.sh/react

0

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/react */

import React, { useState, useEffect, useRef } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

const MODEL = "claude-3-sonnet-20240229";

}, [htmlOutput]);

const sendMessage = async (e?: React.FormEvent) => {

e?.preventDefault();

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") {

client();

async function server(request: Request): Promise<Response> {

shySapphireLeopard

@muhammad_owais_warsi

@jsxImportSource https://esm.sh/react

1

2

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/react */

import { renderToString } from "npm:react-dom/server";

import React from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

function App() {

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") { client(); }

async function server(request: Request): Promise<Response> {

chatWithCerebras

@stevekrouse

@jsxImportSource https://esm.sh/react

3

1

HTTP

/** @jsxImportSource https://esm.sh/react */

import React, { useState, useEffect, useRef } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

import Cerebras from "https://esm.sh/@cerebras/cerebras_cloud_sdk";

}, [htmlOutput]);

const sendMessage = async (e?: React.FormEvent) => {

e?.preventDefault();

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") {

client();

async function server(request: Request): Promise<Response> {

const { messages, model } = await request.json();

const client = new Cerebras();

try {

const completionCreateResponse = await client.chat.completions.create({

messages,

allvalsindex

@ejfox

@jsxImportSource https://esm.sh/react

1

0

HTTP

/** @jsxImportSource https://esm.sh/react */

import React, { useState, useEffect } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

// Function to get a random emoji

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") { client(); }

async function server(request: Request): Promise<Response> {

throw new Error('valtown token is not set');

const client = new ValTown({ apiKey: token });

const username = 'ejfox';

const user = await client.alias.username.retrieve(username);

if (!user || !user.id) {

let vals = [];

for await (const val of client.users.vals.list(user.id, { limit: 100 })) {

vals.push(val);

printedWhiteToad

@lazyplatypus

@jsxImportSource https://esm.sh/react

0

HTTP

/** @jsxImportSource https://esm.sh/react */

import React, { useState, useEffect, useRef } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

import Cerebras from "https://esm.sh/@cerebras/cerebras_cloud_sdk";

}, [htmlOutput]);

const sendMessage = async (e?: React.FormEvent) => {

e?.preventDefault();

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") {

client();

async function server(request: Request): Promise<Response> {

const { messages, model } = await request.json();

const client = new Cerebras();

try {

const completionCreateResponse = await client.chat.completions.create({

messages,

Chatprincipal

@arthrod

@jsxImportSource https://esm.sh/react

0

HTTP

/** @jsxImportSource https://esm.sh/react */

import React, { useEffect, useRef, useState } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

import styled, { createGlobalStyle, keyframes } from "https://esm.sh/styled-components";

function App() {

const [isNavOpen, setIsNavOpen] = React.useState(false);

const toggleNav = () => {

</Footer>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") { client(); }

export default async function server(request: Request): Promise<Response> {

anthropicCaching

@stevekrouse

* This val creates an interactive webpage that demonstrates the functionality of the Anthropic API. * It uses a React frontend with an input for the API key and buttons to trigger different operations. * The Anthropic API key is stored in the frontend state and sent with each API request.

0

HTTP (deprecated)

* It uses a React frontend with an input for the API key and buttons to trigger different operations.

/** @jsxImportSource https://esm.sh/react */

import React, { useState } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

function client() {

client();

const client = new anthropic.Anthropic({ apiKey });

const response = await client.messages.create({

const client = new anthropic.Anthropic({ apiKey });

const response = await client.beta.promptCaching.messages.create({

chatWithCerebras

@lazyplatypus

@jsxImportSource https://esm.sh/react

0

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/react */

import Cerebras from "https://esm.sh/@cerebras/cerebras_cloud_sdk";

import React, { useEffect, useRef, useState } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

const MODELS = ["llama3.1-8b", "llama3.1-70b"];

}, [htmlOutput]);

const sendMessage = async (e?: React.FormEvent) => {

e?.preventDefault();

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") {

client();

async function server(request: Request): Promise<Response> {

const { messages, model } = await request.json();

const client = new Cerebras();

try {

const completionCreateResponse = await client.chat.completions.create({

messages,