Fullstacking: GraphQL ↔ KoaJS
Tags: node, graphql
Published: 2019-09-02 11:37:41

We have our [server](https://dev.to/heymarkkop/fullstacking-connecting-nodejs-mongodb-32l4) running on localhost:3000. We will now apply GraphQL into it by following this tutorial: [How to set up a powerful API with GraphQL, Koa, and MongoDB](https://medium.com/better-programming/how-to-setup-a-powerful-api-with-graphql-koa-and-mongodb-339cfae832a1). I'll post how files should be coded for our current project.

## GraphQL ↔ NodeJS + KoaJS


```javascript
// server.js
const Koa = require('koa');
const mongoose = require('mongoose');
const mount = require('koa-mount');
const graphqlHTTP = require('koa-graphql');
const schema = require('./graphql/schema');

const app = new Koa();

mongoose.connect('mongodb://127.0.0.1:27017/test', {useNewUrlParser: true});

app.use(mount('/graphql', graphqlHTTP({
  schema: schema,
  graphiql: true
})))

module.exports = app.listen(3000, () =>
  console.log('Running on http://localhost:3000/'),
);

```
```javascript
// graphql/productType.js
const graphql = require('graphql');

const {GraphQLObjectType, GraphQLString} = graphql;

const ProductType = new GraphQLObjectType({
  name: 'Product',
  fields: () => ({
    id: {type: GraphQLString},
    title: {type: GraphQLString},
  }),
});

module.exports = ProductType;

```
```javascript
// graphql/schema.js
const {buildSchema} = require('graphql');
const {GraphQLSchema, GraphQLObjectType, GraphQLString} = require('graphql');
const productGraphQLType = require('./productType');
const Product = require('../models/Product');

const schema = buildSchema(`
  type Query {
    hello: String
  }
`);

const RootQuery = new GraphQLObjectType({
  name: 'RootQueryType',
  fields: {
    product: {
      type: productGraphQLType,
      args: {id: {type: GraphQLString}},
      resolve(parent, args) {
        return Product.findById(args.id);
      },
    },
  },
});

module.exports = new GraphQLSchema({
  query: RootQuery,
});

```
```javascript
// database.js
const mongoose = require('mongoose');

const initDB = () => {
  mongoose.connect('mongodb://127.0.0.1:27017/test', {useNewUrlParser: true});

  mongoose.connection.once('open', () => {
    console.log('connected to database');
  });
};

module.exports = initDB;

```
```javascript
// models/Product.js
var mongoose = require('mongoose');

const ProductSchema = new mongoose.Schema({
  title: String,
});

module.exports = mongoose.model('Product', ProductSchema);
```

Then by running `server.js` and acessing [localhost:3000/graphql](http://localhost:3000/graphql) we can query
```graphql
{
  product(id: "5d67d3b89cba659baebb9765") {
    title
  }
}
```
and get
```json
{
  "data": {
    "product": {
      "title": "Stampler"
    }
  }
}
```


![http://localhost:3000/graphql printscreen](https://miro.medium.com/max/2556/1*Upmr4kMaSUBKSmB0srbfmA.png)

## References:
* [How to set up a powerful API with GraphQL, Koa, and MongoDB](https://medium.com/better-programming/how-to-setup-a-powerful-api-with-graphql-koa-and-mongodb-339cfae832a1)
* [Tagged Template Literals](https://mxstbr.blog/2016/11/styled-components-magic-explained/)
* [Relay - Installation and Setup](https://relay.dev/docs/en/installation-and-setup)
* [React - Adding Relay](https://create-react-app.dev/docs/adding-relay)