How to create a mono repo on Github
If you’re like me and have always created two separate repos on Github for back end and front end, then creating a mono repo may give a few headaches in the beginning. That’s what I will try to save you from in the article.
What is a mono repo?
Well, if you stumbled upon this article it may have been because you are wondering how to start a mono repo quick and easy, or even if it’s best practice to do so or not.
There is much debate about whether or not to go with a mono repo or multiple repos for one project. Personally, I think keeping things separate is better in a collaborative sense, but that’s totally based on my own experience. However, if you want all your code in one place, go with a mono repo.
A mono repo is storing multiple isolated code parts from multiple projects into a single repository.
I am going to show the basic steps so that you won’t have any nasty git issues when pushing your code to Github like empty folders, or untracked file changes.
I use the VS Code editor, so if you try these on another editor and find it does not work, please let me know so I can add additional caveats in this article. We will be changing one setting in VS Code.
First, log in to your Github account and create a repository with the name of your application.
Then copy the url and clone your remote repo to your local machine.
Open your new repo folder in VS Code. And navigate to Settings => Features => SCM => [Check ON] “Always Show Repositories”. The reason is, sometimes VS Code won’t always register or track the two subfolders, resulting in not being able to single out files in the source control tab for commits. You could just do ‘git add <filename>’, but I find the source control tab on VS Code way quicker.
Once you’ve gotten that, we need to create a single .gitignore file in the root folder of your project. This is where you’ll need to know what you’re going to use in your front end and back end. I created a .gitignore file on Github where you can easily copy paste from.
Here is one => Rails & React
Or
Look through Github’s common .gitignore templates here and combine into one .gitignore file.
Once you’ve gotten that, you can then start to populate your new folder with the sub folders. If you’re using Rails as a backend, you can easily add a flag to prevent adding .git files.
Run this in your root folder.
-G, [--skip-git] # Skip .gitignore filerails new <app-name-here> --skip-git
For more rails new flags look here.
Make sure you are still in your root folder. The command create-react-app does not allow for such flags to remove git, so run the command then ‘cd’ into the new React folder.
Then run the command…
rm -rf .git This removes .git folders from your React front end.
You can now stage your changes and push the new files to your Github repo.
Both folders should show up in your mono repo and include all of the new files created.
