Include a React app with its own git folder in git repository

Question

I have two applications I want to include as part of the same repository. An Express backend and a React frontend. The React frontend was created using npx create-react-app. Creating a React app in this way also creates a .git folder and a .gitignore file in the folder of my React app. After running git init on the parent folder of what I want to include I am left with a repository that contains two .git folders:

.git
.gitignore
README.md
react-frontend
    .git
    .gitignore
    README.md
express-backend

After attempting to add files to the repository with git add . git warns me about the second .git folder:

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> youtube-dl-react-frontend
hint:
hint: If you added this path by mistake, you can remove it from the
hint: index with:
hint:
hint:   git rm --cached youtube-dl-react-frontend
hint:
hint: See "git help submodule" for more information.

I am not sure what to do here. What is a submodule and is it really what I want to use to include my React app? Or should I just delete the .git folder from the React folder? Or is there something different I should be doing here?

I also tried commiting, then running git push -u origin master to see if I would be able to push my changes, but I was unable to:

error: failed to push some refs to 'my project url'
hint: Updates were rejected because the remote contains work that you do
hint: not have locally. This is usually caused by another repository pushing
hint: to the same ref. You may want to first integrate the remote changes
hint: (e.g., 'git pull ...') before pushing again.
hint: See the 'Note about fast-forwards' in 'git push --help' for details.

you can set the frontend directory as a submodule if you treat it as a separate project (then it can have its own remote and people in your team can work on it without to have the backend). If you treat the backend and frontend as a single project, then you can delete the .git in the frontend folder. For the second question try to do a git pull first. — Martin J
– Martin J, Commented Aug 31, 2020 at 23:02

Ramin Moradi · Accepted Answer · 2020-09-01 00:11:35Z

1

A git folder contains git config files and commits and all changes in git repository if you want to make your project directory work with your own git repository delete the .git folder that react made for you and then use Git init Git remote add origin (repo url) Git add . Git commit -m "your message" Git push -u origin master

answered Sep 1, 2020 at 0:11

Ramin Moradi

485 bronze badges

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

3 Comments

Veldas R Durai Over a year ago

I can't delete the .git file . I'm getting error like this : "rm: cannot remove '.git': Is a directory"

Ramin Moradi Over a year ago

@VELDASRDURAI You Have To Use rm -rf Command For Deleting A Directory

TheArchitecta Over a year ago

This does not work with git hub using the commands given.

TheArchitecta · Accepted Answer · 2023-06-23 13:39:57Z

Accepted Answer no longer works or potentially never did because you cannot push your commits onto an existing branch of a new repo most of it is good until you actually push:

> git pull --allow-unrelated-histories

is the main thing that joins the local branch to the remote repo's main

> ... [email protected]:{org}/{repo}.git

is an ssh repo connection

start here:

git init
git remote add origin [email protected]:{org}/{repo}.git 
git add .
got commit -m "init"
git branch --set-upstream-to=origin/main main
git pull --allow-unrelated-histories

now merge your .gitignore file (keeping the react generated one) and any others you please.

git add .                                                       
git commit -m "save me jebbers"
git push

Collectives™ on Stack Overflow

Include a React app with its own git folder in git repository

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related