🔧Use Google Spreadsheet as API with Nuxt3.

Prepare

check https://masanos.com/notes/x3a25j6_l2q/
Application restrictions: None
It might be good to hide the apiKey from the production environment with an environment variable.

server/api/sheet.ts

export default defineEventHandler(async () => {
  const data = await $fetch(`https://sheets.googleapis.com/v4/spreadsheets/${id}/values/${sheetName}?key=${apiKey}`
  ).catch(error => error)
  return data
})

pages/index.vue

<script>
const { data } = await useFetch('/api/sheet')
</script>
<template>
  <div>{{ data }}</div>
</template>