{"id":48119169,"url":"https://github.com/billymaulana/nuxt-actions-example","last_synced_at":"2026-04-04T16:18:08.458Z","repository":{"id":345944734,"uuid":"1162540827","full_name":"billymaulana/nuxt-actions-example","owner":"billymaulana","description":"Real-world example app for nuxt-actions -- type-safe server actions for Nuxt","archived":false,"fork":false,"pushed_at":"2026-03-21T14:24:01.000Z","size":174,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-03-22T03:23:16.196Z","etag":null,"topics":["example","nuxt","nuxt-actions","typescript","vue"],"latest_commit_sha":null,"homepage":"https://stackblitz.com/github/billymaulana/nuxt-actions-example","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/billymaulana.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-02-20T11:43:09.000Z","updated_at":"2026-03-21T14:22:50.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/billymaulana/nuxt-actions-example","commit_stats":null,"previous_names":["billymaulana/nuxt-actions-example"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/billymaulana/nuxt-actions-example","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/billymaulana%2Fnuxt-actions-example","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/billymaulana%2Fnuxt-actions-example/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/billymaulana%2Fnuxt-actions-example/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/billymaulana%2Fnuxt-actions-example/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/billymaulana","download_url":"https://codeload.github.com/billymaulana/nuxt-actions-example/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/billymaulana%2Fnuxt-actions-example/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31405700,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-04T10:20:44.708Z","status":"ssl_error","status_checked_at":"2026-04-04T10:20:06.846Z","response_time":60,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["example","nuxt","nuxt-actions","typescript","vue"],"created_at":"2026-04-04T16:18:06.209Z","updated_at":"2026-04-04T16:18:08.450Z","avatar_url":"https://github.com/billymaulana.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# nuxt-actions Example\n\nReal-world examples for [nuxt-actions](https://github.com/billymaulana/nuxt-actions) v1.1.2 — type-safe server actions for Nuxt.\n\n\u003cp\u003e\n  \u003ca href=\"https://npmjs.com/package/nuxt-actions\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/nuxt-actions/latest.svg?style=flat\u0026colorA=020420\u0026colorB=00DC82\" alt=\"npm version\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://npmjs.com/package/nuxt-actions\"\u003e\u003cimg src=\"https://img.shields.io/npm/l/nuxt-actions.svg?style=flat\u0026colorA=020420\u0026colorB=00DC82\" alt=\"License\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://nuxt.com\"\u003e\u003cimg src=\"https://img.shields.io/badge/Nuxt-020420?logo=nuxt\" alt=\"Nuxt\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp\u003e\n  \u003ca href=\"https://billymaulana.github.io/nuxt-actions/\"\u003eDocumentation\u003c/a\u003e |\n  \u003ca href=\"https://stackblitz.com/github/billymaulana/nuxt-actions-example\"\u003eStackBlitz Playground\u003c/a\u003e |\n  \u003ca href=\"https://github.com/billymaulana/nuxt-actions\"\u003eSource\u003c/a\u003e\n\u003c/p\u003e\n\n[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/billymaulana/nuxt-actions-example)\n\n## Demos\n\n| Page | Feature | Composable / Utility |\n|------|---------|----------------------|\n| `/actions` | CRUD with E2E typed action refs | `useAction` |\n| `/forms` | Field-level errors, dirty tracking, reset | `useFormAction` |\n| `/optimistic` | Instant UI + automatic rollback | `useOptimisticAction` |\n| `/streaming` | SSE text streaming with stop control | `useStreamAction` |\n| `/queries` | SSR queries + debounced search + transform | `useActionQuery` |\n| `/middleware` | Auth chain, skip behavior, typed context | `defineMiddleware` |\n| `/advanced` | Retry, timeout, headers, dedupe, throttle, output validation | `useAction` |\n| `/polling` | Auto-refetch, focus/reconnect refetch, enabled toggle, transform | `useActionQuery` |\n| `/infinite` | Cursor-based infinite scroll | `useInfiniteActionQuery` |\n| `/batch` | Parallel/sequential batch execution | `useActions` |\n| `/security` | Rate limiting + CSRF protection | `rateLimitMiddleware`, `csrfMiddleware` |\n| `/progressive` | Forms with/without JS | `useActionState` |\n| `/real-world` | Auth + CRUD + polling + optimistic + validation | All composables |\n| `/prefetch` | Pre-warm cache on hover, stream cache | `prefetchAction`, `useStreamActionQuery` |\n\n## Setup\n\n```bash\npnpm install\npnpm dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000).\n\n## All Available Composables \u0026 Utilities\n\n### Client Composables\n\n| Composable | Description |\n|------------|-------------|\n| `useAction` | Core composable — reactive state, retry, dedupe, debounce, throttle, transform |\n| `useFormAction` | Form-aware — field-level errors, dirty tracking, v-model support |\n| `useOptimisticAction` | Instant UI updates with automatic rollback on server error |\n| `useActionQuery` | SSR queries via `useAsyncData` — polling, focus/reconnect refetch, transform |\n| `useStreamAction` | SSE streaming with chunk accumulation and stop control |\n| `useStreamActionQuery` | Streaming with persistent cache across navigations |\n| `useInfiniteActionQuery` | Cursor-based pagination — `fetchNextPage`, `hasNextPage` |\n| `useActions` | Batch execution — parallel (`Promise.allSettled`) or sequential |\n| `useActionState` | Progressive enhancement — native HTML form fallback |\n| `prefetchAction` | Pre-warm Nuxt data cache on hover, route prefetch, or idle |\n| `invalidateActions` | Refetch cached data for specific or all action queries |\n| `clearActionCache` | Clear cached data without refetching |\n\n### Server Utilities\n\n| Utility | Description |\n|---------|-------------|\n| `defineAction` | Type-safe server actions with Standard Schema validation |\n| `defineStreamAction` | Streaming server actions via SSE |\n| `createActionClient` | Builder pattern — chain middleware, schema, metadata |\n| `defineMiddleware` | Reusable middleware with typed context accumulation |\n| `createMiddleware` | Alias for publishable middleware (npm packages) |\n| `createActionError` | Typed error creation with field-level details |\n| `returnValidationErrors` | Throw structured validation errors from handlers |\n| `rateLimitMiddleware` | In-memory rate limiting per IP |\n| `csrfMiddleware` | CSRF token protection with timing-safe comparison |\n\n## What's New in v1.1.0+\n\n- **Nuxt 4 Compatibility** — Full support for Nuxt 4 module structure\n- **useActionQuery Enhancements** — `refetchInterval`, `refetchOnFocus`, `refetchOnReconnect`, `enabled` toggle, and `transform`\n- **useInfiniteActionQuery** — Cursor-based pagination with `fetchNextPage` / `hasNextPage`\n- **useActions** — Batch execution of multiple actions (parallel or sequential)\n- **useActionState** — Progressive enhancement for forms that work with and without JavaScript\n- **prefetchAction** — Pre-warm the Nuxt data cache ahead of time (hover, route prefetch, idle)\n- **useStreamActionQuery** — Streaming with persistent cache (restore chunks on remount)\n- **rateLimitMiddleware** — In-memory rate limiting per IP with configurable window and limit\n- **csrfMiddleware** — CSRF token protection with cookie/header matching and timing-safe comparison\n- **returnValidationErrors** — Throw structured field-level validation errors from handlers\n- **Action Colocation** — Define actions alongside pages or in any `server/actions/` subdirectory\n\n## What This Demonstrates\n\n- **E2E Type Inference** — Import typed action refs from `#actions` with zero generics\n- **Standard Schema** — Zod validation with automatic field-level error formatting\n- **Form Actions** — `useFormAction` with dirty tracking, field errors, and reset\n- **Optimistic Updates** — Instant UI with automatic rollback on server error\n- **SSR Queries** — Server-rendered data with reactive re-fetching and transform\n- **Streaming** — Real-time SSE chunks with `stop()` control and persistent cache\n- **Middleware Chain** — Reusable auth/rate-limit middleware with typed context accumulation\n- **Retry \u0026 Timeout** — Configurable retry with status code matching and request timeout\n- **Dedupe \u0026 Throttle** — Cancel/defer duplicate requests and throttle rapid calls\n- **Output Validation** — Server validates both input AND output schemas\n- **Custom Headers** — Static and dynamic header passing per-request\n- **executeAsync** — Throw-on-error alternative to `execute()`\n- **Security Middleware** — Rate limiting and CSRF protection out of the box\n- **Progressive Enhancement** — Native HTML form fallback with `useActionState`\n- **Prefetch \u0026 Cache** — Pre-warm queries on hover, cache streamed results across navigations\n- **Cache Management** — `invalidateActions` and `clearActionCache` for fine-grained cache control\n- **Infinite Scroll** — Cursor-based pagination with SSR first page\n\n## License\n\n[MIT](./LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbillymaulana%2Fnuxt-actions-example","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbillymaulana%2Fnuxt-actions-example","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbillymaulana%2Fnuxt-actions-example/lists"}