Search code examples
node.jsreactjsgithubherokumern

How to deploy MERN stack app to GitHub and Heroku?

I've been using ReactJS for front-end development for quite a while now a decided I want to upgrade my skill to full-stack with MERN (MongoDB - Express - React - Node). I've successfully developed my MERN app but failed the deployment process.

I was trying to use the "from GitHub to Heroku" method where you first upload everything to GitHub and from there use it on Heroku. I wasn't even able to upload my file structure to GitHub so I'm looking for some help.

I was wondering maybe my file structure is wrong so here are some screenshots so you get the idea:

enter image description here

enter image description here

enter image description here

When I try to upload to GitHub I get this warning:

warning: adding embedded git repository: client

Followed up with bunch of hints... Why is this happening? I think both client and server have separate .gitignore files, might this be the issue?

cd (to the directory where client and server are)
git init
git add .

At this point I keep getting the warning:

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 know how to obtain it.
hint: If you meant to add a submodule, use:
hint: 
hint:   git submodule add <url> client
hint: 
hint: If you added this path by mistake, you can remove it from the
hint: index with:
hint: 
hint:   git rm --cached client
hint: 
hint: See "git help submodule" for more information.

Thanks for your help.

Solution

  • I think you used create-react-app. create-react-app also initiates a git repository.

    Just delete ./client/.git and then do it. That should be fine.

    cd ./client
rm -rf .git