PDF 검색 챗봇 / Next.js 에서 TypeScript + sqlite 사용을 위한 Prisma

만들고 있는 화면 ===>   http://shsoft.ipdisk.co.kr:3000/

제가 컴퓨터를 킬때만 실행됩니다. 테스트 해보고싶으신분은 댓글또는 오픈톡남겨주세요 

https://open.kakao.com/o/smuZrWyf

 

 

 

데이터연동을위한 소스를 찾던중 Prisma 활용법을 보고 관련 블러그를 따라하다. 공식사이트에서 자세히 나와요 번역기를 통해 돌려보고 테스트해보고 현재 진행중인 챗봇에 적용 해보았다.

https://www.prisma.io/docs/getting-started/quickstart

Quickstart with TypeScript & SQLite

 

 

 

시작하다

빠른 시작

이 빠른 시작 가이드에서는 일반 TypeScript 프로젝트와 로컬 SQLite 데이터베이스 파일 을 사용하여 처음부터 Prisma를 시작하는 방법을 배웁니다 . 데이터 모델링 , 마이그레이션 및 데이터베이스 쿼리를 다룹니다 .

자신의 PostgreSQL, MySQL, MongoDB 또는 기타 지원되는 데이터베이스와 함께 Prisma를 사용하려면 대신 여기로 이동하십시오.

• 처음부터 Prisma로 시작
• 기존 프로젝트에 Prisma 추가

전제 조건

이 가이드를 사용하려면 Node.js v16.13.0 이상이 필요합니다( 시스템 요구 사항 에 대해 자세히 알아보기 ).

설치 전 sqlite 를 설치 합니다.

sqlite 설치

yarn add sqlite sqlite3

이제 db가 될 sqlite 파일을 만들어 보자

touch db.sqlite

설치 하고나면  sqlite3 db.sqlite 실행하면 오라클처럼 sqlplus 같은게 실행됩니다. mysql 도 그렇고 비슷하게 쿼리 날릴수있습니다.

 

1. TypeScript 프로젝트 생성 및 Prisma 설정

첫 번째 단계로 프로젝트 디렉토리를 생성하고 해당 디렉토리로 이동합니다.

===> 저의 경우 기존에 있는 프로젝트에서 만들어서 건너뛰면 됩니다.

$mkdir hello-prisma

$cd hello-prisma

다음으로 npm을 사용하여 TypeScript 프로젝트를 초기화합니다.

 

$npm init -y

$npm install typescript ts-node @types/node --save-dev

이렇게 하면 package.jsonTypeScript 앱의 초기 설정이 생성됩니다.

다른 패키지 관리자를 사용하여 Prisma를 설치하는 방법을 알아보려면 설치 지침을 참조하십시오 .

이제 TypeScript를 초기화합니다.

 

$npx tsc --init

그런 다음 Prisma CLI를 프로젝트의 개발 종속성으로 설치합니다.

 

$npm install prisma --save-dev

init마지막으로 Prisma CLI 명령 으로 Prisma를 설정합니다 .

 

$npx prisma init --datasource-provider sqlite

이렇게 하면 Prisma 스키마 파일로 새 prisma디렉터리가 생성되고 SQLite가 데이터베이스로 구성됩니다. 이제 데이터를 모델링하고 일부 테이블로 데이터베이스를 만들 준비가 되었습니다.

2. Prisma 스키마에서 데이터 모델링

Prisma 스키마는 데이터를 모델링하는 직관적인 방법을 제공합니다. 파일 에 다음 모델을 추가합니다 schema.prisma.

prisma/schema.prisma

 

model User {
 id Int @id @default(autoincrement())
 email String @unique
 name String?
 posts Post[]
}

model Post {
 id Int @id @default(autoincrement())
 title String
 content String?
 published Boolean @default(false)
 author User @relation(fields: [authorId], references: [id])
 authorId Int
}

Prisma 스키마의 모델에는 두 가지 주요 목적이 있습니다.

• 기본 데이터베이스의 테이블을 나타냅니다.
• 생성된 Prisma Client API의 기반 역할

다음 섹션에서는 Prisma Migrate를 사용하여 이러한 모델을 데이터베이스 테이블에 매핑합니다.

3. Prisma Migrate로 마이그레이션을 실행하여 데이터베이스 테이블 생성

이 시점에서 Prisma 스키마는 있지만 아직 데이터베이스는 없습니다. 터미널에서 다음 명령을 실행하여 SQLite 데이터베이스와 모델이 나타내는 User및 테이블을 생성합니다.Post

 

$npx prisma migrate dev --name init

이 명령은 두 가지 작업을 수행했습니다.

1. 디렉터리 에 이 마이그레이션을 위한 새 SQL 마이그레이션 파일을 생성합니다 prisma/migrations.
2. 데이터베이스에 대해 SQL 마이그레이션 파일을 실행합니다.

이전에는 SQLite 데이터베이스 파일이 없었기 때문에 명령은 파일 의 환경 변수를 통해 정의된 prisma이름으로 디렉터리 내부에 파일을 생성했습니다 .dev.db.env

축하합니다. 이제 데이터베이스와 테이블이 준비되었습니다. 데이터를 읽고 쓰기 위해 몇 가지 쿼리를 보내는 방법을 알아보겠습니다!

4. Prisma 클라이언트를 사용하여 데이터베이스에 쿼리를 보내는 방법 알아보기

데이터베이스에 쿼리를 보내려면 Prisma 클라이언트 쿼리를 실행할 TypeScript 파일이 필요합니다. script.ts이 용도로 호출되는 새 파일을 만듭니다 .

 

$touch script.ts  => 파일 생성 (리눅스의 경우 이렇게 하면 빈파일이 만들어진다.)

그런 다음 다음 상용구를 붙여넣습니다.

script.ts

 

1import { PrismaClient } from '@prisma/client'

2

3const prisma = new PrismaClient()

4

5async function main() {

6 // ... you will write your Prisma Client queries here

7}

8

9main()

10 .then(async () => {

11 await prisma.$disconnect()

12 })

13 .catch(async (e) => {

14 console.error(e)

15 await prisma.$disconnect()

16 process.exit(1)

17 })

이 코드에는 main스크립트 끝에서 호출되는 함수가 포함되어 있습니다. 또한 PrismaClient데이터베이스에 대한 쿼리 인터페이스를 나타내는 인스턴스를 생성합니다.

4.1. 새 User레코드 만들기

User데이터베이스에 새 레코드를 만들고 결과 개체를 콘솔에 기록하는 작은 쿼리부터 시작하겠습니다 . 파일 에 다음 코드를 추가합니다 script.ts.

script.ts

 

1import { PrismaClient } from '@prisma/client'

2

3const prisma = new PrismaClient()

4

5async function main() {

+ const user = await prisma.user.create({

+ data: {

+ name: 'Alice',

+ email: 'alice@prisma.io',

+ },

+ })

+ console.log(user)

13}

14

15main()

16 .then(async () => {

17 await prisma.$disconnect()

18 })

19 .catch(async (e) => {

20 console.error(e)

21 await prisma.$disconnect()

22 process.exit(1)

23 })

코드를 복사하는 대신 편집기에 코드를 입력하여 Prisma Client가 제공하는 자동 완성 기능을 경험할 수 있습니다. 키보드에서 CTRL+ 키를 눌러 자동 완성을 적극적으로 호출할 수도 있습니다 .SPACE

다음으로 다음 명령을 사용하여 스크립트를 실행합니다.

 

$npx ts-node script.ts 

 

CLI 결과 숨기기

{ id: 1, email: 'alice@prisma.io', name: 'Alice' }

훌륭합니다. 방금 Prisma 클라이언트로 첫 번째 데이터베이스 레코드를 만들었습니다! 🎉

다음 섹션에서는 데이터베이스에서 데이터를 읽는 방법을 배웁니다.

4.2. User모든 기록 검색

Prisma Client는 데이터베이스에서 데이터를 읽기 위한 다양한 쿼리를 제공합니다. 이 섹션에서는 지정된 모델에 대한 데이터베이스의 모든findMany 레코드를 반환하는 쿼리를 사용합니다 .

이전 Prisma 클라이언트 쿼리를 삭제하고 대신 새 findMany쿼리를 추가합니다.

script.ts

 

1import { PrismaClient } from '@prisma/client'

2

3const prisma = new PrismaClient()

4

5async function main() {

+ const users = await prisma.user.findMany()

+ console.log(users)

8}

9

10main()

11 .then(async () => {

12 await prisma.$disconnect()

13 })

14 .catch(async (e) => {

15 console.error(e)

16 await prisma.$disconnect()

17 process.exit(1)

18 })

스크립트를 다시 실행합니다.

 

$npx ts-node script.ts

CLI 결과 숨기기

[{ id: 1, email: 'alice@prisma.io', name: 'Alice' }]

단일 User개체가 이제 콘솔에서 어떻게 대괄호로 묶여 있는지 확인하십시오. findMany내부에 단일 개체가 있는 배열을 반환했기 때문입니다 .

4.3. Prisma로 관계 쿼리 탐색

Prisma Client의 주요 기능 중 하나는 관계 작업의 용이성입니다 . 이 섹션에서는 중첩된 쓰기 쿼리에서 User및 레코드를 만드는 방법을 알아봅니다 . Post그런 다음 옵션을 사용하여 데이터베이스에서 관계를 검색하는 방법을 볼 수 있습니다 include.

먼저 중첩 쿼리를 포함하도록 스크립트를 조정합니다.

script.ts

 

1import { PrismaClient } from '@prisma/client'

2

3const prisma = new PrismaClient()

4

5async function main() {

+ const user = await prisma.user.create({

+ data: {

+ name: 'Bob',

+ email: 'bob@prisma.io',

+ posts: {

+ create: {

+ title: 'Hello World',

+ },

+ },

+ },

+ })

+ console.log(user)

18}

19

20main()

21 .then(async () => {

22 await prisma.$disconnect()

23 })

24 .catch(async (e) => {

25 console.error(e)

26 await prisma.$disconnect()

27 process.exit(1)

28 })

스크립트를 다시 실행하여 쿼리를 실행합니다.

 

$npx ts-node script.ts

CLI 결과 숨기기

{ id: 2, email: 'bob@prisma.io', name: 'Bob' }

기본적으로 Prisma는 쿼리 결과 개체의 스칼라 필드만 반환합니다. Post그렇기 때문에 새 레코드에 대한 새 레코드도 만들었지만 콘솔은 세 개의 스칼라 필드 ( 및 ) User가 있는 개체만 인쇄했습니다 .idemailname

Post에 속하는 레코드 도 검색하려면 관계 필드를 통해 옵션을 User사용할 수 있습니다 .includeposts

script.ts

 

1import { PrismaClient } from '@prisma/client'

2

3const prisma = new PrismaClient()

4

5async function main() {

+ const usersWithPosts = await prisma.user.findMany({

+ include: {

+ posts: true,

+ },

+ })

+ console.dir(usersWithPosts, { depth: null })

12}

13

14main()

15 .then(async () => {

16 await prisma.$disconnect()

17 })

18 .catch(async (e) => {

19 console.error(e)

20 await prisma.$disconnect()

21 process.exit(1)

22 })

중첩된 읽기 쿼리의 결과를 보려면 스크립트를 다시 실행하십시오.

 

$npx ts-node script.ts

CLI 결과 숨기기

[

{ id: 1, email: 'alice@prisma.io', name: 'Alice', posts: [] },

{

id: 2,

email: 'bob@prisma.io',

name: 'Bob',

posts: [

{

id: 1,

title: 'Hello World',

content: null,

published: false,

authorId: 2

}

]

}

]

이번에는 두 개의 User개체가 인쇄되는 것을 볼 수 있습니다. 둘 다 관련 레코드를 나타내는 posts필드( 에 대해 비어 "Alice"있고 에 대한 단일 Post개체 로 채워짐)가 있습니다."Bob"Post

배열 의 개체도 usersWithPosts완전히 형식화되어 있습니다. 즉, 자동 완성이 가능하고 TypeScript 컴파일러가 실수로 입력하는 것을 방지합니다.

5. 다음 단계

이 빠른 시작 가이드에서는 일반 TypeScript 프로젝트에서 Prisma를 시작하는 방법을 배웠습니다. 예를 들어 쿼리에 필터링, 정렬 및 페이지 매김 옵션을 포함하거나 및 쿼리와 findMany같은 더 많은 작업을 탐색하여 Prisma 클라이언트 API를 좀 더 자유롭게 탐색하십시오 .updatedelete

Prisma Studio에서 데이터 탐색

Prisma에는 데이터베이스의 데이터를 보고 편집할 수 있는 GUI가 내장되어 있습니다. 다음 명령을 사용하여 열 수 있습니다.

 

$npx prisma studio

 

 

 이런 화면이 뜨네요 

자체 데이터베이스로 Prisma 설정

자체 PostgreSQL, MySQL, MongoDB 또는 기타 지원되는 데이터베이스를 사용하여 Prisma를 사용하려면 Prisma 설정 가이드를 따르세요.

• 처음부터 Prisma로 시작
• 기존 프로젝트에 Prisma 추가

바로 실행할 수 있는 Prisma 예제 살펴보기

확인prisma-examples좋아하는 라이브러리와 함께 Prisma를 사용할 수 있는 방법을 보려면 GitHub의 저장소를 참조하십시오. 이 리포지토리에는 Express, NestJS, GraphQL의 예제와 Next.js 및 Vue.js의 풀스택 예제 등이 포함되어 있습니다.

Prisma로 앱 구축

Prisma 블로그에는 Prisma에 대한 포괄적인 자습서가 있습니다. 최신 자습서를 확인하십시오.

• Remix로 풀스택 앱 빌드(동영상 포함 5부작)
• NestJS로 REST API 구축