f

全球最大的开源提示词库： f/prompts.chat t.co

Building a Self-Hosted Prompt Library UI with TailwindCSS and Radix Dialog Building a Self-Hosted Prompt Library UI with TailwindCSS and Radix Dialog When evaluating f/prompts.chat for internal deployment, the first friction point wasn't the backend—it was the UI layer for browsing, searching, and injecting prompts into existing AI workflows. The repository offers a clean prompt-sharing architecture, but integrating it into a production developer portal requires solving three specific UI problems: 1. Accessible modal overlays for prompt preview without disrupting screen reader navigation 2. Token-aware textarea components that provide visual feedback when prompt length approaches model limits 3. CSS containment strategies to prevent layout thrashing when rendering thousands of prompts with dynamic Markdown content The Broken Pattern: Direct DOM Manipulation for Modals Our initial prototype used a naive approach—toggling display: none on a modal wrapper and manually managing focus with document.querySelector. This broke immediately: // Anti-pattern: breaks screen reader focus trapping const showPrompt = (id: string) => { document.getElementById('modal').style.display = 'block'; document.getElementById('modal-content').focus(); // ❌ Lost context }; Root cause: No focus restoration on close, no aria-modal="true" attribute, and animations triggered layout recalculations on every frame due to animating width/height directly. Production Fix: Radix Dialog with TailwindCSS Transitions Switching to Radix Primitives solved the accessibility contract while keeping TailwindCSS for styling: import * as Dialog from '@radix-ui/react-dialog'; import { useEffect, useRef } from 'react'; interface PromptModalProps { prompt: { id: string; title: string; content: string; tokens?: number }; open: boolean; onClose: () => void; } export function PromptModal({ prompt, open, onClose }: PromptModalProps) { const textareaRef = useRef<HTMLTextAreaElement>(null); useEffect(() => { if (open && textareaRef.current) { textareaRef.current.select(); } }, [open]); return ( <Dialog.Root open={open} onOpenChange={onClose}> <Dialog.Portal> <Dialog.Overlay className="fixed inset-0 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0" /> <Dialog.Content className="fixed left-[50%] top-[50%] z-50 w-full max-w-2xl translate-x-[-50%] translate-y-[-50%] rounded-lg border border-gray-200 bg-white p-6 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]" aria-describedby="prompt-description" > <Dialog.Title className="text-xl font-semibold text-gray-900"> {prompt.title} </Dialog.Title> <Dialog.Description id="prompt-description" className="sr-only"> Prompt content for copying into your AI workflow </Dialog.Description> <TokenAwareTextarea ref={textareaRef} value={prompt.content} maxTokens={prompt.tokens} className="mt-4" /> <div className="mt-4 flex justify-end gap-2"> <button onClick={() => { navigator.clipboard.writeText(prompt.content); }} className="rounded bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2" > Copy to Clipboard </button> <Dialog.Close asChild> <button className="rounded border border-gray-300 px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50"> Close </button> </Dialog.Close> </div> </Dialog.Content> </Dialog.Portal> </Dialog.Root> ); } Token-Aware Textarea with Visual Feedback When integrating with AI gateways (we route through https://b-lost.com/v1 for multi-provider fallback), token limits vary by model. The textarea needs to warn users before they hit the ceiling: import { forwardRef, useMemo } from 'react'; import { encode } from 'gpt-tokenizer'; // or tiktoken interface TokenAwareTextareaProps { value: string; maxTokens?: number; className?: string; } export const TokenAwareTextarea = forwardRef< HTMLTextAreaElement, TokenAwareTextareaProps >(({ value, maxTokens = 4096, className = '' }, ref) => { const tokenCount = useMemo(() => encode(value).length, [value]); const isNearLimit = tokenCount > maxTokens * 0.9; const isOverLimit = tokenCount > maxTokens; return ( <div className={className}> <textarea ref={ref} value={value} readOnly rows={12} className={`w-full rounded border p-3 font-mono text-sm focus:outline-none focus:ring-2 ${ isOverLimit ? 'border-red-500 bg-red-50 focus:ring-red-500' : isNearLimit ? 'border-yellow-500 bg-yellow-50 focus:ring-yellow-500' : 'border-gray-300 focus:ring-blue-500' }`} aria-describedby="token-count" /> <div id="token-count" className={`mt-1 text-right text-xs ${ isOverLimit ? 'text-red-600' : isNearLimit ? 'text-yellow-600' : 'text-gray-500' }`} > {tokenCount} / {maxTokens} tokens {isOverLimit && ' — exceeds model limit'} </div> </div> ); }); TokenAwareTextarea.displayName = 'TokenAwareTextarea'; CSS Containment for Prompt List Performance Rendering 2,000+ prompts with Markdown preview caused 300ms layout recalculations. Adding contain: layout style to each card container dropped it to 45ms: /* Tailwind arbitrary property */ .prompt-card { @apply rounded-lg border border-gray-200 p-4; contain: layout style; } For dynamic height cards with auto-rows-auto grid, use content-visibility: auto instead: <div className="grid auto-rows-auto gap-4 md:grid-cols-2 lg:grid-cols-3"> {prompts.map((p) => ( <article key={p.id} className="prompt-card [content-visibility:auto]" style={{ contentVisibilityAutoStateCallback: true } as any} > {/* Card content */} </article> ))} </div> The Remaining Question: State Synchronization f/prompts.chat's architecture assumes prompts are relatively static. But when integrating with live AI sessions, you need bidirectional sync—users might annotate prompts with execution results or pin favorites. Do you: 1. Fork the prompt object into session-local state and accept drift? 2. Extend the backend schema with user-specific metadata (breaking self-hosted simplicity)? 3. Store deltas in localStorage and accept that shared devices lose context? Each choice trades off data consistency, deployment complexity, and user experience. What's your approach when the upstream data model doesn't match your runtime needs?

30 projetos GRÁTIS do GitHub para trabalhar melhor com IA Descubra 30 projetos gratuitos do GitHub para usar IA, criar conteúdo e organizar seu trabalho. Veja ferramentas de vídeo, produtividade, segurança, marketing e servidores, com os links organizados por assunto abaixo. Conheça o Bora Criar com IA: boracriarcomia.com.br CAPÍTULOS 00:00 Apresentação e inteligência artificial 00:35 Segurança 00:47 Vídeo e conteúdo 01:10 Negócios e marketing 01:30 Produtividade 01:46 Servidores e infraestrutura 02:23 Projetos para explorar 02:38 Antes de instalar INTELIGÊNCIA ARTIFICIAL 1. Dify — langgenius/dify 2. Taskosaur — Taskosaur/Taskosaur 3. OpenWork — different-ai/openwork 4. Agent Browser — vercel-labs/agent-browser 5. Emdash — generalaction/emdash SEGURANÇA 6. PasteGuard — sgasser/pasteguard 7. Claude Code Safety Net — kenryu42/claude-code-safety-net VÍDEO E CONTEÚDO 8. OpenReel — Augani/openreel-video 9. BridgeClip — bridge-mind/bridgeclip 10. Recordly — webadderall/Recordly 11. Textream — f/textream 12. FFmpeg Skill — kajisho5/ffmpeg-skill 13. Presenton — presenton/presenton NEGÓCIOS E MARKETING 14. Deskcomm CRM — melgarafael/DeskcommCRM 15. Open SEO — every-app/open-seo 16. Cogsend — deepakness/cogsend PRODUTIVIDADE 17. Handy — cjpais/Handy 18. Kept — ericerkz/kept 19. Excalidraw MCP — excalidraw/excalidraw-mcp 20. ezBookkeeping — mayswind/ezbookkeeping SERVIDORES E INFRAESTRUTURA 21. Dockge — louislam/dockge 22. OpenObserve — openobserve/openobserve 23. LogDeck — AmoabaKelvin/logdeck 24. WebSSH — bifrost0x/webssh 25. Breakscale — xevrion/breakscale 26. SQLit — Maxteabag/sqlit 27. Mailflare — hieunc229/mailflare 28. Open Archiver — LogicLabs-OU/OpenArchiver PROJETOS PARA EXPLORAR 29. Vibecraft — Nearcyan/vibecraft 30. God's Eye View — bilawalsidhu/gods-eye-view Confira licença, requisitos, custos de hospedagem e manutenção de cada projeto antes de instalar. “Gratuito” pode depender de serviços externos. Referência de pauta: Hallen Tech — youtube.com Qual ferramenta você vai testar primeiro? Deixe nos comentários e inscreva-se para conhecer mais recursos de IA. #InteligenciaArtificial #GitHub #OpenSource

Nearly 2,500 FREE AI Prompts, Plugged Into Claude Code Found on GitHub: prompts.chat (f/prompts.chat), a free, open-source library of AI prompts with 172K stars. The site lists 2,494 prompts plus 86 agent skills and 17 workflows across coding, writing, business, images, video and more. Its MCP server plugs the whole library into Claude Code: in our real run, Claude searched the library and pulled the best prompt for a code review. In this Reel: • The repo (172K stars) and the site • 2,494 prompts, 86 skills, 17 workflows (counts on the site, 8 Oct 2026) • Connecting it to Claude Code with the MCP server • A real Claude Code run finding the best prompt for a task Full test with every number: "Claude Code for Free: I Tested 3 Setups on a Real Project" (tap the related video above). Links GitHub: f/prompts.chat Site: prompts.chat About this Reel • Counts as shown on prompts.chat and GitHub on 8 October 2026; they change as the community adds prompts. • The Claude Code run is real: Claude Code 2.1.292 with only the public prompts.chat MCP server (prompts.chat) allowed. • Prompts are public domain (CC0); the code is MIT-licensed. Narration is an AI voice. Not affiliated with prompts.chat or Anthropic. #Shorts #ClaudeCode #AITools

CVE-2026-28412: Resource exhaustion through unlimited connections (DoS) > Textream's WebSocket server imposed no limit on concurrent connections. Flooding it exhausted CPU and memory and could freeze the app during a live session. Summary In Textream for macOS prior to 1.5.1, the DirectorServer WebSocket server imposed no limit on concurrent connections. Impact Combined with a broadcast timer sending state to all clients every 100 ms, an attacker could exhaust CPU and memory by flooding the server, freezing and crashing the application during a live session. Fix Update to 1.5.1 or later. If you run your own server, cap concurrent connections and limit connections per source. References: - NVD: nvd.nist.gov - GitHub Security Advisory: github.com/f/textream/security/advisories/GHSA-qr… - Fix commit: github.com/f/textream/commit/3524fa96f98ba17025b4… - CVE record (MITRE): cve.org - CVE record (Feedly): feedly.com --- Originally published at iamcanturk.dev.

CVE-2026-28403: Missing WebSocket origin validation (Cross-Site WebSocket Hijacking) > Textream's local WebSocket server did not validate the Origin header. A malicious web page visited by the user could silently connect to it and send commands. Summary In Textream for macOS prior to 1.5.1, the DirectorServer WebSocket server accepted connections from any origin without validating the HTTP Origin header during the handshake. Impact A malicious web page visited in the same browser session could silently connect to the local WebSocket server and send arbitrary commands. Fix Update to 1.5.1 or later. If you write your own WebSocket server, compare the Origin header against an allowlist during the handshake and reject anything that doesn't match. References: - NVD: nvd.nist.gov - GitHub Security Advisory: github.com/f/textream/security/advisories/GHSA-wr… - Fix commit: github.com/f/textream/commit/f5ebad82750b9313386c… - CVE record (MITRE): cve.org - CVE record (Feedly): feedly.com --- Originally published at iamcanturk.dev.

f/prompts.chat ‼️IMPORTANTE ‼️ He montado una app de gestión de patrimonio en tiempo real para: → Cuenta Personal → Autónomos → Empresas PRUÉBALA AHORA: fider.app Si te ha gustado el contenido: 1. Sígueme en 👉 @NicoGarcia_IA 2. Mándaselo a tu amig@ 3. Dale like y RT al primer post del hilo ❤️

Found a really useful GitHub repo for developers. prompts.chat has a collection of prompts for ChatGPT, Claude, Gemini, and other AI models Could be handy when you're stuck or looking for a starting point Save this and thank me later 😅 f/prompts.chat

prompts.chat: The Hottest HTML Repo on GitHub Right Now In this video, we break down f/prompts.chat - one of the hottest open-source projects on GitHub right now. f.k.a. Awesome ChatGPT Prompts. Share, discover, and collect prompts from the community. Free and open source — self-host for your organization with complete privacy. It has already earned 173,526 stars on GitHub and is written primarily in HTML. We look at what it does, why developers are paying attention to it right now, and who should try it. 📂 Repo: f/prompts.chat 🌐 Stars: 173,526 | Language: HTML | Forks: 22,197 🔔 Subscribe for daily picks of the hottest GitHub repos: / @reporadar #github #opensource #programming keywords: coding, developer tools, github, opensource, programming, software, tech

Prompts.chat: f.k.a; Playnite; Plane: Open-source Jira | GitHub Curated Picks | 2026-10-20 Chapters: 00:00 2026-10-20 | GitHub Curated Picks 00:05 Pick #1 Prompts.chat 00:32 Pick #2 Playnite 00:48 Pick #3 Plane GitHub Curated Picks reviews 3 source-verified repositories selected for developer usefulness, not popularity position. Each pick is checked against its GitHub repository, README, release evidence, and recent commit; pick numbers are editorial order. The compact card keeps rank, signal, why it matters, and next check together while the ledger preserves direct URLs and release evidence. Treat the list as an educational review surface, not software endorsement, and verify license and maintenance before adoption. Published: 2026-10-20 Review window: daily Curated repository picks: - Pick #1 Prompts.chat | Latest commit | Fix homepage stargazer CTA link pointing to 404 /stargazers page | f/prompts.chat - Pick #2 Playnite | Latest commit | Don't override online installer config in Appveyor build | JosefNemec/Playnite - Pick #3 Plane | Latest commit | Recent commit verified | makeplane/plane Chapters: 00:00 2026-10-20 | GitHub Curated Picks 00:05 Pick #1 Prompts.chat 00:32 Pick #2 Playnite 00:48 Pick #3 Plane 01:10 Watch Next 01:18 Educational Use Only Top comment prompt: Which repository would you verify first, and what release or commit evidence matters most? Source ledger: Direct source URLs: - github.com/trending - api.github.com - github.com/f/prompts.chat/blob/main/README.md - github.com/f/prompts.chat/releases - github.com/f/prompts.chat/commit/e78128539a745e43… - f/prompts.chat - api.github.com - JosefNemec/Playnite - github.com/JosefNemec/Playnite/releases/tag/10.63 - github.com/JosefNemec/Playnite/commit/3e8abb24187… - api.github.com - github.com/makeplane/plane/blob/preview/README.md - github.com/makeplane/plane/releases/tag/v1.4.2 - github.com/makeplane/plane/commit/6c16585c81bac84… - makeplane/plane Informational and educational purposes only. Not investment advice, product endorsement, or professional guidance. Subscriber reason: Subscribe for the daily AI, GitHub, and market board. Tomorrow watchlist: Tomorrow, check the next tagged release, recent commit, and issue-health signals for the selected projects.