Refactor every code-first example to leverage resolve (#4372)

This refactors the code-first examples to use inline-resolvers rather
than the root-value to show a difference between SDL and code-first.

Author: JoviDeCroock

website/pages/docs/authentication-and-express-middleware.mdx

@@ -61,7 +61,14 @@ const {
 const schema = new GraphQLSchema({
   query: new GraphQLObjectType({
     name: 'Query',
-    fields: { ip: { type: GraphQLString } },
+    fields: { 
+      ip: { 
+        type: GraphQLString,
+        resolve: (_, args, context) => {
+          return context.ip;
+        }
+      } 
+    },
   }),
 });
 
@@ -70,28 +77,21 @@ function loggingMiddleware(req, res, next) {
   next();
 }
 
-const root = {
-  ip(args, context) {
-    return context.ip;
-  },
-};
-
 const app = express();
 app.use(loggingMiddleware);
 app.all(
   '/graphql',
   createHandler({
     schema: schema,
-    rootValue: root,
     context: (req) => ({
       ip: req.raw.ip,
     }),
   }),
 );
 app.listen(4000);
 console.log('Running a GraphQL API server at localhost:4000/graphql');
-````
 
+```
   </Tabs.Tab>
 </Tabs>
 

website/pages/docs/basic-types.mdx

@@ -39,7 +39,7 @@ const root = {
     return Math.random();
   },
   rollThreeDice() {
-    return [1, 2, 3].map((\_) => 1 + Math.floor(Math.random() \* 6));
+    return [1, 2, 3].map((_) => 1 + Math.floor(Math.random() * 6));
   },
 };
 
@@ -73,33 +73,27 @@ const schema = new GraphQLSchema({
   query: new GraphQLObjectType({
     name: 'Query',
     fields: {
-      quoteOfTheDay: { type: GraphQLString },
-      random: { type: GraphQLFloat },
-      rollThreeDice: { type: new GraphQLList(GraphQLFloat) },
+      quoteOfTheDay: { 
+        type: GraphQLString,
+        resolve: () => Math.random() < 0.5 ? 'Take it easy' : 'Salvation lies within'
+      },
+      random: { 
+        type: GraphQLFloat,
+        resolve: () => Math.random()
+      },
+      rollThreeDice: { 
+        type: new GraphQLList(GraphQLFloat),
+        resolve: () => [1, 2, 3].map((_) => 1 + Math.floor(Math.random() * 6))
+      },
     },
   }),
 });
 
-// The root provides a resolver function for each API endpoint
-const root = {
-  quoteOfTheDay() {
-    return Math.random() < 0.5 ? 'Take it easy' : 'Salvation lies within';
-  },
-  random() {
-    return Math.random();
-  },
-  rollThreeDice() {
-    return [1, 2, 3].map((_) => 1 + Math.floor(Math.random() * 6));
-  },
-};
-
 const app = express();
-
 app.all(
   '/graphql',
   createHandler({
     schema: schema,
-    rootValue: root,
   }),
 );
 

website/pages/docs/constructing-types.mdx

@@ -86,7 +86,7 @@ const userType = new graphql.GraphQLObjectType({
   },
 });
 
-// Define the Query type
+// Define the Query type with inline resolver
 const queryType = new graphql.GraphQLObjectType({
   name: 'Query',
   fields: {

website/pages/docs/getting-started.mdx

@@ -28,7 +28,7 @@ npm install graphql --save
 
 ## Writing Code
 
-To handle GraphQL queries, we need a schema that defines the `Query` type, and we need an API root with a function called a “resolver” for each API endpoint. For an API that just returns “Hello world!”, we can put this code in a file named `server.js`:
+To handle GraphQL queries, we need a schema that defines the `Query` type, and we need an API root with a function called a "resolver" for each API endpoint. For an API that just returns "Hello world!", we can put this code in a file named `server.js`:
 
 <Tabs items={['SDL', 'Code']}>
   <Tabs.Tab>
@@ -54,7 +54,7 @@ graphql({
     console.log(response);
   });
 
-````
+```
 </Tabs.Tab>
 <Tabs.Tab>
 ```javascript
@@ -65,29 +65,22 @@ const schema = new GraphQLSchema({
   query: new GraphQLObjectType({
     name: 'Query',
     fields: {
-      hello: { type: GraphQLString },
+      hello: { 
+        type: GraphQLString,
+        resolve: () => 'Hello world!'
+      },
     },
   }),
 });
 
-// The rootValue provides a resolver function for each API endpoint
-const rootValue = {
-  hello() {
-    return 'Hello world!';
-  },
-};
-
-// Run the GraphQL query '{ hello }' and print out the response
 graphql({
   schema,
   source: '{ hello }',
-  rootValue,
 }).then((response) => {
   console.log(response);
 });
-````
-
-  </Tabs.Tab>
+```
+</Tabs.Tab>
 </Tabs>
 
 If you run this with:
@@ -108,4 +101,4 @@ You should see the GraphQL response printed out:
 
 Congratulations - you just executed a GraphQL query!
 
-For practical applications, you'll probably want to run GraphQL queries from an API server, rather than executing GraphQL with a command line tool. To use GraphQL for an API server over HTTP, check out [Running an Express GraphQL Server](./running-an-express-graphql-server).
+For practical applications, you'll probably want to run GraphQL queries from an API server, rather than executing GraphQL with a command line tool. To use GraphQL for an API server over HTTP, check out [Running an Express GraphQL Server](./running-an-express-graphql-server).