백엔드 서버에 DEV.를 복제하여 현실 세계로의 여행(3부)

In the last series we have installed the required minimum dependencies to setup our project as we will move further in this project we will install our required dependencies according to requirement.

Apollo 서버는 스키마 우선 접근 방식을 사용하여 더 작은 프로젝트에서 큰 문제를 생성하지 않는 graphql 쿼리를 작성하지만 프로젝트가 성장하고 스키마에 더 나은 유형이 필요한 경우 graphql 스키마를 작성하기 위한 코드 우선 접근 방식인 nexus schema를 거쳐야 합니다.

In this project we will use apollo server schema first approach for simplicity and we will explore the Query , Mutation and Subscription to design our application.

먼저 javascript와 postgresql로 prisma를 설정합니다.
typescript 또는 다른 데이터베이스에 대해 prisma를 설정하려면 탐색할 수 있습니다here.

우리는 이미 이전 시리즈에서 dev 의존성으로 prisma를 설치했습니다. 디지털 오션의 this 블로그 게시물을 사용하여 우분투에서 postgresql을 설정할 수 있습니다.

프로젝트 devblog_server의 루트에서 터미널을 열고 prisma 프로젝트를 생성합니다.

npx prisma init

이것은 prisma 파일schema.prisma이 포함된 폴더schema.prisma를 포함하는 완전히 새로운 프리즈마 프로젝트를 초기화할 것입니다. 테이블을 생성하고 모든 유형의 데이터베이스에 연결하려면 이 파일에서 전체 구성 및 모델 생성을 수행할 수 있습니다.
prisma init 또한 .env 파일을 생성함을 알 수 있습니다. .env 파일은 응용 프로그램에 필요한 비밀을 저장하는 경우에 유용한 구성 파일입니다. nodejs에서 작업하는 경우 pnpm add dotenv를 사용하여 수동으로 설치할 수 있습니다. 그러나 prisma는 종속 항목에 자동으로 설치하므로 여기에 설치할 필요가 없습니다.
.env 파일을 열면 데이터베이스에 연결하기 위해 prisma가 생성하는 필드가 하나 있습니다. 여기서는 postgresql을 사용하여 다음과 같이 보일 것입니다.

DATABASE_URL="postgresql://postgres:harsh12345@localhost:5432/devblog"

DATABASE_URL is field that can used as a environment variable in our nodejs file to get data stored in itpostgres:harsh12345에는 postgresql 사용자 이름과 암호username:password가 포함되어 있으며 다른 사용자에 대한 역할을 포함하는 인증 흐름과 같은 UNIX를 사용합니다.
@localhost:5432는 postgresql 서버가 실행되고 있는 호스트 및 포트입니다.
devblog는 첫 번째 마이그레이션을 적용할 때 prisma가 자동으로 생성할 데이터베이스 이름입니다.

do not push .env file to github always add .env in you .gitignore file because it contain all of your secrets and connection url when we will deploy this project we will see how we will use heroku postgres url for now we will use local postgres server on machine.

프로젝트를 위한 폴더 구조를 생성해 보겠습니다. 모든 사람은 프로젝트 구조를 만드는 고유한 방법이 있습니다. 나는 또한 그것을 구성하는 내 자신의 방법을 따릅니다. 확장할 수 있고 향후 새로운 기능을 쉽게 추가할 수 있도록 이렇게 만들었습니다.

먼저 루트 수준에 src/ 디렉터리를 만듭니다. 우리의 루트 레벨은 devblog_server 입니다.
그런 다음 서버를 구성할 파일server.js을 만듭니다.
server.js

const { ApolloServer ,gql} = require("apollo-server-express");
const context = require("./context");
const http = require("http");
const express = require("express");
const { PORT } = require("./config");

const typeDefs  = gql`
type Query {
   hello : String!
}

`
const resolvers = {
 Query :{
     hello(){
   return "welcome the real world"
    }
 }

async function startApolloServer() {
  const app = express();

  const server = new ApolloServer({
    typeDefs,
    resolvers,
    context,
    tracing: true, // tracing trace our request and response time and much more.
  });
  await server.start();


  server.applyMiddleware({ app });

// testing for REST endpoints through express server

  app.use((req, res, next) => {
    return res.status(200).json({
      success: true,
      message: "Express server up & running",
    });
  });

  const httpServer = http.createServer(app);

  server.installSubscriptionHandlers(httpServer);

  await new Promise((resolve) => httpServer.listen(PORT, resolve));
  console.log(`🚀 Express Server ready at http://localhost:${PORT}`);
  console.log(
    `🚀 Graphql Server ready at http://localhost:${PORT}${server.graphqlPath}`
  );
  console.log(
    `🚀 Subscriptions ready at ws://localhost:${PORT}${server.subscriptionsPath}`
  );
}

startApolloServer();

위에서 우리는 모든 구독, 변형 및 쿼리를 처리하기 위해 Apollo 서버, 익스프레스 서버 및 기본 nodejs http 서버를 가져오고 인스턴스화했습니다.
tracing는 morgan과 비슷하고 심지어 더 좋습니다. REST 세계에서 우리는 morgan를 사용하여 req 및 res 시간 추적을 기록하고 graphql 놀이터에서 동일한 작업을 수행합니다. 첫 번째 서버를 시작할 때 다음 시리즈에서 graphql 놀이터를 보게 될 것입니다.

생성context.js and config.js in src/ foldercontext.js

const prisma = require("./prisma");

module.exports = ({ req, res }) => {


  return {
    prisma,
  };
};

여기에서 우리는 prisma를 가져오고 apollo 서버의 컨텍스트로 전달하여 모든 리졸버에서 prisma를 사용할 수 있도록 합니다.

Be careful do not create new instance of PrismaClient in your every resolvers because it will impact your application performance . you can read about performance optimization in prisma docs here.

config.js

exports.PORT = process.env.PORT

.env

...
PORT=4000

we knew that when we will deploy our backend on heroku their PORT randomly assigned hence there PORT will automatically configured using heroku environment variable

다음 시리즈에서는 localhost에서 서버를 시작하고 사용자 및 포스트 모델을 생성하여 첫 번째 마이그레이션을 적용합니다.