ORM(Object-relational-mapping)

객체지향 프로그래밍과 관계형 데이터베이스 사이의 호환되지 않는
데이터를 변환하는 프로그래밍 기법이다.

TypeORM

TypeScript , JavaScript(ES5, ES6, ES7)용 ORM

TypeORM이 지원 하는것

  • MySQL
  • PostgreSQL
  • MariaDB
  • SQLite
  • MS SQL Server
  • Oracle
  • WebSQL

우리는 이중에 PostgreSQL을 사용한다.


Setting

1. yarn init

폴더를 하나만들고 폴더 안에서 yarn init 해준다

$ yarn init

yarn init 막 뭐라하라 뜨는데 다 엔터 눌러준다.
그리고 나면 저렇게 Success 성공했다고 메시지 뜬다.

그럼 이렇게 package.json파일이 생긴다.

package.json파일을 살펴보면

이렇게 내용이 채워져 있다.

2. yarn add typeorm

$ yarn add typeorm

3. yarn add graphql

$ yarn add graphql

4. yarn add apollo-server

$ yarn add apollo-server

5. yarn add pg(PostgreSQL)

$ yarn add pg

여기까지 했으면 package.json파일에

dependencies에 이렇게 내용이 채워짐

7. pacakge.json파일 수정해주기

package.json파일에 이부분을 추가해준다.
이유는 우리가 지금까지 써왔던 yarn dev를 비슷하게
하기 위해서 "dev"ts-node-dev라는 얘로 ./index.ts를 실행 시켜라
라고 하는 것.

typescript로 작동시키기 때문에 tsnode로 실행시켜줘야해서
이렇게 세팅하는거임

8. yarn add -D typescript

$ yarn add -D typescript

devDependencies에 설치하기위해 -D를 붙여준다.

9. yarn add -D ts-node

$ yarn add -D ts-node

10. yarn add -D ts-node-dev

$ yarn add -D  ts-node-dev

이렇게 하고나서 package.json파일을 보면

devDependencies에 내용이 채워졌다.


Board.postgres.ts파일 세팅

class로 만들어야 하는 이유 , BaseEntity 상속

SQL은 table에 data를 쌓아놓는데, 이 table을 세팅하기 위해선
class로 만들어야 한다.


그래서 이렇게 class형으로 만들었고, BaseEntity를 상속 받기위해
extends BaseEntity를 써줬고

BaseEntity를 써야하니까

이렇게 typeorm에서 BaseEntity를 불러와야 한다.

@Entity()

@데코레이터 라고 부른다. 이걸 쓰는 이유는
여기에 있는 코드를 class로 인식하면 안되고 Database로 인식하기 위함이다.
그래서 @Entity()를 써주는거다

Entity도 typeorm에서 불러와야한다.

@Column

우리가 아는 css에서 쓰이는 Column의 의미와 똑같다.
세로줄을 담당하는 녀석이다.

이렇게 말이다.

@Column의 세팅 방법은

이렇게 하는데, 각각의 Column마다 타입이 다를텐데
우리가 기존에 쓰던 타입인 string , number 이런식으로 쓰면 안된다.

  • string : text
  • number : integer

이렇게 써줘야 한다.

그리고 쓰이는 타입은 그냥 쓰던데로 string , number 쓰면 된다.

@PrimaryGeneratedColumn("increment")

number는 @PrimaryGeneratedColumn으로 해줘야 하는데,
그 이유는 number는 각각의 @Column중에서 구분되어져야 하는것이기 때문이다.

그리고 ""increment"의 뜻은 "자동으로 1씩 증가해라" 라는 뜻
number는 쓰던대로 number타입 지정해주면 된다.

이렇게 세팅을 다 해주면

이렇게 된다.


tsconfig.json 파일 세팅

tsconfig.json파일을 내가 직접 만들어야 할때
뭘 어떻게 해야할지 모를때

https://www.typescriptlang.org/docs/handbook/tsconfig-json.html
여기에서 추천해주는 방식recommended
https://www.npmjs.com/package/@tsconfig/recommended 로 들어가면
코드가 있는데 tsconfig.json파일에 복붙하면 된다.

tsconfig.json파일에 코드 복붙한 모습.

근데 이렇게만 하면 Board.postgres.ts파일에서 보면

'tsconfig' 파일이나, jsconfig에서 'experimentalDecorators'
옵션을 어떻게 하라고 나오는데

experimentalDecorators옵션을 true로 주고나서 Board.postgres.ts파일을 보면

빨간줄이 사라져 있을거임


index.ts 파일 세팅

import를 해온 이유?

여기서 import해와야하는것들 createConnection , ApolloServer , gql인데
다 이유가 있어서 import 해온것임.

gqltypeDefs , resolvers 에서 PlayGround에서 GraphQL-API를
세팅하기 때문에 import 해온것이고,

ApolloServer란?

ApolloServer 는 GraphQL 서버 인스턴스를 만들어주는 생성자이고, gql은 자바스크립트로 GraphQL 스키마를 정의하기 위해 사용되는 템플릿 리터럴 태그다.

그 다음, typeDefs 변수에 gql을 이용하여 GraphQL 스키마 타입을 정의하고, resolvers 변수에 GraphQL 스키마를 통해 제공할 데이터를 정의하는 함수를 담은 객체를 할당한다.

server라는 변수에 ApolloServer 를 써서 import 해온것이고,

createConnection 은 연결을 하는 부분이라 필요함

typeDefs , resolvers

  • typeDefs : PlayGround에서 해당 API가 가지고 있는 Arguments를 세팅하는 부분

PlayGround에서 fetchBoard API는 Arguments가 저렇게 되어있다.
그럼 typeDefs에서도 똑같이 해주면 된다.

이렇게 말이다.

  • resolvers : PlayGround에서 해당 API가 가지고 있는 리턴 값들을 세팅하는 부분

PlayGround에서 fetchBoard의 리턴값을 필요한 부분만
typeDefs에서도 똑같이 해주면 된다.

이렇게

createConnection

entities에는 __dirname을 모든부분에 .postgres.ts를 붙이라고 하는것임

그리고 .then() 이부분 부터는 연결이 성공했을때 실행 된다.

그리고 listen 부분 부터는 연결이 되기까지 기다리겠다는 뜻이고,
part: 4000은 4000번 포트로 연결하겠다 라는 뜻임.
그래서 인터넷에 localhost:4000 을 쳐야 보인다.

yarn dev해서 PlayGround 보기

yarn dev를 하게되면

이렇게 뜨고 localhost:4000으로 들어가면

이렇게 PlayGround창이 뜬다.

profile
Hello~~👋

0개의 댓글