diff --git a/docs/gatsby-config.js b/docs/gatsby-config.js index ec41188..b96e730 100644 --- a/docs/gatsby-config.js +++ b/docs/gatsby-config.js @@ -34,7 +34,6 @@ module.exports = { 'platform/operation-registry', 'platform/editor-plugins', 'platform/tracing', - 'platform/setup-analytics', 'platform/errors', 'platform/integrations' ], @@ -48,6 +47,7 @@ module.exports = { ], References: [ 'references/apollo-config', + 'references/setup-analytics', 'references/apollo-engine', 'references/engine-proxy', 'references/engine-proxy-release-notes' diff --git a/docs/package-lock.json b/docs/package-lock.json index 59cc52d..8f99ce5 100644 --- a/docs/package-lock.json +++ b/docs/package-lock.json @@ -4306,7 +4306,7 @@ }, "css-select": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz", "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=", "requires": { "boolbase": "~1.0.0", @@ -10249,7 +10249,7 @@ "dependencies": { "minimist": { "version": "0.0.10", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz", "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=" }, "wordwrap": { @@ -10574,7 +10574,7 @@ }, "pify": { "version": "2.3.0", - "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", + "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz", "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=" }, "pinkie": { @@ -12406,7 +12406,7 @@ }, "safe-regex": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz", + "resolved": "http://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz", "integrity": "sha1-QKNmnzsHfR6UPURinhV91IAjvy4=", "requires": { "ret": "~0.1.10" @@ -13652,7 +13652,7 @@ }, "through": { "version": "2.3.8", - "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz", + "resolved": "http://registry.npmjs.org/through/-/through-2.3.8.tgz", "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=" }, "through2": { diff --git a/docs/source/tutorial/data-source.md b/docs/source/tutorial/data-source.md index 61f22b7..876ab7a 100644 --- a/docs/source/tutorial/data-source.md +++ b/docs/source/tutorial/data-source.md @@ -1,11 +1,11 @@ --- -title: "2. Hook up your data sources" +title: '2. Hook up your data sources' description: Connect REST and SQL data to your graph --- Time to accomplish: _10 Minutes_ -Now that we've constructed our schema, we need to hook up our data sources to our GraphQL API. GraphQL APIs are extremely flexible, because you can layer them on top of any service, including any business logic, REST APIs, databases, or gRPC services. +Now that we've constructed our schema, we need to hook up our data sources to our GraphQL API. GraphQL APIs are extremely flexible because you can layer them on top of any service, including any business logic, REST APIs, databases, or gRPC services. Apollo makes connecting these services to your graph simple with our data source API. An **Apollo data source** is a class that encapsulates all of the data fetching logic, as well as caching and deduplication, for a particular service. By using Apollo data sources to hook up your services to your graph API, you're also following best practices for organizing your code. @@ -120,7 +120,7 @@ Now that we've connected our REST API successfully, let's connect our database!

Connect a database

-Our REST API is read-only, so we need to connect our graph API to a database for saving and fetching user data. This tutorial uses SQLite for our SQL database, and Sequelize for our ORM. Our `package.json` already entailed these packages, thus they were installed in the first part of this tutorial with `npm install`. Also, since this section contains some SQL-specific code that isn't necessary to understanding Apollo data sources, we've already built a `UserAPI` data source for you in `src/datasources/user.js`. Please navigate to that file so we can explain the overall concepts. +Our REST API is read-only, so we need to connect our graph API to a database for saving and fetching user data. This tutorial uses SQLite for our SQL database, and Sequelize for our ORM. Our `package.json` already included these packages, thus they were installed in the first part of this tutorial with `npm install`. Also, since this section contains some SQL-specific code that isn't necessary to understanding Apollo data sources, we've already built a `UserAPI` data source for you in `src/datasources/user.js`. Please navigate to that file so we can explain the overall concepts.

Build a custom data source

@@ -137,7 +137,7 @@ Let's go over some of the methods we created in `src/datasources/user.js` to fet - `findOrCreateUser({ email })`: Finds or creates a user with a given `email` in the database - `bookTrips({ launchIds })`: Takes an object with an array of `launchIds` and books them for the logged in user - `cancelTrip({ launchId })`: Takes an object with a `launchId` and cancels that launch for the logged in user -- `getLaunchIdsByUser()`: Returns all booked launches for the logged in user. +- `getLaunchIdsByUser()`: Returns all booked launches for the logged in user - `isBookedOnLaunch({ launchId })`: Determines whether the logged in user booked a certain launch

Add data sources to Apollo Server

@@ -160,11 +160,11 @@ const server = new ApolloServer({ typeDefs, dataSources: () => ({ launchAPI: new LaunchAPI(), - userAPI: new UserAPI({ store }), + userAPI: new UserAPI({ store }) }) }); ``` First, we import our `createStore` function to set up our database, as well as our data sources: `LaunchAPI` and `UserAPI`. Then, we create our database by calling `createStore`. Finally, we add the `dataSources` function to our `ApolloServer` to connect `LaunchAPI` and `UserAPI` to our graph. We also pass in our database we created to the `UserAPI` data source. -Now that we've hooked up our data sources to Apollo Server, it's time to move onto the next section and learn how to call our data sources from within our resolvers. +Now that we've hooked up our data sources to Apollo Server, it's time to move on to the next section and learn how to call our data sources from within our resolvers. diff --git a/docs/source/tutorial/introduction.md b/docs/source/tutorial/introduction.md index 4bc3e28..9e5cf28 100644 --- a/docs/source/tutorial/introduction.md +++ b/docs/source/tutorial/introduction.md @@ -40,6 +40,7 @@ The tutorial assumes that you're comfortable with JavaScript/ES6, you've fetched

System requirements

Before we begin, make sure you have: + - [Node.js](https://nodejs.org/) v6.9.0 or greater - [npm](https://www.npmjs.com/) 3.10.8 or greater - [git](https://git-scm.com/) v2.14.1 or greater @@ -49,6 +50,7 @@ While it's not a requirement, we recommend using [VSCode](https://code.visualstu

Set up your development environment

Now the fun begins! First, you'll need to install our developer tools: + - [Apollo Engine (required)](https://engine.apollographql.com) : Our cloud service where you'll register and manage your graph API. - [Apollo DevTools for Chrome (suggested)](https://chrome.google.com/webstore/detail/apollo-client-developer-t/jdkknkkbebbapilgoeccciglkfbmbnfm) : Our Chrome extension giving you full visibility into your client. - [Apollo VSCode (suggested)](https://marketplace.visualstudio.com/items?itemName=apollographql.vscode-apollo): Our editor integration that offers intelligent autocomplete, metrics, and more. @@ -59,7 +61,7 @@ Next, in your terminal, clone [this repository](https://github.com/apollographql git clone https://github.com/apollographql/fullstack-tutorial/ ``` -There are two folders: one for the starting point (`start/`) and one for the final version (`final`). Within each directory are two folders: one for the server and one for the client. We will be working in the server folder first. If you're comfortable with building a graph API already and you want to skip to the client portion, navigate to the [last half of the tutorial](./client.html). +There are two folders: one for the starting point (`start`) and one for the final version (`final`). Within each directory are two folders: one for the server and one for the client. We will be working in the server folder first. If you're comfortable with building a graph API already and you want to skip to the client portion, navigate to the [last half of the tutorial](./client.html).