[{"data":1,"prerenderedAt":82},["ShallowReactive",2],{"blog-nuxt-4-full-stack-with-laravel-api":3,"blogs-all":20},{"data":4},{"slug":5,"category":6,"title":7,"description":8,"cover":9,"tags":10,"readTime":14,"date":15,"updatedAt":16,"seo":17,"content":19},"nuxt-4-full-stack-with-laravel-api","Full-Stack","Nuxt 4 + Laravel API: The Full-Stack Setup I Actually Ship","How I structure a Nuxt 4 frontend with a Laravel REST API — auth composable, consistent response shape, error handling, and the lessons from two years of running this in production.",null,[11,12,6,13],"Nuxt","Laravel","API","7 min read","2026-04-18","2026-08-07",{"title":7,"description":18,"ogImage":9},"My production-tested Nuxt 4 + Laravel 11 setup — $fetch composable, Sanctum cookie auth, consistent API responses, lessons from two years running this stack.","## The Stack I Keep Coming Back To\n\nNuxt 4 on the frontend, Laravel 11 on the backend, Sanctum for auth. I've built on this combination for two years now across multiple projects, including SP360 at Smart Provider LLC.\n\nIt handles 90% of SaaS product needs without overengineering. This isn't a tutorial on what's possible — it's how I actually set it up.\n\n## The $fetch Wrapper\n\nFirst thing I create in every project: a composable that wraps `$fetch` with auth headers, base URL, and a global 401 redirect. This keeps every component consistent without repeating setup code.\n\n```ts\n\u002F\u002F app\u002Fcomposables\u002FuseApi.ts\nexport const useApi = () => {\n  const config = useRuntimeConfig()\n\n  return $fetch.create({\n    baseURL: config.public.apiBase,\n    credentials: 'include',\n    onRequest({ options }) {\n      const token = useCookie('XSRF-TOKEN')\n      if (token.value) {\n        options.headers = {\n          ...options.headers,\n          'X-XSRF-TOKEN': token.value,\n        }\n      }\n    },\n    onResponseError({ response }) {\n      if (response.status === 401) {\n        navigateTo('\u002Flogin')\n      }\n    },\n  })\n}\n```\n\n## Sanctum Config That Actually Works\n\nCookie-based auth for the SPA. Tokens in localStorage are XSS targets — never do that for a web app.\n\n```php\n\u002F\u002F config\u002Fsanctum.php\n'stateful' => explode(',', env('SANCTUM_STATEFUL_DOMAINS',\n    'localhost,localhost:3000,yourdomain.com'\n)),\n\n\u002F\u002F config\u002Fcors.php\n'supports_credentials' => true,\n'allowed_origins'      => [env('FRONTEND_URL', 'http:\u002F\u002Flocalhost:3000')],\n```\n\nThe CSRF cookie request must happen before login. Miss this step and you get 419 errors.\n\n```ts\nasync function login(credentials: { email: string; password: string }) {\n    await $fetch('\u002Fsanctum\u002Fcsrf-cookie', { baseURL: apiBase, credentials: 'include' })\n    await $fetch('\u002Fapi\u002Flogin', { method: 'POST', body: credentials, credentials: 'include', baseURL: apiBase })\n}\n```\n\n## Consistent API Response Shape\n\nEvery Laravel controller in my projects returns the same JSON structure. This makes frontend error handling predictable across the entire app.\n\n```php\n\u002F\u002F Success\nreturn response()->json(['data' => $resource, 'message' => 'Created successfully.']);\n\n\u002F\u002F Validation error — via Handler.php\nreturn response()->json(['message' => 'Validation failed.', 'errors' => $validator->errors()], 422);\n```\n\nOn the Nuxt side:\n\n```ts\ntry {\n  const { data, message } = await useApi()('\u002Fapi\u002Fv1\u002Fprojects', {\n    method: 'POST',\n    body: form,\n  })\n  toast.success(message)\n} catch (error: any) {\n  formErrors.value = error.data?.errors ?? {}\n}\n```\n\n## useAsyncData Over useFetch\n\n`useFetch` is convenient but gives less control over cache keys and when data is fetched. I prefer `useAsyncData` explicitly.\n\n```ts\nconst { data: projects, pending } = await useAsyncData(\n  'projects-list',\n  () => useApi()('\u002Fapi\u002Fv1\u002Fprojects'),\n  { default: () => [] }\n)\n```\n\n## What I Learned the Hard Way\n\nVersion your API from day one. `\u002Fapi\u002Fv1\u002F` costs nothing to add now and saves painful migration work later when a route needs to change while old clients still depend on it.\n\nReturn consistent JSON shape from the first endpoint. Every time I've skipped this \"just to ship faster,\" I've paid for it the next time I needed to handle an error in a new component.\n\nThis setup is running in production on SP360. I haven't had a reason to change the core pattern.",{"data":21},[22,34,46,56,59,70],{"slug":23,"category":24,"title":25,"description":26,"cover":9,"tags":27,"readTime":30,"date":31,"updatedAt":16,"seo":32},"prompt-engineering-for-developers","AI","Prompt Engineering for Developers: What Actually Works in Production","Practical techniques I use when integrating Claude and OpenAI APIs into real applications — output format control, system prompts, few-shot examples, and defensive parsing.",[24,28,29,12],"Claude API","OpenAI","8 min read","2026-05-18",{"title":25,"description":33,"ogImage":9},"Format control, system prompts, few-shot examples, defensive parsing — practical prompt engineering from a year of integrating Claude and OpenAI APIs.",{"slug":35,"category":36,"title":37,"description":38,"cover":9,"tags":39,"readTime":30,"date":42,"updatedAt":16,"seo":43},"mysql-query-optimization-laravel","Database","MySQL Query Optimization in Laravel: What I Fixed in Production","Real slow-query problems I diagnosed and fixed in a production SaaS — N+1 queries, missing indexes, Eloquent gotchas, and when to drop to raw SQL.",[12,40,36,41],"MySQL","Performance","2026-05-10",{"title":44,"description":45,"ogImage":9},"MySQL Query Optimization in Laravel: Real Production Fixes","N+1 queries, missing indexes, Eloquent gotchas — real slow-query problems I diagnosed and fixed in a production Laravel SaaS. Before and after code included.",{"slug":47,"category":24,"title":48,"description":49,"cover":9,"tags":50,"readTime":52,"date":53,"updatedAt":16,"seo":54},"building-ai-features-in-laravel","Building AI Features in Laravel with the Claude API","How I integrated Claude API into a SaaS platform to automate repetitive data entry workflows — and what I got wrong before I got it right.",[12,24,28,51],"SaaS","6 min read","2026-05-01",{"title":48,"description":55,"ogImage":9},"How I integrated Claude API into a Laravel SaaS to automate data entry — queues, caching, defensive parsing, and real production lessons from SP360.",{"slug":5,"category":6,"title":7,"description":8,"cover":9,"tags":57,"readTime":14,"date":15,"updatedAt":16,"seo":58},[11,12,6,13],{"title":7,"description":18,"ogImage":9},{"slug":60,"category":61,"title":62,"description":63,"cover":9,"tags":64,"readTime":14,"date":67,"updatedAt":16,"seo":68},"laravel-queue-jobs-real-world","Backend","Laravel Queues in Production: What Nobody Tells You","Beyond the docs — real patterns for reliable queue jobs, retry strategies, and monitoring that I use in a production SaaS application.",[12,65,61,66],"Queues","Production","2026-04-15",{"title":62,"description":69,"ogImage":9},"Real patterns for reliable Laravel queue jobs — timeouts, idempotency, cache locks, and Horizon config I use in a production SaaS application.",{"slug":71,"category":72,"title":73,"description":74,"cover":9,"tags":75,"readTime":78,"date":79,"updatedAt":16,"seo":80},"vue-3-composition-api-patterns","Frontend","Vue 3 Composition API Patterns I Use Every Day","Practical composable patterns — async state management, form handling, and reusable logic that keeps Vue 3 codebases clean without premature abstraction.",[76,77,72],"Vue","TypeScript","5 min read","2026-04-05",{"title":73,"description":81,"ogImage":9},"Practical composables for async state, form validation, and reusable logic in Vue 3 — patterns I use in every Nuxt project, with real code.",1787435163504]