I am looking for people who are able to migrate this boilerplate project to different tech stacks. If you want to collaborate on this, please reach out to me on [email protected] Also considering to compensate your open source work that would help this GitHub organization tremendously.

Scenario

For instance, this project is using PostgreSQL with Sequelize. But what about an alternative project using MongoDB with Mongoose? As starting point, I copied this repository over here to give people a chance to migrate it over to MongoDB + Mongoose. You can fork the repository, migrate it, and open a PR for it.

I guess the only files that need to be changed are the ones in the folders resolvers/ and the models/. Maybe also the seeding of the database in src/index.js and the testing setup in package.json.

Guidelines

The twin repositories shouldn't be any different from this original repository except for the exchanged tech stack. If you want to introduce any other improvements, let's discuss and at least do it afterward so that this repository can keep up with the improvements as well.

I want to keep the repositories almost identical to provide an extended GraphQL server tutorial in the end. So far, the tutorial only covers PostgreSQL with Sequelize for a GraphQL server. But once a MongoDB + Mongoose boilerplate project would be ready, I would add additional chapter to the tutorial.

If the DATABASE_URL env var is defined we act like we are in production. When we are in production we wipe the db if the api restarts.

1. env var DATABASE_URL should not imply production
2. do not wipe db if we are in production
3. factor out the seeding step into a separate file while we are at it.

Relevant code https://github.com/the-road-to-graphql/fullstack-apollo-express-postgresql-boilerplate/blob/master/src/index.js#L94

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

If you run into any problems with bcrypt on Windows while installing it, you can try out a substitute called bcrypt.js. It is slower, but people reported that it works on their machine.

Just want to start off by thanking you @rwieruch for your amazing tutorial. It's definitely the most comprehensive tutorial I've ever read on the subject.

I'm running into a problem with my server after finishing up the Authorization section of the Tutorial. I'm unable to run the query in the following section GraphQL Custom Scalars in Apollo Server and get the following error below.

I've tried to revisit the codebase here and copy it back page by page to see which (if any) would've caused the problem, but after cloning the whole repository again, I'm still getting the same issue. Any help helping me understand what's going on would be greatly appreciated.

This is the query in question:

query {
  message(id: "1") {
    id
    createdAt
    user {
      username
    }
  }
}

This is the error I'm getting and where:

{
  "errors": [
    {
      "message": "models.Message.findById is not a function",
      "locations": [
        {
          "line": 2,
          "column": 3
        }
      ],
      "path": [
        "comment"
      ],
      "extensions": {
        "code": "INTERNAL_SERVER_ERROR",
        "exception": {
          "stacktrace": [
            "TypeError: models.Message.findById is not a function",
            "    at findById (/Users/user/Documents/Self/BFF/src/resolvers/message.js:11:35)",

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

The dependency pg was updated from 7.10.0 to 7.11.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

pg is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

There have been updates to the apollo-server monorepo:

• • The dependency apollo-server-express was updated from 2.4.8 to 2.5.0.

• The dependency apollo-server was updated from 2.4.8 to 2.5.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the apollo-server group definition.

apollo-server is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

hi,

i just noticed, when you log in successfully , the session is going undefined and because of it the navigation options are not getting updated after history push , but when you reload the page it will update the ui and you can see the session variables filled with the data too.

.

Playground somehow displays another representation of the timestamps then expected.

With this query:
query { message(id: "1") { text createdAt } }

I get this as result:
{ "data": { "message": { "text": "Published the Road to learn React", "createdAt": "1539693730039" } } }

There have been updates to the babel7 monorepo:

• • The devDependency @babel/core was updated from 7.4.3 to 7.4.4.

• The devDependency @babel/node was updated from 7.2.0 to 7.2.2.
• The devDependency @babel/preset-env was updated from 7.4.3 to 7.4.4.
• The devDependency @babel/register was updated from 7.4.0 to 7.4.4.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the babel7 group definition.

babel7 is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

modern node runtimes have full support for async await. node 10x LTS has this. This project uses node 10 already.

Remove babel dependency.

When I use the following from the example

  const users = await models.User.findAll({
    where: {
      id: {
        $in: keys,
      },
    },
  });

I get the following error

{
  "errors": [
    {
      "message": "Invalid value { '$in': [ 1, 2, 3 ] }",
      "locations": [
        {
          "line": 4,
          "column": 5
        }
      ],
      "path": [
        "accounts",
        0,
        "user"
      ],
      "extensions": {
        "code": "INTERNAL_SERVER_ERROR",
        "exception": {
          "stacktrace": [
            "Error: Invalid value { '$in': [ 1, 2, 3 ] }",
            "    at Object.escape (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/sql-string.js:66:11)",
            "    at Object.escape (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/dialects/abstract/query-generator.js:936:22)",
            "    at Object._whereParseSingleValueObject (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/dialects/abstract/query-generator.js:2432:41)",
            "    at Object.whereItemQuery (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/dialects/abstract/query-generator.js:2136:21)",
            "    at Utils.getComplexKeys.forEach.prop (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/dialects/abstract/query-generator.js:1997:25)",
            "    at Array.forEach (<anonymous>)",
            "    at Object.whereItemsQuery (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/dialects/abstract/query-generator.js:1995:35)",
            "    at Object.getWhereConditions (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/dialects/abstract/query-generator.js:2459:19)",
            "    at Object.selectQuery (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/dialects/abstract/query-generator.js:1143:28)",
            "    at QueryInterface.select (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/query-interface.js:1105:27)",
            "    at Promise.try.then.then.then (/Users/***/Documents/code/*** /***-server/node_modules/sequelize/lib/model.js:1598:34)",
            "    at tryCatcher (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/util.js:16:23)",
            "    at Promise._settlePromiseFromHandler (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/promise.js:512:31)",
            "    at Promise._settlePromise (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/promise.js:569:18)",
            "    at Promise._settlePromise0 (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/promise.js:614:10)",
            "    at Promise._settlePromises (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/promise.js:694:18)",
            "    at _drainQueueStep (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/async.js:138:12)",
            "    at _drainQueue (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/async.js:131:9)",
            "    at Async._drainQueues (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/async.js:147:5)",
            "    at Immediate.Async.drainQueues [as _onImmediate] (/Users/***/Documents/code/*** /***-server/node_modules/bluebird/js/release/async.js:17:14)",
            "    at processImmediate (timers.js:632:19)"
          ]
        }
      }
    }
  ],
  "data": {
    "accounts": null
  }
}

if I change it to the following then everything works

  const users = await models.User.findAll({
    where: {
      id: keys,
    },
  });

I don't know if this is because I have a newer package or something. But it took me hours to figure it out, so I figured I would share with everyone else

npm run scripting syntax is slightly different on Windows due to the underlying shell being used. Usually the default is cmd.exe (the old DOS), even though it is possible to override the default.

The key changes required for the testing scripts (p. 315 of the book) are:
"test-server": "set TEST_DATABASE=mytestdatabase&& npm start", "test": "mocha --require @babel/register src/**/*.spec.js"
In test-server, there is no space between the variable's value and && on purpose otherwise trailing spaces would be added to the value (https://stackoverflow.com/questions/25112510/how-to-set-environment-variables-from-within-package-json-node-js#comment58812038_27090755).
Note that TEST_DATABASE=mytestdatabase && npm start will not work in Linux because && starts another shell where the variable is not defined.

In test, single quote are omitted otherwise * are not expanded, or at leasr I think.

Unfortunately there is no way to define cross environment scripts without using external packages.

Does someone else experience this bug and would approve this PR? -> #20

I'm new here. I did know how to check user signup or login.

If anyone runs into this problem as I did today with Bcrypt while deploying to Heroku, this may help you.

Locally I am using Node version 10.11.0, but because I haven't specified anything else in the package.json file, Heroku took a default Node version 8.XX.XX for its own build. When using Bcrypt 3.0.2 and Node 8.XX.XX it didn't work. Then I set it explicitly the Node version for Heroku in the package.json file. It worked:

{
  "name": "my-app",
  "version": "1.0.0",
  "description": "",
  "engines": {
    "node": "10.11.0"
  },
  ...
}

This is less of an issue with the boilerplate and the project itself and more of a 'add-on' issue where I'm trying to add several different claims such as jti, iss and nbf. I've been able to add the jwtid and iss without issues, but attempting to put an nbf claim make it so that the playground not able to reach the server.

Wondering if you've had any issues with this before?

edit: seems I just put in the wrong format

See #5 for users domain. Maybe someone wants to add tests for the messages domain too.

Hi, sorry for the newbie question but how do I incorporate refresh tokens with this?

When following the boilerplate, any signed-in users will need to login again every 30 minutes due to the token expiring. From what I've read (I'm very new to backend stuff), the best way to handle this is by using refresh tokens. I've tried following a few guides online but they use a different stack so it's hard to figure out how to incorporate it into this boilerplate.

Any tips?

The devDependency nodemon was updated from 1.18.5 to 1.18.6.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

nodemon is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

When I try to start the site (~p. 248), I'm met with the following error:

Unhandled rejection SequelizeConnectionError: password authentication failed for user "crash"

which caught me off guard because my .env file is:

DATABASE=gql
DATABASE_USER=postgres
DATABASE_PASSWORD=postgres

After going down the rabbit hole with Postgres and permissions and still not solving the issue I tried logging my environment variables only to find them undefined. (Really, that should have been the first place I checked).

I was able to fix the issue by updating /models/index.js and adding:

import 'dotenv/config';

I see it also exists in /src/index.js in the repo, but the book never specifies adding it anywhere. Updating the code for the index on p. 243 would save the reader a lot of troubleshooting.

The devDependency nodemon was updated from 1.18.11 to 1.19.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

nodemon is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.

Your Greenkeeper Bot 🌴

The dependency graphql was updated from 14.2.1 to 14.3.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

graphql is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

i created a mongo version. https://github.com/rpweb/fullstack-apollo-react-express-boilerplate-project
not finished, but everything works, except pagination.
would be great if you can give me some feedback.
thanks

One of the last instructions on https://www.robinwieruch.de/graphql-apollo-server-tutorial/#graphql-server-data-loader-caching-batching
says:

Remember to add the loader to your subscriptions, in case you use them there:
but it just repeats the previous code. How should we add the data loader to subscriptions?

The dependency apollo-server was updated from 2.1.0 to 2.2.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

apollo-server is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

This project and tutorial looks great, however it may already be outdated as there is now DataSources (https://www.apollographql.com/docs/apollo-server/features/data-sources.html) in Apollo which fosters better separation of application and DB. This should be the way forward.

A problem is that there isn't much documentation or examples for using DataSources with a DB (only REST source). Here is a simple example developed by one of the Apollo developers: https://github.com/apollographql/fullstack-workshop-server/blob/datasources/src/datasources/LikesDB.js

Here is another simple example app that uses DataSources, React-Apollo components and Meteor:
https://github.com/tab00/test-meteor-apollo

Note that neither of these implement batching and caching (which a production-ready app should do).

Could you please update your code and tutorial so that it uses the latest Apollo concepts and syntax?

The dependency apollo-server-express was updated from 2.1.0 to 2.2.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

apollo-server-express is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

hi,
after following the instructions in the readme I'm getting this:

The graphQL server is running and I can execute the queries as well, but somehow the client can not reach it. I tried it on 2 PCs already.
Any ideas?
thx in advance!

There have been updates to the apollo-server monorepo:

• • The dependency apollo-server-express was updated from 2.4.8 to 2.5.0.

• The dependency apollo-server was updated from 2.4.8 to 2.5.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the apollo-server group definition.

apollo-server is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

As workaround I have found: heroku config:set NPM_CONFIG_PRODUCTION=false which makes it possible to install dev dependencies. It's not a long term solution, because usually the server shouldn't be started in production with a babel or nodemon package, but at least it's possible to try it this way.

Ref: https://stackoverflow.com/questions/22954782/install-devdependencies-on-heroku

In client/src/index.js client is undefined? I work on a similar project but I can't get my head around this.

if (networkError) {
    console.log('Network error', networkError);
    if (networkError.statusCode === 401) {
      signOut(client);
    }
  }

we reference client further below in

const client = new ApolloClient({
  link,
  cache,
});

See Sharlaan@fb13b22#r31817689

the Heroku section instructs the user to add code for DATABASE_URL https://www.robinwieruch.de/graphql-apollo-server-tutorial/#graphql-server-postgresql-deployment-heroku

The DATABASE_URL env var is widely used. It would make more sense to specify this from the very beginning instead of three env vars

DATABASE=mydatabase
DATABASE_USER=postgres
DATABASE_PASSWORD=postgres

Make api only use DATABASE_URL.

There have been updates to the apollo-server monorepo:

• • The dependency apollo-server-express was updated from 2.4.8 to 2.5.0.

• The dependency apollo-server was updated from 2.4.8 to 2.5.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the apollo-server group definition.

apollo-server is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

The following functions caused me problems:

const toCursorHash = string => Buffer.from(string).toString('base64');
const fromCursorHash = string => (Buffer.from(string, 'base64').toString('utf-8');

Apparently the createdAt object passed to toCursorHash() was not of type string. I got the following error message:

TypeError [ERR_INVALID_ARG_TYPE]: The "value" argument must not be of type number. Received type number

Tested what type of the string is with javascripts typeof, and it revealed it to be of type object.

I fixed it with

const toCursorHash = string => Buffer.from(JSON.stringify(string)).toString('base64');
const fromCursorHash = string => JSON.parse(Buffer.from(string, 'base64').toString('utf-8'));

However, I'm curious of why this happened and why it appears to work for others as in the book.

Setup:

• Windows 10 with WSL Ubuntu 18.04.1 LTS
• Node v10.14.1

At the moment, there are two scripts in order to test the server. One to start the test server and the second one to execute the tests. Is there a way to put this into one command for being able to test in only one command line tab? I am looking for something like this but it didn't work for me.

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

At the moment, the dotenv setup happens in a separate file: src/env.js. This file is imported in the src/index.js file for initializing all the environment variables from the .env file. Is there a way to have the initialization in the src/index.js file so that the src/models/index.js file has access to the process.env variables? In my case, these variables turned out to be undefined all the time.

There have been updates to the apollo-server monorepo:

• • The dependency apollo-server-express was updated from 2.4.8 to 2.5.0.

• The dependency apollo-server was updated from 2.4.8 to 2.5.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the apollo-server group definition.

apollo-server is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

There have been updates to the apollo-server monorepo:

• • The dependency apollo-server-express was updated from 2.4.8 to 2.5.0.

• The dependency apollo-server was updated from 2.4.8 to 2.5.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the apollo-server group definition.

apollo-server is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴

In my testing of the master branch I found that resolvers isAuthenticated and isAdmin in src/resolvers/authorization.js do not return, and so do not prevent the action their existance was intended to prevent. Perhaps I should create a pull request instead of an "issue"? I am new so please forgive me.

It would be great to include server side rendering.

Thank you for what you have done, and it is a brilliant project.

Just a question,

Do you have plan to integrate Passport.js into your project?
Because in which I see great usefulness when doing more complicated authentications like 3rd party login.

First, nice project. I love it!
I would like to ask you, what you recommend as folders structure for a bigger project? Your Components folder already has a lot of components. I'm new to React and would be great to know your opinion about it...
Maybe we can come up with some ideas and I would happily send a PR with the new layout. A new branch, maybe?

Not able to deploy on heroku, Did anyone tried?

There have been updates to the apollo-server monorepo:

• • The dependency apollo-server-express was updated from 2.4.8 to 2.5.0.

• The dependency apollo-server was updated from 2.4.8 to 2.5.0.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

This monorepo update includes releases of one or more dependencies which all belong to the apollo-server group definition.

apollo-server is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Your Greenkeeper Bot 🌴