boilerplate graphql

보일러 플레이트

쿼터에 의해 건축되었습니다

참고 : 이제 업데이트 된 스택을 사용하는 것이 좋습니다.

TypeScript + React + React Native + GraphQL + Prisma

사용자 인증이 포함되어 있습니다

• 반응
• 원시 반응
• 엑스포
• apsgraphql
• 프리즘
• 웹, 앱 및 API Monorepo
• 다음 .js
• TypeScript
• 포스트 그레스
• 아폴로 클라이언트
• 아폴로 서버
• 표현하다
• 후크 형태를 반응합니다
• 차크라 UI
• 사용자 정의 가능한 테마 및 다크 모드
• eslint
• 더 예쁘다
• 그래프 QL 코드 생성기
• sendgrid smtp
• 보초
• 에스키모 개의
• 보풀이 준비되었습니다

& 더 맛있는 간식

이 스택에 익숙합니까?

우리는 고용 중입니다! 여기에서 문의하십시오

시작하세요

노드, 원사, 우편물 및 Redis가 설치되어 있어야하며 로컬로 설정해야합니다.

1. 레포를 복제하십시오

2. 순수한 웹 프로젝트에서 작업하는 경우 앱 폴더를 삭제하십시오.

   rm -rf packages/app

3. 종속성을 설치하십시오.

   yarn install

4. 로컬 Postgres 데이터베이스를 만듭니다

   createdb boilerplate

5. .env 파일을 만들고 로컬 Postgres 데이터베이스 URL로 DATABASE_URL 업데이트하십시오.

   cp packages/api/.env.example  packages/api/.env

    # Replace <user>,<password> and <db-name> with your corresponding username, password, and database name of your postgresql database.
   DATABASE_URL=postgresql:// < user > : < password > @localhost:5432/ < db-name >

6. 데이터베이스를 마이그레이션합니다.

    cd packages/api && yarn db:migrate

우리는 Husky를 사용하여 각 커밋 (Pretier, Eslint & Commitlint)을 몇 번 확인하고 .huskyrc 파일을 홈 디렉토리에 추가하십시오.

touch ~ /.huskyrc

이것을 파일로 복사하십시오.

 export PATH= " /usr/local/bin: $PATH "

그런 다음 프로젝트의 루트에서 이것을 실행하십시오.

npx husky install

우리는 이미지/파일 호스팅에 AWS S3를 사용하므로 작동하려면 몇 가지 사항을 설정해야합니다. 프로세스는 여기에서 찾을 수 있습니다.

개발

1. cd packages/api && yarn dev
2. cd packages/web && yarn dev
3. cd packages/app && yarn start

간단한 TODO 기능을 만드는 예는 여기에서 찾을 수 있습니다.

생산

메일러

• sendgrid 계정을 만들고 .env에서 sendgrid_api_key 환경 변수 설정
• 보내려고하려는 각 이메일에 대한 템플릿 생성 및 해당 메일러 클래스에서 TemplateId를 사용하십시오.

오류 추적

• 각 패키지에 대한 Sentry Account + 프로젝트를 작성하고 DSN을 웹 구성 및 API ENV 변수에 추가하십시오.

전개

예를 들어 여기에 배포됩니다

우리는 API 패키지에 철도를 사용하고 웹 패키지에는 Vercel을 사용하고 있습니다.

철도의 경우 미리보기 배포를 설정하고 웹에서 사용할 수있는 동적 URL을 제공합니다. URL에는 PR 번호가 포함되어 있으므로 웹에서 GIT에서 PR 번호를 가져 와서 다음.js 앱을 구축 할 때 API_URL을 동적으로 변경해야합니다. Vercel은 ENV 변수에 PR 번호를 포함하지 않으므로 패키지를 사용하여 우리를 위해이를 수행합니다.