Val Town Code SearchReturn to Val Town

API Access

You can access search results via JSON API by adding format=json to your query:

https://codesearch.val.run/$%7Burl%7D?q=react&page=807&format=json

For typeahead suggestions, use the /typeahead endpoint:

https://codesearch.val.run/typeahead?q=react

Returns an array of strings in format "username" or "username/projectName"

Found 10055 results for "react"(2701ms)

cerebras_codermain.tsx10 matches

@LionMonkey•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import Cerebras from "https://esm.sh/@cerebras/cerebras_cloud_sdk";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0";
4import { Prism as SyntaxHighlighter } from "https://esm.sh/react-syntax-highlighter?deps=react@18.2.0,react-dom@18.2.0";
5import React, { useEffect, useState } from "https://esm.sh/react@18.2.0";
6import { STARTER_PROMPTS } from "https://esm.town/v/stevekrouse/cerebras_coder_prompts";
7
80}: {
81 prompt: string;
82 setPrompt: React.Dispatch<React.SetStateAction<string>>;
83 handleSubmit: (e: React.FormEvent) => void;
84 handleStarterPromptClick: (promptItem: PromptItem) => void;
85}) {
169
170function App() {
171 const previewRef = React.useRef<HTMLDivElement>(null);
172 const [prompt, setPrompt] = useState("");
173 const [projectId, setProjectId] = useState<number | null>(null);
227 }
228
229 async function handleSubmit(e: React.FormEvent | string) {
230 if (typeof e !== "string") {
231 e.preventDefault();
733 </div>
734 <div className="bg-white w-full h-full flex flex-col grow rounded-xl border-2 border-white overflow-hidden">
735 <React.Fragment key={iframeKey}>
736 <iframe
737 srcDoc={code}
739 className="w-full grow"
740 />
741 </React.Fragment>
742 </div>
743 </div>

oneshotdemopromptedmain.tsx3 matches

@Apache0ne•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
3import React, { useReducer, useState } from "https://esm.sh/react@18.2.0";
4
5// Enhanced Enums

cerebras_codermain.tsx10 matches

@npn•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import Cerebras from "https://esm.sh/@cerebras/cerebras_cloud_sdk";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0";
4import { Prism as SyntaxHighlighter } from "https://esm.sh/react-syntax-highlighter?deps=react@18.2.0,react-dom@18.2.0";
5import React, { useEffect, useState } from "https://esm.sh/react@18.2.0";
6import { STARTER_PROMPTS } from "https://esm.town/v/stevekrouse/cerebras_coder_prompts";
7
80}: {
81 prompt: string;
82 setPrompt: React.Dispatch<React.SetStateAction<string>>;
83 handleSubmit: (e: React.FormEvent) => void;
84 handleStarterPromptClick: (promptItem: PromptItem) => void;
85}) {
169
170function App() {
171 const previewRef = React.useRef<HTMLDivElement>(null);
172 const [prompt, setPrompt] = useState("");
173 const [projectId, setProjectId] = useState<number | null>(null);
227 }
228
229 async function handleSubmit(e: React.FormEvent | string) {
230 if (typeof e !== "string") {
231 e.preventDefault();
733 </div>
734 <div className="bg-white w-full h-full flex flex-col grow rounded-xl border-2 border-white overflow-hidden">
735 <React.Fragment key={iframeKey}>
736 <iframe
737 srcDoc={code}
739 className="w-full grow"
740 />
741 </React.Fragment>
742 </div>
743 </div>

cerebrasTemplatemain.tsx3 matches

@rootvertex•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
3import React, { useState } from "https://esm.sh/react@18.2.0";
4
5function App() {

Code_Debuggermain.tsx3 matches

@sakshamkapoor2911•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import hljs from "https://esm.sh/highlight.js@11.9.0";
3import * as markedLib from "https://esm.sh/marked@9.1.2";
4import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
5import React, { useRef, useState } from "https://esm.sh/react@18.2.0";
6
7// Use the imported library correctly

productiveCyanPigeonmain.tsx7 matches

@gratitude5dee•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect, useRef } from "https://esm.sh/react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4
5const STARTER_PROMPTS = [
9 description: 'A simple starter template for a memecoin project',
10 baseCode: `
11import React, { useState, useEffect } from 'react';
12
13function MemeCoin() {
31export default MemeCoin;
32 `,
33 frameworks: ['React', 'Vanilla JS'],
34 performanceMetrics: {
35 tokensPerSecond: '1,000',
43 description: 'A more complex template with trading mechanics',
44 baseCode: `
45import React, { useState, useEffect } from 'react';
46
47function MemeCoin() {
79export default MemeCoin;
80 `,
81 frameworks: ['React', 'Vanilla JS'],
82 performanceMetrics: {
83 tokensPerSecond: '5,000',

cerebras_codermain.tsx4 matches

@buddydagamer•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect, useMemo } from "https://esm.sh/react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4import { Chart } from "https://esm.sh/chart.js@4.4.0";
5import { Line, Bar } from "https://esm.sh/react-chartjs-2@5.2.0?deps=react@18.2.0,react-dom@18.2.0,chart.js@4.4.0";
6
7// Import and register Chart.js components

fastPlumBonobomain.tsx10 matches

@gratitude5dee•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import Cerebras from "https://esm.sh/@cerebras/cerebras_cloud_sdk";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0";
4import { Prism as SyntaxHighlighter } from "https://esm.sh/react-syntax-highlighter?deps=react@18.2.0,react-dom@18.2.0";
5import React, { useEffect, useState } from "https://esm.sh/react@18.2.0";
6import { STARTER_PROMPTS } from "https://esm.town/v/stevekrouse/cerebras_coder_prompts";
7
80}: {
81 prompt: string;
82 setPrompt: React.Dispatch<React.SetStateAction<string>>;
83 handleSubmit: (e: React.FormEvent) => void;
84 handleStarterPromptClick: (promptItem: PromptItem) => void;
85}) {
169
170function App() {
171 const previewRef = React.useRef<HTMLDivElement>(null);
172 const [prompt, setPrompt] = useState("");
173 const [projectId, setProjectId] = useState<number | null>(null);
227 }
228
229 async function handleSubmit(e: React.FormEvent | string) {
230 if (typeof e !== "string") {
231 e.preventDefault();
733 </div>
734 <div className="bg-white w-full h-full flex flex-col grow rounded-xl border-2 border-white overflow-hidden">
735 <React.Fragment key={iframeKey}>
736 <iframe
737 srcDoc={code}
739 className="w-full grow"
740 />
741 </React.Fragment>
742 </div>
743 </div>

observantBronzeOrcamain.tsx10 matches

@gratitude5dee•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import Cerebras from "https://esm.sh/@cerebras/cerebras_cloud_sdk";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0";
4import { Prism as SyntaxHighlighter } from "https://esm.sh/react-syntax-highlighter?deps=react@18.2.0,react-dom@18.2.0";
5import React, { useEffect, useState } from "https://esm.sh/react@18.2.0";
6import { STARTER_PROMPTS } from "https://esm.town/v/stevekrouse/cerebras_coder_prompts";
7
80}: {
81 prompt: string;
82 setPrompt: React.Dispatch<React.SetStateAction<string>>;
83 handleSubmit: (e: React.FormEvent) => void;
84 handleStarterPromptClick: (promptItem: PromptItem) => void;
85}) {
169
170function App() {
171 const previewRef = React.useRef<HTMLDivElement>(null);
172 const [prompt, setPrompt] = useState("");
173 const [projectId, setProjectId] = useState<number | null>(null);
227 }
228
229 async function handleSubmit(e: React.FormEvent | string) {
230 if (typeof e !== "string") {
231 e.preventDefault();
733 </div>
734 <div className="bg-white w-full h-full flex flex-col grow rounded-xl border-2 border-white overflow-hidden">
735 <React.Fragment key={iframeKey}>
736 <iframe
737 srcDoc={code}
739 className="w-full grow"
740 />
741 </React.Fragment>
742 </div>
743 </div>

cerebras_codermain.tsx10 matches

@smc•Updated 3 months ago
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import Cerebras from "https://esm.sh/@cerebras/cerebras_cloud_sdk";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0";
4import { Prism as SyntaxHighlighter } from "https://esm.sh/react-syntax-highlighter?deps=react@18.2.0,react-dom@18.2.0";
5import React, { useEffect, useState } from "https://esm.sh/react@18.2.0";
6import { STARTER_PROMPTS } from "https://esm.town/v/stevekrouse/cerebras_coder_prompts";
7
80}: {
81 prompt: string;
82 setPrompt: React.Dispatch<React.SetStateAction<string>>;
83 handleSubmit: (e: React.FormEvent) => void;
84 handleStarterPromptClick: (promptItem: PromptItem) => void;
85}) {
169
170function App() {
171 const previewRef = React.useRef<HTMLDivElement>(null);
172 const [prompt, setPrompt] = useState("");
173 const [projectId, setProjectId] = useState<number | null>(null);
227 }
228
229 async function handleSubmit(e: React.FormEvent | string) {
230 if (typeof e !== "string") {
231 e.preventDefault();
733 </div>
734 <div className="bg-white w-full h-full flex flex-col grow rounded-xl border-2 border-white overflow-hidden">
735 <React.Fragment key={iframeKey}>
736 <iframe
737 srcDoc={code}
739 className="w-full grow"
740 />
741 </React.Fragment>
742 </div>
743 </div>

reactHonoStarter4 file matches

@niceandneat•Updated 3 hours ago

reactHonoStarter10 file matches

@Arthur88•Updated 11 hours ago
effector
Write business logic with ease Meet the new standard for modern TypeScript development. Type-safe, reactive, framework-agnostic library to manage your business logic.
officialrajdeepsingh
Follow me if you learn more about JavaScript | TypeScript | React.js | Next.js | Linux | NixOS | Frontend Developer | https://linktr.ee/officialrajdeepsingh