More screenshots

    Works with the AI tools you already use

    Claude CodeClaude CodeCursorCursorCodex CLICodex CLIMuseMuseOpenClawOpenClaw+21 more

    Add Realtime Features Automatically

    1

    Automatically add secure real-time features to existing applications.

    $8.99

    Secure checkout via Stripe

    30-day refund guarantee

    Converts to your local currency at checkout

    Security scanned
    Add Realtime Features Automatically

    Add Realtime Features Automatically

    Example session with this skill installed

    Add live notifications to my Next.js SaaS application.

    • Read your context and instructions
    • Compiled the add realtime features
    • Generated the UI component

    Project Detected
    Next.js TypeScript application with session authentication and PostgreSQL

    Real-Time Feature Added

    • Live in-app notification updates
    • notification.created event
    • Authenticated Server-Sent Events stream

    Access Controls

    • The server resolves the user identity from the existing authenticated session
    • Each stream returns only notifications belonging to the authenticated user
    • Client-supplied user identifiers are ignored

    Reliability Controls

    • The client reconnects using bounded exponential backoff
    • Duplicate notification events are ignored using event identifiers
    • Event listeners and connections are closed when the component unmounts

    Files Modified

    • app/api/notifications/stream/route.ts
    • lib/notifications/eventService.ts
    • components/NotificationProvider.tsx
    • components/NotificationBell.tsx
    • tests/notificationStream.test.ts
    • .env.example

    Commands Executed

    • npm run typecheck
    • npm test
    • npm run build

    Validation Result
    Type checking, tests, and the production build completed successfully. Authorized delivery, unauthorized rejection, duplicate handling, and connection cleanup tests passed.

    How to Test
    Start the application, sign in with a local test account, open the notification panel, and create a test notification through the existing local API.

    Scaling Status
    Validated for one application instance. Distributed event delivery was not configured.

    Important Notes
    Use a shared pub/sub system before running multiple application instances. The notification stream does not expose session data or notification records belonging to other users.

    add-realtime-features-automatically.tsx

    TSX · React component

    Generated

    Example file from a real run - the skill writes it into your workspace.

    Connects securely to your tools. The creator never sees your data.

    What you get

    Convert high-frequency polling routes to efficient Server-Sent Events.Implement secure multi-tenant chat with server-side room authorization.Add live progress tracking for long-running server tasks.Sync collaborative UI state across multiple active users.

    About this skill

    Add Realtime Features Automatically is a bounded ToolForge Labs workflow. Automatically add secure real-time features to existing applications. This skill detects your stack, selects WebSockets or Server-Sent Events, creates authenticated connections, adds reconnection and failure handling, and validates the implementation. ✔ Live notifications and dashboards ✔ Chat and presence features ✔ Job progress updates ✔ WebSocket or SSE integration ✔ Tests and safe validation Perfect for SaaS apps, dashboards, collaboration tools, and live services. The skill works from supplied repository files or partial evidence, separates verified facts from assumptions, avoids invented execution claims, and provides concrete next steps plus deterministic validation where possible.

    How to install

    Works the same in every agent - Claude, Cursor, Codex, Copilot and 20+ more.

    ~30 seconds
    1. 1

      Download the ZIP

      Free skills download straight away. Paid skills unlock right after purchase.

    2. 2

      Unzip into your skills folder

      Every agent reads skills from one folder on your machine. Drop the unzipped folder in there.

    3. 3

      Ask your agent to use it

      Restart the agent if it was already running. It picks the skill up automatically - no config needed.

    Skills folder by agent

    Click the path to copy it. Create the folder if it does not exist yet.

    Reviews

    No reviews yet

    Be one of the first to try it. Every listed skill passes our trust checks below.

    Security scanned

    Passed our 8-point scan before listing

    Fresh listing

    Recently published to Agensi

    30-day refund

    Not a fit? Get your money back

    Trust & safety

    Security scanned

    Verified clean 20 days ago

    • Passed all security checks, Safe to install

    Listed20 days ago

    What's inside

    Frequently Asked Questions