본문 바로가기
WIKI 기술 지식 베이스

Nuxt + Turso

원문 보기 위키 갱신

Nuxt 프로젝트에 Turso를 몇 분 만에 세팅하는 방법이에요. SDK 설치부터 런타임 설정, 클라이언트 구성, SQL 실행까지 순서대로 따라오세요.

출처: 문서

본문

시작하기 전에 다음을 확인하세요:

Install the libSQL SDK

@libsql/client 패키지를 설치하면 돼요: npm install @libsql/client

Configure database credentials

데이터베이스 URL을 받으세요:

turso db show --url <database-name>

데이터베이스 인증 토큰을 받으세요:

turso db tokens create <database-name>

그다음 .env 안에서 환경 변수에 자격 증명을 할당하세요.

NUXT_TURSO_DATABASE_URL=
NUXT_TURSO_AUTH_TOKEN=

Configure variables inside Nuxt's runtime config.

export default defineNuxtConfig({
  runtimeConfig: {
    turso: {
      databaseUrl: "",
      authToken: "",
    },
  },
});

참고로, runtimeConfig 객체의 키 이름이 환경 변수 이름과 일치해야 해요. 자세한 내용은 여기를 읽어 보세요.

Configure libSQL Client.

import { createClient } from "@libsql/client";
// You can optionally pass in the event to useRuntimeConfig
// import { H3Event } from "h3";

export function useTurso(/* event: H3Event */) {
  const { turso } = useRuntimeConfig(/* event */);

  return createClient({
    url: turso.databaseUrl,
    authToken: turso.authToken,
  });
}

Execute SQL

export default defineEventHandler(async (event) => {
  const client = useTurso(/* event */);
  const { rows } = await client.execute("select * from table_name");

  return {
    data: {
      items: rows,
    },
  };
});

Examples

Website + App — 전체 소스 코드를 확인할 수 있어요.

더 알아보기 (Learn more)