[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M71T4E13FWRCVFS53YY6Z726":3,"skill-same:01M71T4E13FWRCVFS53YY6Z726":73},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":27,"publishedAt":48,"linkOnly":49,"markdownContent":50,"markdownBody":51,"frontMatter":52,"refName":53,"commitSha":54,"skillDirectory":55,"forksCount":13,"repositoryHtmlUrl":56,"repositoryHomepageUrl":6,"ownerHtmlUrl":57,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":58,"install":59,"resources":72},"01M71T4E13FWRCVFS53YY6Z726","react-ui-patterns",null,"Modern React UI patterns for loading states, error handling, and data fetching. Use when building UI components, handling async data, or managing UI states.","javiertarazon\u002Fide-agente-free-jt7-","javiertarazon","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F153141207?v=4","01M71R52TB3S9HXKH6WSNT8A7V","01M71R52VG5KS2DKDDH4GDQ30A",0,"MIT","https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-\u002Fblob\u002Frelease\u002Fv4.2.11-panel-pro\u002F.github\u002Fskills\u002Freact-ui-patterns\u002FSKILL.md",[17,22],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000009","前端开发","SCENARIO","使用场景",{"categoryNo":23,"categoryName":24,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47],"ui patterns","ui","patterns","react ui","react ui patterns","react","async","ui components","for","loading states","data","data fetching","components","unknown","when","modern","loading","states","community","error","2026-11-10 13:02:02",false,"---\nname: react-ui-patterns\ndescription: \"Modern React UI patterns for loading states, error handling, and data fetching. Use when building UI components, handling async data, or managing UI states.\"\nrisk: unknown\nsource: community\n---\n\n# React UI Patterns\n\n## Core Principles\n\n1. **Never show stale UI** - Loading spinners only when actually loading\n2. **Always surface errors** - Users must know when something fails\n3. **Optimistic updates** - Make the UI feel instant\n4. **Progressive disclosure** - Show content as it becomes available\n5. **Graceful degradation** - Partial data is better than no data\n\n## Loading State Patterns\n\n### The Golden Rule\n\n**Show loading indicator ONLY when there's no data to display.**\n\n```typescript\n\u002F\u002F CORRECT - Only show loading when no data exists\nconst { data, loading, error } = useGetItemsQuery();\n\nif (error) return \u003CErrorState error={error} onRetry={refetch} \u002F>;\nif (loading && !data) return \u003CLoadingState \u002F>;\nif (!data?.items.length) return \u003CEmptyState \u002F>;\n\nreturn \u003CItemList items={data.items} \u002F>;\n```\n\n```typescript\n\u002F\u002F WRONG - Shows spinner even when we have cached data\nif (loading) return \u003CLoadingState \u002F>; \u002F\u002F Flashes on refetch!\n```\n\n### Loading State Decision Tree\n\n```\nIs there an error?\n  → Yes: Show error state with retry option\n  → No: Continue\n\nIs it loading AND we have no data?\n  → Yes: Show loading indicator (spinner\u002Fskeleton)\n  → No: Continue\n\nDo we have data?\n  → Yes, with items: Show the data\n  → Yes, but empty: Show empty state\n  → No: Show loading (fallback)\n```\n\n### Skeleton vs Spinner\n\n| Use Skeleton When | Use Spinner When |\n|-------------------|------------------|\n| Known content shape | Unknown content shape |\n| List\u002Fcard layouts | Modal actions |\n| Initial page load | Button submissions |\n| Content placeholders | Inline operations |\n\n## Error Handling Patterns\n\n### The Error Handling Hierarchy\n\n```\n1. Inline error (field-level) → Form validation errors\n2. Toast notification → Recoverable errors, user can retry\n3. Error banner → Page-level errors, data still partially usable\n4. Full error screen → Unrecoverable, needs user action\n```\n\n### Always Show Errors\n\n**CRITICAL: Never swallow errors silently.**\n\n```typescript\n\u002F\u002F CORRECT - Error always surfaced to user\nconst [createItem, { loading }] = useCreateItemMutation({\n  onCompleted: () => {\n    toast.success({ title: 'Item created' });\n  },\n  onError: (error) => {\n    console.error('createItem failed:', error);\n    toast.error({ title: 'Failed to create item' });\n  },\n});\n\n\u002F\u002F WRONG - Error silently caught, user has no idea\nconst [createItem] = useCreateItemMutation({\n  onError: (error) => {\n    console.error(error); \u002F\u002F User sees nothing!\n  },\n});\n```\n\n### Error State Component Pattern\n\n```typescript\ninterface ErrorStateProps {\n  error: Error;\n  onRetry?: () => void;\n  title?: string;\n}\n\nconst ErrorState = ({ error, onRetry, title }: ErrorStateProps) => (\n  \u003Cdiv className=\"error-state\">\n    \u003CIcon name=\"exclamation-circle\" \u002F>\n    \u003Ch3>{title ?? 'Something went wrong'}\u003C\u002Fh3>\n    \u003Cp>{error.message}\u003C\u002Fp>\n    {onRetry && (\n      \u003CButton onClick={onRetry}>Try Again\u003C\u002FButton>\n    )}\n  \u003C\u002Fdiv>\n);\n```\n\n## Button State Patterns\n\n### Button Loading State\n\n```tsx\n\u003CButton\n  onClick={handleSubmit}\n  isLoading={isSubmitting}\n  disabled={!isValid || isSubmitting}\n>\n  Submit\n\u003C\u002FButton>\n```\n\n### Disable During Operations\n\n**CRITICAL: Always disable triggers during async operations.**\n\n```tsx\n\u002F\u002F CORRECT - Button disabled while loading\n\u003CButton\n  disabled={isSubmitting}\n  isLoading={isSubmitting}\n  onClick={handleSubmit}\n>\n  Submit\n\u003C\u002FButton>\n\n\u002F\u002F WRONG - User can tap multiple times\n\u003CButton onClick={handleSubmit}>\n  {isSubmitting ? 'Submitting...' : 'Submit'}\n\u003C\u002FButton>\n```\n\n## Empty States\n\n### Empty State Requirements\n\nEvery list\u002Fcollection MUST have an empty state:\n\n```tsx\n\u002F\u002F WRONG - No empty state\nreturn \u003CFlatList data={items} \u002F>;\n\n\u002F\u002F CORRECT - Explicit empty state\nreturn (\n  \u003CFlatList\n    data={items}\n    ListEmptyComponent={\u003CEmptyState \u002F>}\n  \u002F>\n);\n```\n\n### Contextual Empty States\n\n```tsx\n\u002F\u002F Search with no results\n\u003CEmptyState\n  icon=\"search\"\n  title=\"No results found\"\n  description=\"Try different search terms\"\n\u002F>\n\n\u002F\u002F List with no items yet\n\u003CEmptyState\n  icon=\"plus-circle\"\n  title=\"No items yet\"\n  description=\"Create your first item\"\n  action={{ label: 'Create Item', onClick: handleCreate }}\n\u002F>\n```\n\n## Form Submission Pattern\n\n```tsx\nconst MyForm = () => {\n  const [submit, { loading }] = useSubmitMutation({\n    onCompleted: handleSuccess,\n    onError: handleError,\n  });\n\n  const handleSubmit = async () => {\n    if (!isValid) {\n      toast.error({ title: 'Please fix errors' });\n      return;\n    }\n    await submit({ variables: { input: values } });\n  };\n\n  return (\n    \u003Cform>\n      \u003CInput\n        value={values.name}\n        onChange={handleChange('name')}\n        error={touched.name ? errors.name : undefined}\n      \u002F>\n      \u003CButton\n        type=\"submit\"\n        onClick={handleSubmit}\n        disabled={!isValid || loading}\n        isLoading={loading}\n      >\n        Submit\n      \u003C\u002FButton>\n    \u003C\u002Fform>\n  );\n};\n```\n\n## Anti-Patterns\n\n### Loading States\n\n```typescript\n\u002F\u002F WRONG - Spinner when data exists (causes flash)\nif (loading) return \u003CSpinner \u002F>;\n\n\u002F\u002F CORRECT - Only show loading without data\nif (loading && !data) return \u003CSpinner \u002F>;\n```\n\n### Error Handling\n\n```typescript\n\u002F\u002F WRONG - Error swallowed\ntry {\n  await mutation();\n} catch (e) {\n  console.log(e); \u002F\u002F User has no idea!\n}\n\n\u002F\u002F CORRECT - Error surfaced\nonError: (error) => {\n  console.error('operation failed:', error);\n  toast.error({ title: 'Operation failed' });\n}\n```\n\n### Button States\n\n```typescript\n\u002F\u002F WRONG - Button not disabled during submission\n\u003CButton onClick={submit}>Submit\u003C\u002FButton>\n\n\u002F\u002F CORRECT - Disabled and shows loading\n\u003CButton onClick={submit} disabled={loading} isLoading={loading}>\n  Submit\n\u003C\u002FButton>\n```\n\n## Checklist\n\nBefore completing any UI component:\n\n**UI States:**\n- [ ] Error state handled and shown to user\n- [ ] Loading state shown only when no data exists\n- [ ] Empty state provided for collections\n- [ ] Buttons disabled during async operations\n- [ ] Buttons show loading indicator when appropriate\n\n**Data & Mutations:**\n- [ ] Mutations have onError handler\n- [ ] All user actions have feedback (toast\u002Fvisual)\n\n## Integration with Other Skills\n\n- **graphql-schema**: Use mutation patterns with proper error handling\n- **testing-patterns**: Test all UI states (loading, error, empty, success)\n- **formik-patterns**: Apply form submission patterns\n\n## When to Use\nThis skill is applicable to execute the workflow or actions described in the overview.\n","# React UI Patterns\n\n## Core Principles\n\n1. **Never show stale UI** - Loading spinners only when actually loading\n2. **Always surface errors** - Users must know when something fails\n3. **Optimistic updates** - Make the UI feel instant\n4. **Progressive disclosure** - Show content as it becomes available\n5. **Graceful degradation** - Partial data is better than no data\n\n## Loading State Patterns\n\n### The Golden Rule\n\n**Show loading indicator ONLY when there's no data to display.**\n\n```typescript\n\u002F\u002F CORRECT - Only show loading when no data exists\nconst { data, loading, error } = useGetItemsQuery();\n\nif (error) return \u003CErrorState error={error} onRetry={refetch} \u002F>;\nif (loading && !data) return \u003CLoadingState \u002F>;\nif (!data?.items.length) return \u003CEmptyState \u002F>;\n\nreturn \u003CItemList items={data.items} \u002F>;\n```\n\n```typescript\n\u002F\u002F WRONG - Shows spinner even when we have cached data\nif (loading) return \u003CLoadingState \u002F>; \u002F\u002F Flashes on refetch!\n```\n\n### Loading State Decision Tree\n\n```\nIs there an error?\n  → Yes: Show error state with retry option\n  → No: Continue\n\nIs it loading AND we have no data?\n  → Yes: Show loading indicator (spinner\u002Fskeleton)\n  → No: Continue\n\nDo we have data?\n  → Yes, with items: Show the data\n  → Yes, but empty: Show empty state\n  → No: Show loading (fallback)\n```\n\n### Skeleton vs Spinner\n\n| Use Skeleton When | Use Spinner When |\n|-------------------|------------------|\n| Known content shape | Unknown content shape |\n| List\u002Fcard layouts | Modal actions |\n| Initial page load | Button submissions |\n| Content placeholders | Inline operations |\n\n## Error Handling Patterns\n\n### The Error Handling Hierarchy\n\n```\n1. Inline error (field-level) → Form validation errors\n2. Toast notification → Recoverable errors, user can retry\n3. Error banner → Page-level errors, data still partially usable\n4. Full error screen → Unrecoverable, needs user action\n```\n\n### Always Show Errors\n\n**CRITICAL: Never swallow errors silently.**\n\n```typescript\n\u002F\u002F CORRECT - Error always surfaced to user\nconst [createItem, { loading }] = useCreateItemMutation({\n  onCompleted: () => {\n    toast.success({ title: 'Item created' });\n  },\n  onError: (error) => {\n    console.error('createItem failed:', error);\n    toast.error({ title: 'Failed to create item' });\n  },\n});\n\n\u002F\u002F WRONG - Error silently caught, user has no idea\nconst [createItem] = useCreateItemMutation({\n  onError: (error) => {\n    console.error(error); \u002F\u002F User sees nothing!\n  },\n});\n```\n\n### Error State Component Pattern\n\n```typescript\ninterface ErrorStateProps {\n  error: Error;\n  onRetry?: () => void;\n  title?: string;\n}\n\nconst ErrorState = ({ error, onRetry, title }: ErrorStateProps) => (\n  \u003Cdiv className=\"error-state\">\n    \u003CIcon name=\"exclamation-circle\" \u002F>\n    \u003Ch3>{title ?? 'Something went wrong'}\u003C\u002Fh3>\n    \u003Cp>{error.message}\u003C\u002Fp>\n    {onRetry && (\n      \u003CButton onClick={onRetry}>Try Again\u003C\u002FButton>\n    )}\n  \u003C\u002Fdiv>\n);\n```\n\n## Button State Patterns\n\n### Button Loading State\n\n```tsx\n\u003CButton\n  onClick={handleSubmit}\n  isLoading={isSubmitting}\n  disabled={!isValid || isSubmitting}\n>\n  Submit\n\u003C\u002FButton>\n```\n\n### Disable During Operations\n\n**CRITICAL: Always disable triggers during async operations.**\n\n```tsx\n\u002F\u002F CORRECT - Button disabled while loading\n\u003CButton\n  disabled={isSubmitting}\n  isLoading={isSubmitting}\n  onClick={handleSubmit}\n>\n  Submit\n\u003C\u002FButton>\n\n\u002F\u002F WRONG - User can tap multiple times\n\u003CButton onClick={handleSubmit}>\n  {isSubmitting ? 'Submitting...' : 'Submit'}\n\u003C\u002FButton>\n```\n\n## Empty States\n\n### Empty State Requirements\n\nEvery list\u002Fcollection MUST have an empty state:\n\n```tsx\n\u002F\u002F WRONG - No empty state\nreturn \u003CFlatList data={items} \u002F>;\n\n\u002F\u002F CORRECT - Explicit empty state\nreturn (\n  \u003CFlatList\n    data={items}\n    ListEmptyComponent={\u003CEmptyState \u002F>}\n  \u002F>\n);\n```\n\n### Contextual Empty States\n\n```tsx\n\u002F\u002F Search with no results\n\u003CEmptyState\n  icon=\"search\"\n  title=\"No results found\"\n  description=\"Try different search terms\"\n\u002F>\n\n\u002F\u002F List with no items yet\n\u003CEmptyState\n  icon=\"plus-circle\"\n  title=\"No items yet\"\n  description=\"Create your first item\"\n  action={{ label: 'Create Item', onClick: handleCreate }}\n\u002F>\n```\n\n## Form Submission Pattern\n\n```tsx\nconst MyForm = () => {\n  const [submit, { loading }] = useSubmitMutation({\n    onCompleted: handleSuccess,\n    onError: handleError,\n  });\n\n  const handleSubmit = async () => {\n    if (!isValid) {\n      toast.error({ title: 'Please fix errors' });\n      return;\n    }\n    await submit({ variables: { input: values } });\n  };\n\n  return (\n    \u003Cform>\n      \u003CInput\n        value={values.name}\n        onChange={handleChange('name')}\n        error={touched.name ? errors.name : undefined}\n      \u002F>\n      \u003CButton\n        type=\"submit\"\n        onClick={handleSubmit}\n        disabled={!isValid || loading}\n        isLoading={loading}\n      >\n        Submit\n      \u003C\u002FButton>\n    \u003C\u002Fform>\n  );\n};\n```\n\n## Anti-Patterns\n\n### Loading States\n\n```typescript\n\u002F\u002F WRONG - Spinner when data exists (causes flash)\nif (loading) return \u003CSpinner \u002F>;\n\n\u002F\u002F CORRECT - Only show loading without data\nif (loading && !data) return \u003CSpinner \u002F>;\n```\n\n### Error Handling\n\n```typescript\n\u002F\u002F WRONG - Error swallowed\ntry {\n  await mutation();\n} catch (e) {\n  console.log(e); \u002F\u002F User has no idea!\n}\n\n\u002F\u002F CORRECT - Error surfaced\nonError: (error) => {\n  console.error('operation failed:', error);\n  toast.error({ title: 'Operation failed' });\n}\n```\n\n### Button States\n\n```typescript\n\u002F\u002F WRONG - Button not disabled during submission\n\u003CButton onClick={submit}>Submit\u003C\u002FButton>\n\n\u002F\u002F CORRECT - Disabled and shows loading\n\u003CButton onClick={submit} disabled={loading} isLoading={loading}>\n  Submit\n\u003C\u002FButton>\n```\n\n## Checklist\n\nBefore completing any UI component:\n\n**UI States:**\n- [ ] Error state handled and shown to user\n- [ ] Loading state shown only when no data exists\n- [ ] Empty state provided for collections\n- [ ] Buttons disabled during async operations\n- [ ] Buttons show loading indicator when appropriate\n\n**Data & Mutations:**\n- [ ] Mutations have onError handler\n- [ ] All user actions have feedback (toast\u002Fvisual)\n\n## Integration with Other Skills\n\n- **graphql-schema**: Use mutation patterns with proper error handling\n- **testing-patterns**: Test all UI states (loading, error, empty, success)\n- **formik-patterns**: Apply form submission patterns\n\n## When to Use\nThis skill is applicable to execute the workflow or actions described in the overview.\n",{"name":5,"risk":41,"source":46,"description":7},"release\u002Fv4.2.11-panel-pro","a92ea02bcf7e2b3dbaf46d49696c29a3cb490d4f",".github\u002Fskills\u002Freact-ui-patterns","https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-","https:\u002F\u002Fgithub.com\u002Fjaviertarazon","2026-07-12 07:10:45",{"source":8,"skillName":5,"commands":60,"prompt":70,"zipAvailable":71},[61,64,67],{"tool":62,"command":63},"npx","npx skills add javiertarazon\u002Fide-agente-free-jt7- --skill react-ui-patterns",{"tool":65,"command":66},"bunx","bunx skills add javiertarazon\u002Fide-agente-free-jt7- --skill react-ui-patterns",{"tool":68,"command":69},"pnpm","pnpm dlx skills add javiertarazon\u002Fide-agente-free-jt7- --skill react-ui-patterns","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-\u002Fblob\u002Frelease\u002Fv4.2.11-panel-pro\u002F.github\u002Fskills\u002Freact-ui-patterns\u002FSKILL.md",true,[],[74,98,124,144,159,180],{"skillNo":75,"name":76,"nameZh":6,"description":77,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":78,"categories":79,"keywords":81,"publishedAt":48},"01M71TQ7Q6Z10VWF3C2H5X1KW9","zustand-store-ts","Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state\u002Faction separation. Use when building React state management, creating global stores, or implementing reacti...","https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-\u002Fblob\u002Frelease\u002Fv4.2.11-panel-pro\u002F.github\u002Fskills\u002Fzustand-store-ts\u002FSKILL.md",[80],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},[82,83,84,46,85,86,87,88,42,41,33,89,90,91,92,93,94,95,96,97],"zustand","store","zustand store ts","middleware","implementing","use","react state management","with","state","create","state management","typescript","action","management","separation","global",{"skillNo":99,"name":100,"nameZh":6,"description":101,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":102,"categories":103,"keywords":107,"publishedAt":48},"01M71TQ5EAR40G6W0MV5ZDVEZT","zoom-automation","Automate Zoom meeting creation, management, recordings, webinars, and participant tracking via Rube MCP (Composio). Always search tools first for current schemas.","https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-\u002Fblob\u002Frelease\u002Fv4.2.11-panel-pro\u002F.github\u002Fskills\u002Fzoom-automation\u002FSKILL.md",[104],{"categoryNo":105,"categoryName":106,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000023","Skill与智能体开发",[108,109,110,46,111,36,112,113,114,41,115,116,117,118,119,120,121,122,95,123],"zoom automation","zoom","automation","creation","search","schemas","MCP","first","via","meeting","search tools","tracking","webinars","composio","recordings","Tools",{"skillNo":125,"name":126,"nameZh":6,"description":127,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":128,"categories":129,"keywords":131,"publishedAt":48},"01M71TQ29B1EYBCEAP1ZBGXQ1A","zoho-crm-automation","Automate Zoho CRM tasks via Rube MCP (Composio): create\u002Fupdate records, search contacts, manage leads, and convert leads. Always search tools first for current schemas.","https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-\u002Fblob\u002Frelease\u002Fv4.2.11-panel-pro\u002F.github\u002Fskills\u002Fzoho-crm-automation\u002FSKILL.md",[130],{"categoryNo":105,"categoryName":106,"taxonomyType":20,"taxonomyTypeDesc":21},[132,133,110,134,135,136,46,137,138,36,139,112,113,140,114,41,141,142,143,91],"crm automation","zoho crm automation","crm","zoho crm","zoho","leads","manage leads","manage","records","convert","tasks","contacts",{"skillNo":145,"name":146,"nameZh":6,"description":147,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":148,"categories":149,"keywords":151,"publishedAt":48},"01M71TPZPMN60DH0XV58KVHY23","zendesk-automation","Automate Zendesk tasks via Rube MCP (Composio): tickets, users, organizations, replies. Always search tools first for current schemas.","https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-\u002Fblob\u002Frelease\u002Fv4.2.11-panel-pro\u002F.github\u002Fskills\u002Fzendesk-automation\u002FSKILL.md",[150],{"categoryNo":105,"categoryName":106,"taxonomyType":20,"taxonomyTypeDesc":21},[152,110,153,46,36,112,113,114,154,41,142,155,156,115,116,157,118,121,123,158],"zendesk automation","zendesk","organizations","replies","users","tickets","automate",{"skillNo":160,"name":161,"nameZh":6,"description":162,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":163,"categories":164,"keywords":165,"publishedAt":48},"01M71TPXDWKHKG4N6TVEPXWD0N","zapier-make-patterns","No-code automation democratizes workflow building. Zapier and Make (formerly Integromat) let non-developers automate business processes without writing code. But no-code doesn't mean no-complexity ...","https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-\u002Fblob\u002Frelease\u002Fv4.2.11-panel-pro\u002F.github\u002Fskills\u002Fzapier-make-patterns\u002FSKILL.md",[],[166,167,30,168,169,170,171,172,173,110,174,41,175,176,177,178,179,158],"zapier make patterns","zapier","make","No-Code","complexity","writing","spawner","business","workflow","code","integromat","apache","processes","but",{"skillNo":181,"name":182,"nameZh":6,"description":183,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":184,"categories":185,"keywords":189,"publishedAt":48},"01M71TPT5T10WXNKW9G7ZXZ27W","youtube-summarizer","Extract transcripts from YouTube videos and generate comprehensive, detailed summaries using intelligent analysis frameworks","https:\u002F\u002Fgithub.com\u002Fjaviertarazon\u002Fide-agente-free-jt7-\u002Fblob\u002Frelease\u002Fv4.2.11-panel-pro\u002F.github\u002Fskills\u002Fyoutube-summarizer\u002FSKILL.md",[186],{"categoryNo":187,"categoryName":188,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000016","图像与多媒体",[190,191,192,193,46,194,195,196,197,198,199,200,175,201,202,203,204,205,206,207],"summarizer","youtube","youtube summarizer","Video","content-analysis","frameworks","copilot","2025","github-copilot","extract transcripts","analysis","codex","cli","summaries","github","generate","summarization","2026"]