React | 의미 UI | GraphQL | PostgresSQL이 포함된 Slack Clone(섹션 2)

앞서 PostgreSQL의 소개와 설치에 대해 논의했습니다.너는 찾을 수 있다
오늘 Graphql 서버를 빠르게 설치할 것입니다.

폴더 설정
우선 편리한 곳에 폴더를 만듭시다.나는 내 폴더 채팅방에 전화를 걸었다.완료되면 이 항목을 텍스트 편집기에서 엽니다(VScode).

프로젝트 초기화
이 명령을 터미널(프로젝트 폴더 내)에서 실행하여 프로젝트를 시작합니다.

npm init -y

소포를 보면json 파일은 폴더에 있습니다. 시작할 수 있습니다.다음에 우리는 우리가 백엔드에서 사용할 소프트웨어 패키지를 설치해야 한다.

패키지 설치
터미널 (프로젝트 폴더 내) 에서 이 명령을 실행합니다.
종속성:

npm i apollo server graphql pg pg-hstore sequelize bcrypt

한 줄에서 이 동작을 실행하면 이 모든 것을 설치할 수 있습니다.
의존성:

npm i --save--dev nodemon sequelize-cli

지금, 당신은 이 가방들이 도대체 무엇을 하는지 알고 싶습니까?잘 물었습니다.

포장 설명

아폴로 서버가 우리 백엔드에Graphql 서버를 설치했다.

graphql은 조회와 돌연변이를 설정하고 응용 프로그램에서 단점을 정의할 수 있도록 합니다.

pg와 pg hstore는 우리의 PostgreSQL과 접촉한다.pg hstore는 JSON 데이터를 hstore 형식으로 변환합니다.백그라운드에서 일하다.

sequelize는 모델을 생성하는 데 사용되는 ORM입니다.이것은 우리의 모델을 데이터베이스로 변환하는 데 사용됩니다.

nodemon은 우리가 시종일관 서버를 실행할 수 있도록 허락한다

sequelize cli는 명령행 인터페이스로 모델 및 기타 기능을 쉽게 생성할 수 있습니다.
본고에서 우리가 해야 할 마지막 일은 apollo 서버를 설정하는 것이다.

아폴로 서버 설치
너의 소포 안에 있다.json 파일은 주 입구점을 서버로 설정해야 합니다.이렇게

"main" : "server.js"

지금 그 서버를 만듭니다.루트 프로젝트 폴더의 js 파일입니다.
위쪽에서 이 파일들을 서버로 가져옵니다.js.

const { ApolloServer } = require("apollo-server");
const typeDefs = require("./graphql/typeDefs");
const resolvers = require("./graphql/resolvers");

우리는 apollo 서버를 포함해서 서버를 시작하고 실행할 수 있으며, 다른 두 개의 파일을 만들어야 한다.typeDefs와 resolvers는 Graphql이 작업할 수 있도록 apollo 서버에 전달해야 하는 파일입니다.
이 파일들은 매우 중요합니다. typeDefs 단점의 외관을 정의하는 코드를 포함합니다.resolvers는 이 단점 데이터를 되돌려주는 코드를 가지고 typeDefs에서 정의한 방식을 바탕으로 한다.(요컨대)
이 파일들을 만듭니다.지금 그것들은 매우 간단하다. 단지 우리가 시작하기 위해서이다.
루트 프로젝트 폴더에graphql 폴더를 만듭니다.이 폴더에 typeDefs.js 파일과 resolvers.js 파일을 만듭니다.
내부typeDefs.js 생성

const { gql } = require("apollo-server");

module.exports = gql`
  type Query {
    sayHi: String
  }
`;

Graphql 서버에서 이 단점에 접근할 수 있도록 형식 정의를 gql 템플릿에 봉인한 다음, 이 유형을 내보내야 합니다.
잠시 후에 우리는 그들의 작업 원리를 깊이 연구할 것이다. 그러면 우리는 apollo 서버에서 일부 내용을 가져올 수 있다.다음은 해상도를 해보겠습니다.

module.exports = {
  Query: {
    sayHi: () => "HI!!!"
  }
};

이 sayHi 조회는 우리가 유형에 정의한 정확한 이름을 가지고 있습니다.이것은 그것들이 똑같기 때문이다.server.js 파일로 돌아가서 typeDefs와 resolver.js 파일과 아폴로 서버를 시작합니다.

const server = new ApolloServer({
  typeDefs,
  resolvers
});

server
  .listen(4000, () => {
    console.log(`🚀 Server ready at port 4000`);
  })
  .catch(err => console.log(err, "err running server"));

우리는 서버를 초기화하고 형식과 해석기를 전송했으며, 마지막으로localhost:4000에서 서버를 시작하였다
테스트하기 전에, 스크립트를 실행해서nodemon으로 시작해야 합니다.포장하러 가다.json, 스크립트에 유사한

"dev": "nodemon server.js"

그것을 시작하려면 실행하십시오

npm run dev

만일 모든 것이 순조롭다면, Graphql 서버가 이렇게 실행되는 것을 보게 될 것입니다.
캡처 2020-09-14, 새벽 3:58.02.파푸아뉴기니
전반적으로 말하자면, 너의 소포.json과 서버.js는 결국 이렇게 될 거야.
소포.json

{
  "name": "chatroom",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "scripts": {
    "dev": "nodemon server.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "apollo-server": "^2.16.1",
    "bcrypt": "^5.0.0",
    "graphql": "^15.3.0",
    "pg": "^8.3.3",
    "pg-hstore": "^2.3.3",
    "sequelize": "^6.3.4",
  },
  "devDependencies": {
    "nodemon": "^2.0.4",
    "sequelize-cli": "^6.2.0"
  }
}

서버.js

const { ApolloServer } = require("apollo-server");
const typeDefs = require("./graphql/typeDefs");
const resolvers = require("./graphql/resolvers");

const server = new ApolloServer({
  typeDefs,
  resolvers
});

server.listen(4000, () => {
  console.log(`🚀 Server ready at port 4000`);
});

이것이 이 분의 전부입니다.다음에 우리는 데이터베이스를 프로젝트에 연결하기 시작할 것이다.이전:)
p. Graphql 서버를 시작할 수 없으면 언제든지 알려 주십시오. 저는 기꺼이 도와드리겠습니다:)