How can I deploy a Node Express and React app to Heroku, after running with Travis CI?

Question

Following Setup:

A Node Express server, running on localhost:5000.
A client folder created with create-react-app directly in the server folder.
CI Integration with Travis CI

I want to deploy my app to heroku when it's passing. Therefore I created following .travis.yml:

language: node_js
before_install: 
  - npm install && node index.js &
before_script: cd ./client && npm install
node_js:
  - "stable"
cache:
  directories:
  - node_modules
script:
  - npm run test
  - npm run lint
  - npm run build
notifications:
    slack: clicker-web:myslack
deploy:
  provider: heroku
  api_key: "mykey"
  app: test999111test
  on: heroku-deployment-testing

So I got it to deploy to heroku and not failing with travis. But in the heroku app itself I just get the error (in the console):

npm ERR! code ELIFECYCLE
2018-04-15T15:15:31.033343+00:00 app[web.1]: npm ERR! errno 1
2018-04-15T15:15:31.034412+00:00 app[web.1]: npm ERR! [email protected] start: `node scripts/start.js`
2018-04-15T15:15:31.034622+00:00 app[web.1]: npm ERR! Exit status 1
2018-04-15T15:15:31.034841+00:00 app[web.1]: npm ERR! 
2018-04-15T15:15:31.035019+00:00 app[web.1]: npm ERR! Failed at the [email protected] start script.

So I'm pretty sure it has to be something wrong with my setup.

This is the package.json I have set up in the server (root) directory (just a snippet of code you need):

"engines": {
    "node": "8.1.1",
    "npm": "5.0.3"
  },
  "scripts": {
    "client": "npm start --prefix client",
    "buildclient": "npm build --prefix client",
    "server": "nodemon index.js",
    "dev":
      "concurrently --kill-others-on-fail \"npm run server\" \"npm run client\"",
    "build": "concurrently \"npm run server\" \"npm run client\"",
    "test": "npm run server",
    "start": "node index.js",
    "heroku-postbuild":
      "npm run install --prefix client && npm run build --prefix client"

I use a proxy in my application for development which is working just fine. But in prod on heroku I don't need it. I have created these lines in the index.js (in server root):

const path = require("path");
app.get("*", (req, res) => {
  res.sendFile(path.resolve(__dirname, "client", "build", "index.html"));
});

But I always get the same error from Heroku. What did I do wrong and how to deploy a project with server + client combined to heroku from Travis with best practice?

Here is the Project, where you can see the file structure. I'm on the heroku-deployment-testing branch right now.

Github Repo

Also here is the herokuapp which isn't showing anything besides an error:

Heroku App

Last but not least the travis logs (the last part where it's deploying):

Now that you've shared it publicly, you need to revoke your Heroku API key. Also note that SO doesn't support GitHub-flavored markdown. — jonrsharpe
– jonrsharpe, Commented Apr 15, 2018 at 15:31
Done, thx for the info! Ok what's wrong with my markdown? Is it too long you think? I tried it with the code tag where you see "paste code here" , but it messed it up really hard — GeraltDieSocke
– GeraltDieSocke, Commented Apr 15, 2018 at 15:32
You'll also want to revoke your mlab credentials and google secret. Don't commit your .env to a public repository. — Cisco
– Cisco, Commented Apr 15, 2018 at 17:04

Ivan Yakovlev · Accepted Answer · 2018-06-07 10:12:59Z

1

Try to use this config

language: node_js
node_js:
- '8'
cache:
  directories:
  - node_modules
  - client/node_modules
install:
- npm install
- npm run build
script:
- nohup npm run start &
- sleep 3
- npm run test
- npm run lint
deploy:
  provider: heroku
  api_key:
    secure: API_KEY
  app: YOUR_APP_NAME

I believe you don't need before_install and before_script sections.

And also you don't need to run npm run build script since you're building your application with "heroku_postbuild" script in your package.json.

answered Jun 7, 2018 at 10:12

Ivan Yakovlev

614 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How can I deploy a Node Express and React app to Heroku, after running with Travis CI?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related