[인스타클론코딩] [Server].1 - 프로젝트 생성 및 셋팅

• 프로젝트 셋팅
  • 프로젝트 생성
  • 라이브러리 설치
  • pakage.json 수정
  • 프로젝트 환경변수 설정하기 - dotenv
    • .env 파일 만들기
  • server.js 에서 환경변수 사용하기
  • typeDefs, Resolvers 만들기
• 결과
• 주의할 점

프로젝트 셋팅

• 프로젝트 생성

  • Git Repository 만들기
  • 프로젝트 만들기 .gitignore : Node
  • npm init 및 Git 연동

• 라이브러리 설치

  • graphql-yoga

    npm add graphql-yoga
    

  • nodemon -D ** src/server.js 파일 실행시키는데 필요함. **

    npm add nodemon -D
    

  • babel-node

    npm install --save-dev @babel/node
    

• pakage.json 수정

  • npm dev를 실행하면 nodemon –exec babel-node src/server.js를 실행하게 되는 것 입니다.
  • nodemon을 실행할 때마다 babel-node로 src폴더의 server.js 파일을 실행하게 됩니다.
  • nodemon은 저장할 때마다 실행을 해주는 도구입니다. 서버를 껐다가 킬 필요가 없어지게 해주는 도구입니다.

  "scripts" : {
    "dev" : "nodemon --exec babel-node src/server.js"
  }
  

• 프로젝트 환경변수 설정하기 - dotenv

  프로젝트를 만들다보면 PORT와 같은 변수들을 지정해주어야 할 상황이 있습니다. 원래 이런 것들은 소스코드에 넣는 것이 아니라고 합니다.
  하지만 .env파일을 통해서 넣어 놓는 경우가 많다고 합니다.

  그래서 .env파일을 만들고 dot.env 모듈을 이용해 환경변수를 설정해보려고 합니다.

  • .env 파일 만들기

    제가 사용할 변수는 포트번호이기 때문에 PORT를 선언해놓으려고 합니다.

    PORT = 4000
    

  • server.js 에서 환경변수 사용하기

    config()에 아무 것도 넣지 않을경우 .env파일로 인식하는 것 같습니다.
    그리고 PORT 변수를 만들어 process.env.변수명으로 사용해주면 됩니다.

    require("dotenv").config()
    const PORT = process.env.PORT || 4000;
    

• typeDefs, Resolvers 만들기

  서버를 만들기 위해서는 query를 생성해야하고 query를 생성하기 위해서는 Type과 Resolvers가 필요합니다.
  그 Type과 Resolvers를 Server.js안에 우선 만들어보도록 하겠습니다.

  • Type은 styled Components만드는 방식
  • Resolvers는 평볌한 변수 만드는 방식 - query(조회) 와 mutation(추가,수정,삭제)이 있습니다.
  • 그다음에 server를 만들고 typeDefs와 Resolvers를 넣어주고 start해주면 됩니다.

  //typeDefs
  const typeDefs = `
      type Query{
          hello : String!
      }
  `
  //resolvers
  const resolvers = {
      Query : {
          hello : () => "hello"
      }
  }
  const server = new GraphQLServer({typeDefs,resolvers});
  server.start({port : PORT}, () => console.log(`server is running http://localhost:${PORT}`));
  

• 결과

  [nodemon] restarting due to changes...
  [nodemon] starting `babel-node src/server.js`
  [nodemon] restarting due to changes...
  [nodemon] starting `babel-node src/server.js`
  server is running http://localhost:4000
  

주의할 점

dotenv 모듈의 존재 이유에 대해 모르고 강의를 보고 작성하다보니 이해가 안되는 부분이 있었는데, 프로젝트의 환경변수를 설정해주고 그것을 불러와 변수로 사용한다는 개념을 잡고 넘어가니 이해가 잘 됐던 것 같습니다. 강의를 듣더라도 모르는 부분에 있어서 간단히 개념이라도 읽어보고 넘어가는 것이 큰 프로젝트를 clone하는데 많은 도움이 될 것 같습니다.

dotenv 참고사이트