전체 스택 Starterkit - 확장 가능한 GraphQL 최초의 상용구

새로 시작한 프로젝트에 대한 상용구 구성은 지루하고 반복 가능한 작업입니다 ... @karanpratapsingh 덕분에 잊을 수 있습니다. 그가 함께 일한 코드베이스 및 개발자. 몇 번의 클릭만으로 React에서 GraphQL 첫 번째 앱을 부트스트랩할 수 있도록 하는 모든 것입니다.

간단한 개인 프로젝트를 시작하든 기업 앱을 시작하든 관계없이 훌륭한 아키텍처 패턴을 따르는 확장 가능한 전체 스택 스타터 키트를 얻게 되며 이는 프로젝트가 성장함에 따라 매우 중요합니다.

기술 스택

React(TypeScript 사용) - 프런트엔드 부분은 오류를 포착하는 데 많은 시간을 절약할 수 있는 유형을 제공하는 JavaScript 확장인 TypeScript를 사용하는 React에 의해 구동됩니다.

GraphQL(Apollo 포함) - 처음에 이미 언급했듯이 가장 인기 있는 GraphQL 구현인 Apollo를 사용하는 GraphQL 첫 번째 접근 방식입니다

.

Prisma - Prisma는 자동 생성 쿼리 빌더로 데이터베이스에 쉽게 액세스할 수 있는 오픈 소스 최신 ORM입니다. 이 스타터킷에서는 PostgreSQL에 사용되기 시작했지만 제안 사항이 열려 있으므로 여기에서 다른 ORM 또는 드라이버를 보려면 PR을 제출하십시오

.

Jest - Jest는 JavaScript-based Testing Framework React 및 TypeScript를 비롯한 다양한 언어 및 프레임워크에서 잘 작동합니다. 상용구는 단순성이 Jest의 최고 원칙 중 하나이므로 향후 모듈을 위해 쉽게 확장할 수 있는 샘플 테스트와 함께 제공됩니다.

프로젝트 아키텍처

라이브러리는 모노 리포지토리를 데이터베이스 연결, GraphQL 부분 등을 담당하는 패키지로 쉽게 분할할 수 있는 원사 작업 공간을 사용하고 있습니다. GraphQL을 자체 마이크로 서비스 집합으로 분할하도록 선택하면 정말 유용합니다. 패키지는 아래와 같이 구성되어 있습니다.




출처: karanpratapsingh/fullstack-starterkit

시작하기

다음 GraphQL+React 프로젝트를 시작할 준비가 되었으면 해당 디렉터리에 있는 .env 파일 다음에 backend/.env 및 web/.env 모두에서 .env.template 파일을 생성하는 것으로 시작합니다. 다음 단계는 종속성을 설치하는 것입니다. 저자는 이 상용구가 yarn를 많이 사용하므로 npm 대신 yarn workspaces를 사용할 것을 권장합니다. 백엔드 및 프런트엔드를 실행하려면 다음을 사용하세요.

yarn start:backend
yarn start:web

그러나 라이브러리 작성자가 언급한 대로 언제든지 변경되거나 삭제될 수 있으므로 DATABASE_URL의 기본 항목이 아닌 사용자 고유의 항목.env.template을 제공해야 합니다. GraphQL의 첫 풀스택 상용구 아이디어가 마음에 든다면 메인테이너에게 사랑과 leave a star를 보여주세요 :)

GraphQL 스키마 개발 속도 향상

GraphQL Editor는 고급 GraphQL 사용자와 GraphQL API를 처음 사용하는 사용자 모두를 지원하는 도구입니다. GraphQL용 올인원 개발 환경은 GraphQL API를 훨씬 빠르게 구축, 관리 및 배포하는 데 도움이 됩니다. Try GraphQL Editor for free!