frontend-integration

Integrate React and Flutter apps with Kailash workflows via HTTP Nexus APIs.

Updated Apr 2, 2026
One-click install
npx skills add https://github.com/ssssssssassssss/disease-risk-classifier --skill frontend-integration-ssssssssassssss
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-integration
Source: https://github.com/ssssssssassssss/disease-risk-classifier/tree/main/.claude/skills/11-frontend-integration
Command: npx skills add https://github.com/ssssssssassssss/disease-risk-classifier --skill frontend-integration-ssssssssassssss

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Integrating frontend applications with backend AI workflows can be time-consuming and error-prone due to API shape mismatches, state management complexity, streaming responses, and type-safety issues. This Skill centralizes practical patterns, client examples, and architecture guidance to help frontend engineers connect React and Flutter apps to Kailash Nexus APIs reliably.

Core Features & Use Cases

  • API Client Patterns: Concrete examples for calling Nexus/Workflow endpoints from React and Flutter, including streaming and error handling.
  • State Management & UX: Recommendations and code patterns for React Query, Zustand, Riverpod, and Bloc to manage server and local state.
  • Type Safety & Tooling: Guidance for generating and using TypeScript and Dart models, plus best practices for error handling, pagination, and optimistic updates.
  • Use Case: Build a chat UI that executes a Kailash workflow, streams incremental responses to the UI, and updates local state with optimistic results while handling reconnections.

Quick Start

Call the Nexus API from your frontend to POST JSON inputs to the workflow endpoint, stream incremental results to update the UI, and use TypeScript or Dart models to parse responses.

Frequently Asked Questions about frontend-integration

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I integrate a React frontend with backend AI workflows?

To integrate a React frontend with backend AI workflows, you POST JSON inputs to Nexus API workflow endpoints and stream incremental results to update the UI. This Skill provides API client setup patterns, React Query state management, and TypeScript type generation for reliable workflow execution.

How do I handle streaming responses in a Flutter app connected to an API?

Handling streaming responses in a Flutter app connected to an API uses WebSocket connections to receive incremental results and Riverpod or Bloc for state management. This Skill provides Dart type generation and architecture guidance for streaming data and handling reconnections.

What is the best way to manage state when calling Nexus APIs from a React app?

Managing state when calling Nexus APIs from a React app is best handled using React Query for server state and Zustand for local state. This Skill recommends patterns for optimistic updates, pagination, and error handling to ensure reliable workflow execution.

Does this approach support TypeScript and Dart type generation for API responses?

Yes, this approach supports TypeScript and Dart type generation for API responses to prevent API shape mismatches. This Skill provides tooling guidance for generating and using models, ensuring type safety when parsing workflow execution results in React and Flutter.

Can I build a chat UI that executes a workflow and streams incremental responses?

Yes, you can build a chat UI that executes a Kailash workflow, streams incremental responses to the UI, and updates local state with optimistic results. This Skill centralizes practical patterns for real-time streaming, WebSocket handling, and reconnection logic.

Why do I need type safety and specific state patterns for frontend API integration?

You need type safety and specific state patterns for frontend API integration to prevent API shape mismatches, state management complexity, and streaming errors. This Skill addresses these issues by providing TypeScript and Dart models alongside React Query and Riverpod architecture guidance.