[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"navigation_en":3,"/docs/tutorials/api-calls-data":144},[4,16,91,117,127],{"title":5,"path":6,"stem":7,"children":8,"icon":15},"Getting Started","/docs/get-started","docs/1.get-started/1.index",[9,11],{"title":10,"path":6,"stem":7},"Introduction",{"title":12,"path":13,"stem":14},"Setup","/docs/get-started/setup","docs/1.get-started/2.setup","mage:fast-forward-fill",{"title":17,"icon":18,"path":19,"stem":20,"children":21,"page":90},"Features","ic:baseline-cable","/docs/features","docs/2.features",[22,26,30,34,38,42,46,50,54,58,62,66,70,74,78,82,86],{"title":23,"path":24,"stem":25},"Database","/docs/features/database","docs/2.features/01.database",{"title":27,"path":28,"stem":29},"Authentication","/docs/features/auth","docs/2.features/02.auth",{"title":31,"path":32,"stem":33},"Payments","/docs/features/payments","docs/2.features/03.payments",{"title":35,"path":36,"stem":37},"Admin Panel","/docs/features/admin-panel","docs/2.features/04.admin-panel",{"title":39,"path":40,"stem":41},"AI","/docs/features/ai","docs/2.features/05.ai",{"title":43,"path":44,"stem":45},"Customization","/docs/features/customization","docs/2.features/06.customization",{"title":47,"path":48,"stem":49},"Storage","/docs/features/storage","docs/2.features/07.storage",{"title":51,"path":52,"stem":53},"Email","/docs/features/email","docs/2.features/08.email",{"title":55,"path":56,"stem":57},"Languages","/docs/features/languages","docs/2.features/09.languages",{"title":59,"path":60,"stem":61},"SEO","/docs/features/seo","docs/2.features/10.seo",{"title":63,"path":64,"stem":65},"Blogs","/docs/features/blogs","docs/2.features/11.blogs",{"title":67,"path":68,"stem":69},"Documentation","/docs/features/documentation","docs/2.features/12.documentation",{"title":71,"path":72,"stem":73},"Cron Jobs","/docs/features/cron-jobs","docs/2.features/13.cron-jobs",{"title":75,"path":76,"stem":77},"Error Handling","/docs/features/error-handling","docs/2.features/14.error-handling",{"title":79,"path":80,"stem":81},"Analytics","/docs/features/analytics","docs/2.features/15.analytics",{"title":83,"path":84,"stem":85},"PWA","/docs/features/pwa","docs/2.features/15.pwa",{"title":87,"path":88,"stem":89},"Customer Support","/docs/features/customer-support","docs/2.features/16.customer-support",false,{"title":92,"icon":93,"path":94,"stem":95,"children":96,"page":90},"Tutorials","ic:baseline-library-books","/docs/tutorials","docs/3.tutorials",[97,101,105,109,113],{"title":98,"path":99,"stem":100},"Project Structure","/docs/tutorials/project-structure","docs/3.tutorials/1.project-structure",{"title":102,"path":103,"stem":104},"Page Routes","/docs/tutorials/page-routes","docs/3.tutorials/2.page-routes",{"title":106,"path":107,"stem":108},"API Calls","/docs/tutorials/api-calls","docs/3.tutorials/3.api-calls",{"title":110,"path":111,"stem":112},"State Management","/docs/tutorials/state-management","docs/3.tutorials/4.state-management",{"title":114,"path":115,"stem":116},"Legal Pages by GPT","/docs/tutorials/legal-pages-by-gpt","docs/3.tutorials/5.legal-pages-by-gpt",{"title":118,"icon":119,"path":120,"stem":121,"children":122,"page":90},"Formatting & Linting","ic:baseline-format-align-left","/docs/formatting-and-linting","docs/4.formatting-and-linting",[123],{"title":124,"path":125,"stem":126},"Overview","/docs/formatting-and-linting/overview","docs/4.formatting-and-linting/1.overview",{"title":128,"icon":129,"path":130,"stem":131,"children":132,"page":90},"Deployment","ic:baseline-rocket-launch","/docs/deployment","docs/5.deployment",[133,136,140],{"title":124,"path":134,"stem":135},"/docs/deployment/overview","docs/5.deployment/1.overview",{"title":137,"path":138,"stem":139},"Vercel","/docs/deployment/vercel","docs/5.deployment/2.vercel",{"title":141,"path":142,"stem":143},"Cloudflare Workers","/docs/deployment/cloudflare","docs/5.deployment/3.cloudflare",{"page":145,"surround":331},{"id":146,"title":106,"body":147,"description":323,"extension":324,"head":325,"meta":326,"navigation":327,"ogImage":325,"path":107,"robots":325,"schemaOrg":325,"seo":328,"sitemap":329,"stem":108,"__hash__":330},"docs_en/docs/3.tutorials/3.api-calls.md",{"type":148,"value":149,"toc":317},"minimark",[150,154,185,189,196,245,249],[151,152,12],"h2",{"id":153},"setup",[155,156,157,170],"ol",{},[158,159,160,164,165,169],"li",{},[161,162,163],"strong",{},"Configure Database",": Set up your database first by following the ",[166,167,168],"a",{"href":24},"Database Setup Guide",".",[158,171,172,175,176,180,181,184],{},[161,173,174],{},"Verify useApi",": The ",[177,178,179],"code",{},"useApi"," composable is pre-configured at ",[177,182,183],{},"app/composables/useApi.ts",". No additional setup is needed unless adding custom API endpoints.",[151,186,188],{"id":187},"usage","Usage",[190,191,192,193,195],"p",{},"Use the ",[177,194,179],{}," composable in your Nuxt components to call server APIs. Below are front-end and back-end examples:",[155,197,198,226],{},[158,199,200,203,204,206,207,210,211,222,225],{},[161,201,202],{},"Front-End Example",":\nImport ",[177,205,179],{}," and call ",[177,208,209],{},"getAdminUserStats"," with error handling and loading state:",[212,213,220],"pre",{"className":214,"code":216,"filename":217,"language":218,"meta":219},[215],"language-text","\u003Cscript setup>\nconst { getAdminUserStats } = useApi();\nconst { t } = useI18n();\nconst stats = ref({ totalUsers: 0, admins: 0, members: 0, signUps7d: 0 });\nconst loading = ref(false);\n\nconst fetchStats = async () => {\n  try {\n    loading.value = true;\n    const response = await getAdminUserStats();\n    if (response.success && response.data) {\n      Object.assign(stats.value, response.data);\n    } else {\n      useToast(t('error.somethingWrong'), enums.toastAlertType.error);\n    }\n  } catch {\n    useToast(t('error.somethingWrong'), enums.toastAlertType.error);\n  } finally {\n    loading.value = false;\n  }\n};\n\nonMounted(fetchStats);\n\u003C/script>\n","pages/admin/stats.vue","text","",[177,221,216],{"__ignoreMap":219},[223,224],"br",{},"This fetches admin stats, shows a loading state, and displays a toast notification (pop-up message) on error.",[158,227,228,231,232,234,235,242,244],{},[161,229,230],{},"Back-End Example",":\nDefine a server API to handle the ",[177,233,209],{}," request with authentication:",[212,236,240],{"className":237,"code":238,"filename":239,"language":218,"meta":219},[215],"import { apiSuccess } from '~~/server/utils/apiResponse';\nimport { requireAuth } from '~~/server/auth';\nimport { getUserStats } from '~~/server/services/admin/stats';\n\nexport default defineEventHandler(async (event) => {\n  const user = await requireAuth(event);\n\n  if (user.role !== 'admin') {\n    throw createError({ statusCode: 403, statusMessage: 'Forbidden' });\n  }\n\n  const stats = await getUserStats();\n  return apiSuccess(stats);\n});\n","server/api/admin/stats.ts",[177,241,238],{"__ignoreMap":219},[223,243],{},"This checks if the user is an admin, fetches stats, and returns a formatted response.",[151,246,248],{"id":247},"how-it-works","How It Works",[250,251,252,267,288,300,308],"ul",{},[158,253,254,175,257,259,260,262,263,266],{},[161,255,256],{},"Client-Side",[177,258,179],{}," composable (",[177,261,183],{},") uses ",[177,264,265],{},"$fetch"," to call server APIs, handling methods like GET, POST, PUT, and DELETE.",[158,268,269,272,273,276,277,280,281,284,285,169],{},[161,270,271],{},"Server-Side",": APIs in ",[177,274,275],{},"server/api/"," (e.g., ",[177,278,279],{},"admin/stats.ts",") use services (e.g., ",[177,282,283],{},"server/services/admin/stats.ts",") for logic and return formatted responses with ",[177,286,287],{},"apiSuccess",[158,289,290,292,293,295,296,299],{},[161,291,75],{},": ",[177,294,179],{}," returns errors for invalid requests (e.g., 403 for non-admins). Front-end code can handle errors with ",[177,297,298],{},"try/catch"," and show toast notifications.",[158,301,302,304,305,169],{},[161,303,27],{},": Protected APIs (e.g., admin stats) require a valid user session and role, checked via ",[177,306,307],{},"requireAuth",[158,309,310,313,314,316],{},[161,311,312],{},"Database Dependency",": APIs like ",[177,315,209],{}," require a configured database to fetch data.",{"title":219,"searchDepth":318,"depth":318,"links":319},2,[320,321,322],{"id":153,"depth":318,"text":12},{"id":187,"depth":318,"text":188},{"id":247,"depth":318,"text":248},"Learn how to make and manage API calls in your app efficiently, connecting your app to external services with ease.","md",null,{},true,{"title":106,"description":323},{"loc":107},"rUwb8DjEgV5gIK6XzTeeJZ3sLyeeRoxOkhFNMVRs2RQ",[332,334],{"title":102,"path":103,"stem":104,"description":333,"children":-1},"Learn how to create and manage pages in your app using Nuxt file based routing.",{"title":110,"path":111,"stem":112,"description":335,"children":-1},"Manage and share state across pages and components in your app using the built-in useSharedState composable.'"]