Skip to main content

Mastering Your React Project: Push to GitHub in Both Main and Master Branch from VS Code!

As of the last update in September 2021, GitHub had announced that they would replace the "master" branch with "main" as the default branch name. So, the steps I'll provide will use "main" as the default branch name. If anything has changed after last update, you can adapt the steps accordingly.


Here's how you can push your React project to GitHub from VS Code in both the "main" and "master" branches:



1. Initialize a Git repository:

If your React project is not already a Git repository, you can initialize it by opening a terminal in VS Code and running the following command in the root of your project:


```bash

git init

```


2. Add your files to the Git repository:

Run the following command to stage all the changes you want to commit:


```bash

git add .

```


3. Commit your changes:

Create a commit for the staged changes with a meaningful message:


```bash

git commit -m "Your commit message here"

```


4. Create the "main" branch:

By default, Git will create a "master" branch, but we want to use "main" instead. So, we'll create the "main" branch and push our initial commit to it:


```bash

git branch -M main

git push -u origin main

```


5. Create the "master" branch:

Now that we have pushed the initial commit to the "main" branch, let's create the "master" branch and push the same commit to it:


```bash

git checkout -b master

git push -u origin master

```


6. Keep both branches in sync:

After the initial setup, you can continue working on your project and make changes. Whenever you want to push changes to GitHub, follow these steps:


- Stage your changes with `git add .`

- Commit the changes with `git commit -m "Your commit message here"`


Now, to push the changes to both branches, simply run:


```bash

git push origin main

git push origin master

```


These commands will push your changes to the respective branches on your GitHub repository.


Please note that "origin" is the default name for the remote repository in Git. If you have a different remote name, replace "origin" with the appropriate remote name. Additionally, if GitHub has made any changes to their default branch naming convention after my last update, adjust the branch names accordingly.

Comments

Post a Comment

Popular posts from this blog

The Rise of Headless CMS: Benefits and Use Cases

 Title: The Rise of Headless CMS: Benefits and Use Cases In recent years, there has been a significant rise in the adoption of headless Content Management Systems (CMS). This new approach to content management is revolutionizing the way websites and applications are built and managed. In simple terms, a headless CMS decouples the front-end presentation layer from the back-end content management system. Instead of using a traditional monolithic CMS where the front-end and back-end are tightly integrated, a headless CMS allows developers to build the front-end separately and fetch content through APIs. Let's explore the benefits and use cases of headless CMS. 1. Flexibility and Faster Development: One of the key benefits of a headless CMS is the flexibility it provides to developers. Since the front-end and back-end are independent, developers can choose the most suitable technologies for each. This means they can use the latest and most efficient tools for creating interactive user ...
Post a Comment
Read more

Oops! Website Errors: What They Mean and How to Handle Them

 When browsing websites, users may encounter various errors that can disrupt their online experience. Let's explore eight common errors in simple Asian English language: 1. **404 Not Found: Page Missing**    The 404 error is like searching for a treasure but finding an empty chest. It occurs when the webpage you want to visit cannot be found on the server. It's like taking a wrong turn in a maze and hitting a dead end. This can happen if the page has been removed, moved, or there's a mistake in the URL. To fix it, double-check the web address or try searching for the content again. 2. **500 Internal Server Error: Ooops! Something Went Wrong**    Imagine a chef burning the dish and saying, "Sorry, something went wrong." That's the 500 error. It's like a secret recipe that the server couldn't understand. This error indicates a problem on the website's server, causing it to hiccup and fail to deliver the requested page. You can't do much about it,...
Post a Comment
Read more