next react graphql apollo hooks

고성능 Next + React + GraphQL 스타터 키트

이 스타터 키트의 목적은 완전한 솔루션이 아니라 Next.js, React 및 GraphQL을 사용하여 고성능 웹 사이트를 만들기위한 소개입니다. 우리는이 저장소를 Atheros Intelligence의 새로운 프로젝트에 사용하고 GraphQL Mastery의 기사 저장소로 사용합니다.

• git clone [email protected]:atherosai/next-react-graphql-apollo-hooks.git 으로 저장소를 복제하십시오
• package-lock.json 의 안전한 종속성을 보존하려면 npm ci 사용하여 패키지를 설치하십시오.

node.js 버전

스타터 키트는 이전 Node 버전과 함께 작동해야하지만 최신 노드 LTS version 사용하는 것이 좋습니다. package.json . 우리는 다음과 같이 요구 사항을 설정합니다.

 "engines" : {
    "node" : " >=10.0.0 " ,
    "npm" : " >6 "
  },

기술 및 주요 기능

• 다음 .js
• 반응
• GraphQL (Apollo Server)
• 아폴로 클라이언트
• 아폴로 후크에 반응합니다
• node.js
• TypeScript
• 그래프 QL 코드 생성기
• 농담

생산 사용

최상의 성능을 달성하려면 HTTP/2를 활성화하고 리버스 프록시 (NGINX)에서 압축을 가능하게해야합니다. 최신 Node.js 서버도 매우 이익이됩니다.

환경 구성

환경 변수에 대한 솔루션은 DOTENV 라이브러리와 두 가지 환경 변수를 사용하여 구축됩니다. 잘 알려진 NODE_ENV 변수는 development 또는 production 및 환경을 정의하는 CUSTOM_ENV 로 설정할 수 있습니다. 이것은 staging , production , local 환경 또는 빌드 서버 일 수 있습니다. 이 두 변수는 사용될 .env 파일 /secrets 폴더의 이름을 정의합니다. 예를 들어 준비 환경에 대한 구성을 정의하려면 /secrets/production-staging.env 라는 파일을 만들고 모든 환경 변수를 거기에 배치합니다. 이러한 파일의 예는 예를 들어 개발에 사용할 수있는 다음과 같은 것일 수 있습니다.

NODE_ENV=development
CUSTOM_ENV=local
PORT=3000
API_URL=http://localhost:3000/graphql
HOST=http://localhost:3000

보안 및 감사

의존성에 대한 보안 감사를 실행할 수 있습니다. 저장소에서 package-lock.json 사용해야합니다.

npm audit