React GraphQL 프로젝트용 풀스택 템플릿

지난 주에 우리는 TypeScript에서 기본 GraphQL 서버 구현을 살펴보았습니다. 이 에피소드에서 ...

GraphQL Server in under 5 minutes series

... React GraphQL 앱의 전체 스택 템플릿을 살펴보겠습니다.



Fullstack React GraphQL Boilerplate 리포지토리에는 최소, 기본 및 고급 상용구가 포함되어 있으며 간단한 "Hello world!"또는 완전한 기능을 갖춘 엔터프라이즈 앱.



Minimal
Basic
Advanced



확장 가능한 GraphQL 서버: 서버는 Apollo Server & Express를 기반으로 하는 graphql-yoga를 사용합니다.
✔️
✔️
✔️

사전 구성된 Apollo 클라이언트: 이 프로젝트는 Apollo 클라이언트용으로 사전 구성된 설정과 함께 제공됩니다.
✔️
✔️
✔️

GraphQL 데이터베이스: Prisma에 대한 GraphQL 데이터베이스 바인딩 포함(MySQL에서 실행)
❌
✔️
✔️

도구: GraphQL Playground 및 쿼리 성능 추적에 대한 기본 지원
❌
✔️
✔️

확장 가능: 단순하고 유연한 데이터 모델 - 조정 및 확장이 용이함
❌
✔️
✔️

구성 오버헤드 없음: 사전 구성된 graphql-config 설정
❌
✔️
✔️

시작하기

minimal 상용구는 단 두 개의 명령입니다. 그냥 가십시오:

npm install -g graphql-cli
graphql create my-app

그러면 yarn start 또는 npm run start가 localhost:4000에서 기본 GraphQL 서버를 시작합니다. 기본 및 고급 설정에는 몇 단계가 더 필요합니다.

GraphQL CLI 설치 후 다음을 사용하여 GraphQL 서버를 부트스트랩합니다.

graphql create my-app

프롬프트가 표시되면 원하는 상용구를 선택하고 Prisma 서비스를 _public cluster_에 배포한 다음 새 프로젝트의 server 디렉토리로 이동하여 시작합니다.

cd my-app/server

yarn dev

그러면 GraphQL Playground와 함께 localhost:4000에서 서버가 실행됩니다. 새 터미널 탭을 열고 my-app로 다시 이동한 다음 앱을 실행합니다.

cd ..
yarn start

react-fullstack-graphql repo 에서 프로젝트 구조 또는 사용 가능한 명령에 대해 자세히 읽어보십시오.


출처: react-fullstack-graphql