# Server

- start creating types in schema.ts

```typescript
import gql from "graphql-tag";
export const pizzaSchema = gql``;
```

- create types and querys
- show generated code

- create index.ts

- index.ts
```typescript
  import { ApolloServer } from "apollo-server/dist";
  const server = new ApolloServer({});
    server.listen().then(({ url, subscriptionsUrl }) => {
        console.log(`🚀 Server ready at ${url}`)
        console.log(`🚀 Subscriptions ready at ${subscriptionsUrl}`);
});
```
- show playground and run listPizza
- create resolve config with empty array
- create pizza list
- create pizzaResolver.ts
- add read/list function
- add resolver to resolver config
- show get and list
- add toppings
    - add list
    - add resolver
    - add toppings to pizza mocks
- show type resolvers
- show Mutation
- show Subscription

- show finished api

# UI

- init new Angular project

```
git clone git@ziermach.de:cziermann/angular-demo-template.git
```

```
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