Provide people with tabs so they can use classes as well

Author: JoviDeCroock

website/pages/getting-started.mdx

@@ -3,6 +3,8 @@ title: Getting Started With GraphQL.js
 sidebarTitle: Getting Started
 ---
 
+import { Tabs } from 'nextra/components';
+
 {/* title can be removed in Nextra 4, since sidebar title will take from first h1 */}
 
 # Getting Started With GraphQL.js
@@ -19,7 +21,7 @@ and arrow functions, so if you aren't familiar with them you might want to read
 
 To create a new project and install GraphQL.js in your current directory:
 
-```bash
+```sh npm2yarn
 npm init
 npm install graphql --save
 ```
@@ -28,18 +30,48 @@ npm install graphql --save
 
 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`:
 
-```javascript
-let { graphql, buildSchema } = require('graphql');
+<Tabs items={['Template', 'Classes']}>
+  <Tabs.Tab>
+  ```javascript
+  const { graphql, buildSchema } = require('graphql');
 
 // Construct a schema, using GraphQL schema language
-let schema = buildSchema(`
-  type Query {
-    hello: String
-  }
-`);
+const schema = buildSchema(` type Query { hello: String } `);
+
+// 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>
+```javascript
+const { graphql, buildSchema } = require('graphql');
+
+// Construct a schema
+const schema = new GraphQLSchema({
+  query: new GraphQLObjectType({
+    name: 'Query',
+    fields: {
+      hello: { type: GraphQLString },
+    },
+  }),
+});
 
 // The rootValue provides a resolver function for each API endpoint
-let rootValue = {
+const rootValue = {
   hello() {
     return 'Hello world!';
   },
@@ -53,7 +85,10 @@ graphql({
 }).then((response) => {
   console.log(response);
 });
-```
+````
+
+  </Tabs.Tab>
+</Tabs>
 
 If you run this with:
 

website/pages/running-an-express-graphql-server.mdx

@@ -3,6 +3,8 @@ title: Running an Express GraphQL Server
 sidebarTitle: Running Express + GraphQL
 ---
 
+import { Tabs } from 'nextra/components';
+
 The simplest way to run a GraphQL API server is to use [Express](https://expressjs.com), a popular web application framework for Node.js. You will need to install two additional dependencies:
 
 ```bash
@@ -11,6 +13,7 @@ npm install express graphql-http graphql --save
 
 Let's modify our “hello world” example so that it's an API server rather than a script that runs a single query. We can use the 'express' module to run a webserver, and instead of executing a query directly with the `graphql` function, we can use the `graphql-http` library to mount a GraphQL API server on the “/graphql” HTTP endpoint:
 
+
 ```js
 const express = require('express');
 const { createHandler } = require('graphql-http/lib/use/express');