DevBento logoDevBento
Herramientas/Code Screenshot Generator/Captura de Código para React Hook

Captura de Código para React Hook

Crea una captura de código compartible de un hook de React con resaltado de sintaxis, tema personalizable y marco de ventana. Funciona en tu navegador.

Loading editor...

main.ts
1import { useState, useCallback } from 'react';
2 
3export function useLocalStorage<T>(key: string, initialValue: T) {
4 const [storedValue, setStoredValue] = useState<T>(() => {
5 try {
6 const item = window.localStorage.getItem(key);
7 return item ? JSON.parse(item) : initialValue;
8 } catch (error) {
9 console.error('Error reading localStorage:', error);
10 return initialValue;
11 }
12 });
13 
14 const setValue = useCallback((value: T | ((val: T) => T)) => {
15 try {
16 const valueToStore = value instanceof Function ? value(storedValue) : value;
17 setStoredValue(valueToStore);
18 window.localStorage.setItem(key, JSON.stringify(valueToStore));
19 } catch (error) {
20 console.error('Error setting localStorage:', error);
21 }
22 }, [key, storedValue]);
23 
24 return [storedValue, setValue] as const;
25}
Background
Size
Window
Font size14px
Watermark
Herramientas Relacionadas
{ }Editor de Diagramas Mermaid
Diagram your code flow before screenshotting
{}Formateador y Validador de JSON
Clean up JSON output for screenshot
</>Formateador de SQL / CSS / HTML
Formatea y minifica consultas SQL, hojas de estilo CSS y marcado HTML con resaltado de sintaxis. Embellece o comprime tu código en tu navegador.

Este ejemplo muestra un hook personalizado useLocalStorage renderizado como una captura de código compartible. El hook maneja la lectura y escritura en localStorage con manejo de errores, usando hooks de React para la gestión de estado.

La captura usa el tema Monokai con fuente JetBrains Mono, ventana macOS y números de línea habilitados. Esta combinación produce imágenes limpias y legibles que funcionan bien en feeds oscuros de redes sociales.

🔒

Nothing you paste leaves this tab. Every tool runs entirely in your browser — no upload, no server, no account.

© 2026 devbento.dev · construido localmenteChangelog