Learn The MERN Stack [8] - Prepare & Deploy

Traversy Media · 165K views · 2018 · 16:22

Open on YouTube

Web developmentCloud, DevOps & reliabilitytutorialdated

Why Stack Overflow recommends it

Stack Overflow users link it as the tutorial they followed to deploy a MERN app to Heroku, usually when asking why the heroku-postbuild script or the production build fails.

Recommended by 1 people across 1 different months, 2018 to 2021.

What it is

Part 8 of Traversy Media's MERN stack series, in which Brad Traversy prepares a Node/Express and React shopping list app for deployment to Heroku. He adds a heroku-postbuild script so the React build runs on the server after a push, and serves the built static files from Express in production.

What people said

Recommends tonytone · 2020-05 · Stack Overflow · on “React state hooks work on development but not on build (production)”

The fix was very in depth, but basically my method of deployment to google cloud was a method that would only work with static web pages. I ended up deploying the app with heroku using this great guide: enter link description here [this video]

Cites Gooey Developer · 2018-09 · Stack Overflow · on “Herokuapp launching fails, despite git push success, page opens with following title: Error and displays "Not Found" in HTML”

So I was following this awesome tutorial: [this video] (I started from the very beginning of the series, following along, I'm new to React/Redux). Anyway, so everything worked, all git add, commit and push worked. But at the same time, when I go to the URL to launch the app, it opens up a page saying "Not found". That is all. Here's a log of when I run git push heroku master: Enumerating objects: 7657, done. Counting objects: 100% (7657/7657), done. Delta compression using up to 8 threads. Compressing objects: 100% (7064/7064), done. Writing objects: 100% (7657/7657), 5.45 MiB | 1.10 MiB/s, done. Total 7657 (delta 2408), reused 0 (delta 0) remote: Compressing source files... done. remote: Buildin

Cites Toni Wheeler · 2019-01 · Stack Overflow · on “My mern app fails to run on heroku. How can I fix this error?”

I followed Brad Traversys Guide [this video] to build this basic MERN Stack App using React.js, Redux.js, Node.js, Express.js, and MongoDB with create-react-app and Mlab. The App works fine on my local server with no errors, however I am having trouble deploying it to Heroku. I deployed the app using the Heroku CLI, and got the message: deployed to Heroku remote: remote: Verifying deploy... done. To [LINK] d4eeb21..473c3c0 master -> master However When I visit my app [LINK] I get the following error message: Application error An error occurred in the application and your page could not be served. If you are the application owner, check your logs for details. You can do this from the Heroku CLI wi

Cites Modest Pelican Programming · 2020-04 · Stack Overflow · on “I get error when trying to deploy MERN app to heroku”

I am following a MERN stack tutorial by Traversy Media, I am currently trying to deploy to Heroku. But whenever I try to git push heroku master , it gives me this: error: failed to push some refs to ' [LINK] ' I followed every step, making sure I did everything correctly. Here is my GitHub with the code: [LINK] Here is the tutorial: [this video]

Cites Nikolas Blahušiak · 2020-07 · Stack Overflow · on “MERN app fails to run "heroku-postbuild" script while being deployed to Heroku”

Everything runs just fine until I try to deploy the app to the Heroku. After logging in, these are the terminal commands I run to deploy the app (and the response): heroku login heroku: Press any key to open up the browser to login or q to exit: Logging in... done Logged in as #hidden heroku create Creating app... done, ⬢ lower-donair-61893 [LINK] | [LINK] git init Initialized empty Git repository in #hidden heroku git:remote -a lower-donair-61893 git add . warning: adding embedded git repository: client hint: You've added another git repository inside your current repository. hint: Clones of the outer repository will not contain the contents of hint: the embedded repository and will not kno

Cites chataolauj · 2020-07 · Stack Overflow · on “MEVN app deployment to Heroku failed because of 'vue-cli-service' not found”

So, I tried to deploy my MEVN application to Heroku by following Traversy's tutorial ( [this video] ). I followed all the steps that he outlined in the tutorial. His tutorial is for the MERN stack, but it's very similar apart from the front-end framework, so I figured it would work for my MEVN app too. The main parts of the tutorial were adding this snippet to my app.js: if(process.env.NODE_ENV === 'production') { //Set static folder app.use(express.static('client/build')); app.get('*', (req, res) => { res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html')); }); } and this script in package.json: "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm ru

Cites PurplePineapple · 2021-09 · Stack Overflow · on “MERN: How to access build folder for Heroku deployment?”

How do I access the build folder in React from node for Heroku deployment? I'm getting errors and I'm almost 100% sure that I'm just not using the correct path. My thinking was to use the standard path navigation ../ , but that appears to be an incorrect assumption. File Hierarchy: Project Folder | |___Backend-Folder | | | |___App.js | |___Frontend-Folder | |___build App.js (server): if (process.enn.NODE_ENV === 'production') { app.use(express.static(path.resolve(__dirname, "../Frontend-Folder/build"))); app.get("*", function (request, response) { response.sendFile(path.resolve(__dirname, "../Frontend-Folder/build", "index.html")); }); } Package.json build file: "heroku-postbuild": "NPM_CONF