Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

Commit c6b7746

Browse files
committed
docs(cookbook/graphql): Change guide to include a working server from the start
1 parent 826efe6 commit c6b7746

File tree

1 file changed

+15
-11
lines changed

1 file changed

+15
-11
lines changed

public/docs/ts/latest/cookbook/graphql.jade

+15-11
Original file line numberDiff line numberDiff line change
@@ -274,6 +274,19 @@ code-example(language="sh" class="code-shell").
274274
of `ApolloClient`, call its constructor with different parameters.
275275
Go to the [Apollo documentation](http://dev.apollodata.com/angular2/initialization.html#creating-client) for further resources.
276276

277+
:marked
278+
Usually you need to query an existing server.
279+
The server for this guide is based on the [Tour of Heroes](ts/latest/tutorial/) app.
280+
The starter app already has an in-memory GraphQL server prepared.
281+
282+
Now all that's left is to connect the in-memory server to the Apollo Client configuration
283+
by importing `networkInterface` and adding it to the `client` constant in `client.ts`.
284+
+makeExample('heroes-graphql/ts/src/app/client.ts', '', 'client.ts')
285+
.l-sub-section
286+
:marked
287+
In order to learn how to create the GraphQL server for this example, follow the instructions on
288+
[Appendix: Setting up a GraphQL server](#server).
289+
277290
:marked
278291
After initializing the Apollo Client, import the `ApolloModule` and `getClient`
279292
which you just configured in `client.ts` into the app's root module:
@@ -302,21 +315,12 @@ code-example(language="sh" class="code-shell").
302315
mutations, which are _actions_ that you
303316
can call on the server, similar to a POST request in REST.
304317

305-
Here is an example schema:
318+
Here is the schema the Tour of Heroes server in the app use:
306319

307320
+makeExample('heroes-graphql/ts/src/app/in-memory-graphql.ts', 'graphql-schema', 'Tour of heroes schema')
308321

309-
.l-sub-section
310-
:marked
311-
Usually you need to query an existing server.
312-
313-
The server for this guide is based on the [Tour of Heroes](ts/latest/tutorial/) app.
314-
315-
In order to create the GraphQL server for this example, follow the instructions on
316-
[Appendix: Setting up a GraphQL server](#server).
317-
318322
:marked
319-
Once you have a server, to start querying data, begin by importing `Apollo` into `heroes.component.ts`,
323+
Once you have a server, which is prepared already in this app, to start querying data, begin by importing `Apollo` into `heroes.component.ts`,
320324
and injecting it into the constructor:
321325
+makeExample('heroes-graphql/ts/src/app/heroes.component.ts', 'import-apollo', 'heroes.component.ts (excerpt)')
322326
+makeExample('heroes-graphql/ts/src/app/heroes.component.ts', 'inject-apollo', 'heroes.component.ts (excerpt)')

0 commit comments

Comments
 (0)