Prepation

npm init

See More https://graphql-code-generator.com/docs/getting-started/installation

npm add --save graphql

or

yarn add graphql

npm add --save-dev @graphql-codegen/cli

or

yarn add -D @graphql-codegen/cli

npx graphql-codegen init

npm add --save-dev @graphql-codegen/typescript

or

yarn add -D @graphql-codegen/typescript

Server

npm add apollo-server

npm install @types/node --save-dev

npx tsc --init --rootDir src --outDir build \
--esModuleInterop --resolveJsonModule --lib es6 \
--module commonjs --allowJs true --noImplicitAny true

npm install --save-dev ts-node nodemon rimraf

UI

• init new Angular project ng new frontend

npm i
npm add apollo-angular
ng add apollo-angular
npm add graphql
npm add --save-dev @graphql-codegen/cli
npm i

• init codegen npx graphql-codegen init npm i
• check angular
• use url “http://localhost:400”
• fragment path default
• plugin default

• output default

• set uri in graphql module

• move

  • graphql.module

Pizza component

ng add @angular/material
(style - default)

ng g c pizza-list

• copy
  • app.module.ts
  • app.component.ts
  • styles.css