Git Remote Management: Add, Rename, Change, and Remove Like a Pro

6. September 2024 Niranjan Singh Comments (0)

Introduction

Git is an essential version control system for developers. One of its most powerful features is its ability to work with remote repositories, allowing teams to collaborate seamlessly across geographies. Remote repositories, typically hosted on platforms like GitHub, provide a centralized location to push, pull, and share code.

In this article, we will dive into remote repository management in Git. Practical examples teach you how to add, rename, change, and remove remote repositories. By the end, you’ll have the knowledge and confidence to manage remotes like a pro.

Objective

The goal of this blog post is to guide beginner developers and software engineers through the process of managing remote repositories in Git. Specifically, you’ll learn to:

  • Add a new remote repository to your local Git project.
  • Rename existing remotes for better organization.
  • Change the URL of a remote to update connection details.
  • Remove remotes that are no longer in use.

Whether you’re working on a personal project or contributing to a team on GitHub, understanding these Git commands will significantly improve your workflow.

1. Adding a Remote Repository

A remote repository is a version of your project hosted on an external server, such as GitHub. You need to link your local repository to this remote in order to synchronize changes.

Command: git remote add

To add a new remote to your Git repository, use the following syntax:

git remote add <remote_name> <remote_url>
Example:

Let’s say you want to add a new remote named origin for your GitHub repository:

git remote add origin https://github.com/yourusername/your-repo.git

To verify that the remote has been added successfully, use:

git remote -v

Output:

origin  https://github.com/yourusername/your-repo.git (fetch)
origin  https://github.com/yourusername/your-repo.git (push)
Troubleshooting: “Remote origin already exists”

If you encounter the error:

fatal: remote origin already exists.

It means that a remote with the name origin has already been added. To resolve this:

  • Rename the existing remote (explained in the next section), or
  • Use a different remote name.

2. Renaming a Remote Repository

You might want to rename a remote for better clarity or organization, especially when you work with multiple remotes.

Command: git remote rename

To rename an existing remote, use:

git remote rename <old_name> <new_name>
  • <old_name>: The current name of the remote (e.g., origin).
  • <new_name>: The new name for the remote (e.g., upstream).
Example:

Let’s rename a remote called origin to upstream:

git remote rename origin upstream

Verify the change using:

git remote -v

Output:

upstream  https://github.com/yourusername/your-repo.git (fetch)
upstream  https://github.com/yourusername/your-repo.git (push)
Troubleshooting: “Remote [old_name] does not exist”

If the old remote name is incorrect or does not exist, you’ll get this error:

fatal: Could not rename config section 'remote.[old_name]' to 'remote.[new_name]'

Ensure the correct remote name by listing existing remotes:

git remote -v

3. Changing a Remote Repository’s URL

There are times when you need to change the URL of a remote, such as switching from HTTPS to SSH for authentication or moving the repository to a new location.

Command: git remote set-url

To update a remote URL, use:

git remote set-url <remote_name> <new_url>
  • <remote_name>: The name of the remote (e.g., origin).
  • <new_url>: The new URL for the remote repository.
Example:

Let’s update the origin remote to switch from HTTPS to SSH:

git remote set-url origin git@github.com:yourusername/your-repo.git

Verify the change:

git remote -v

Output:

origin  git@github.com:yourusername/your-repo.git (fetch)
origin  git@github.com:yourusername/your-repo.git (push)
Troubleshooting: “No such remote ‘[name]’”

If the specified remote does not exist, you’ll encounter:

fatal: No such remote '[name]'

Double-check the name of the remote with:

git remote -v

4. Removing a Remote Repository

You may need to remove a remote when it’s irrelevant or the repository has been moved elsewhere.

Command: git remote rm

To remove a remote, use:

git remote rm <remote_name>
  • <remote_name>: The name of the remote you want to remove.
Example:

Let’s remove a remote named upstream:

git remote rm upstream

Verify that it has been removed:

git remote -v

Output:

origin  https://github.com/yourusername/your-repo.git (fetch)
origin  https://github.com/yourusername/your-repo.git (push)
Troubleshooting: “Could not remove config section ‘remote.[name]’”

This error means the remote you tried to remove does not exist:

error: Could not remove config section 'remote.[name]'

Double-check the remote’s existence by listing all remotes:

git remote -v

Conclusion

Mastering remote repository management in Git is a critical skill for any developer. Learning how to add, rename, change, and remove remotes ensures that your workflow stays organized, flexible, and efficient. Whether you’re working solo or collaborating with a team, these commands will help you easily handle repository remotes.

With this knowledge, you can push, pull, and clone repositories like a pro!

How to deploy an Angular app to GitHub Pages

21. May 2019 Niranjan Singh Angular Comments (0)

Introduction

In this article, you will learn to deploy an Angular application to GitHub Pages using npm angular-cli-ghpages package to easily.

Prerequisites:

This command has the following prerequisites for Installation & Setup:

  • Node.js 8.2.0 or higher which brings you npm 5.2.0 which brings you npx
  • Git 1.7.6 or higher

  • optional: Angular project created via angular-cli

  • An Angular 5 or above version application, which is working and ready to host. If it is not ready then follow the instructions specified in the below link for adding an existing angular project to GitHub. Adding an existing project to GitHub using the command line

References:

Deploy to GitHub Pages angular-cli-ghpages 
Deploying Angular Apps with GitHub Pages

Steps to deploy to GitHub pages

To install the command run the following:

npm install -g angular-cli-ghpages

It is just two command to publish your Angular application to GitHub pages.

ng build --prod --base-href https://[username].github.io/[repo]/
ngh --dir=dist/

Deploying using the Angular npm scripts

You can also automatically publish an application using npm by setting script in package.json. The build and deploy command in one go by following the below approach:

To install the command as your project dependencies run the following:

npm i angular-cli-ghpages --save-dev

Open your package.json and then, in your script section add the following script to deploy an Angular 7 application.

{
  "name": "ng-webgl",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "deploy:gh": "ng b --prod --base-href https://niranjankala.github.io/ng-webgl/ && npx ngh --dir=dist/"
  },

To execute this deploy script. Run npm run deploy:gh on the root of your project directory.

Publish Github-pages

Note: In order to compile images correctly use the relative path './assets/images/image.png'

Conclusion

There are the steps to publish Angular application the GitHub pages.