Setting Up Git and GitHub: A Step-by-Step Tutorial
Git is a powerful tool that allows developers to track and manage their code changes over time. It enables collaboration within a team and provides a detailed history of each change made to a project. In this tutorial, we will guide you through the process of setting up Git and GitHub from scratch.
Installing Git and GitHub Desktop
Before getting started, you’ll need to install Git on your computer. The easiest way to do this is by installing the GitHub Desktop application, which includes both Git and a user-friendly graphical interface. GitHub Desktop is available for Windows and Mac.
To install GitHub Desktop, you can visit their official website here. Once installed, open the application and click “Create your free account” to sign up for a GitHub account.
Introducing GitHub
GitHub is a website that hosts code and provides a platform for collaboration on open-source projects. It allows developers to create their own public and private repositories, making it an ideal choice for managing projects in a team environment. Your GitHub profile will showcase your public repositories, and you can find other developers and projects to collaborate with on the platform.
After creating your GitHub account, you’ll be prompted to personalize your experience and choose a plan. For most users, the free plan is sufficient. Once you have completed this step, you’ll be ready to configure Git in the GitHub Desktop app.
Configuring Git
Back in the GitHub Desktop app, click “Sign in to GitHub.com” to connect your GitHub account to Git. This step ensures that your Git commits are associated with your GitHub profile. After signing in, you’ll have the option to set your username and email for Git. These details will be used when creating commits.
Click “Finish” to complete the configuration process. GitHub Desktop will automatically install Git, so you don’t need to take any additional steps.
(Note: If you prefer to install Git separately without GitHub integration, you can download it from the official website here. In that case, you will need to set your name and email using the following terminal commands:)
1 | git config --global user.name "Your Name" |
Now that you have Git and GitHub set up, let’s move on to using Git within Visual Studio Code (VS Code).
Getting Started with Git in VS Code
First, create a folder named dev in your user home folder to store all your projects. Inside the dev folder, create a subfolder called testgit. Then, drag the testgit folder to the VS Code icon on your desktop to open it in VS Code.
Alternatively, you can use the File → Open Folder... menu in VS Code to open the testgit folder.
Within the testgit folder, create a new file named test.js. You can do this by clicking File → New File or by right-clicking in the sidebar and selecting the appropriate option. Add some content to the file, such as alert('test').
To save the changes, press cmd-S (Mac) or ctrl-S (Windows) or use the File → Save menu.
Next, click the Source Control icon in the VS Code toolbar. This will open the Source Control view and show the files in your repository.
If you see a message indicating that Git is not set up for the project, you’ll need to initialize a repository. Click Initialize Repository and follow the prompts to complete the initialization.
Once the repository is ready, you can start making commits. A commit represents a set of changes that you want to group together as an atomic change in your codebase.
In the Source Control view, enter a commit message in the “Message” box (e.g., “My first commit”) and press cmd-Enter (Mac) or ctrl-Enter (Windows), or click the checkmark icon to create the commit.
If prompted, choose to stage all your changes and commit them directly. If you encounter an error message, click “Cancel” and follow the instructions to resolve the issue, or refer to the initial GitHub Desktop installation guide.
Publishing Your Repository to GitHub
Now it’s time to publish your repository to GitHub. Click the blue “Publish Branch” button in the Source Control view. This will guide you through the process of connecting VS Code to your GitHub account.
Follow the prompts to authorize the connection and choose whether to publish the project publicly or privately. You can always change the visibility settings later.
Once you have published your repository, the commits you made are saved on github.com. GitHub serves as a reliable backup for your code and provides a comprehensive history of your changes.
To view your commits on GitHub, navigate to your repository page and click the icon with the clock and a number (indicating the number of commits). This will display a list of all the commits made to the repository. Clicking on a specific commit will show you the changes made in that commit.
Resources for Learning Git and GitHub
If you want to deepen your understanding of Git and GitHub, check out the following tutorials by the author:
Now that you have successfully set up Git and GitHub, you’re ready to start managing your code projects with ease.
tags: [“git”, “github”, “version control”, “collaboration”, “developer tools”]