Note: Visual Studio uses the GIT client on your Operating System:
If NOT: Search for any GIT client for your OS:
Introduction:
Every developer needs a way to track changes, collaborate, and version their code.
Rollback to previous version.
Branching.
Git Issues and Git Actions.
Git provides the foundation for this, and platforms like GitHub extend Git's capabilities, offering cloud storage, collaboration tools, project management.
Today, we'll learn how to connect a local repository in Visual Studio Code to a remote GitHub repository (the Instructor’s Repository to catch the new code changes and lab instructions into your local environment).
Objectives:
Understand the basics of Git and GitHub:
Loading…
Initialize a local Git repository in Visual Studio Code.
Connect the local repository to a remote GitHub repository.
The Process:
Local Repository: This is your project on your computer. Every Git project has a local repo.
Remote Repository: It's like a backup on the cloud (e.g., GitHub) that also allows collaboration.
b. Click the '+' icon at the top right and select New repository.
c. Name it react (or another name of your choice). Choose other settings as per your requirements and click Create repository.
Connect Local Repository to GitHub:
a. In your created GitHub repository, you'll see a section named "...or push an existing repository from the command line." Copy those commands.
b. Return to Visual Studio Code, and in the terminal, paste the commands. It should look something like this:
** Here is the Instruction to make a local Clone of a GitHub Repo (your own or somebody else's)
github repo clone computationalknowledge/f23REACT
Verify the Connection:
Go back to your GitHub page and refresh. You should see your code now present in the react repository.
Homework:
Make changes to your local code in Visual Studio Code.
Commit those changes and push them to your GitHub repository.
Observe the changes reflected on your GitHub page.
Conclusion:
By now, you've taken a significant step in your development journey. Being able to connect local projects to remote repositories is essential for collaboration, version control, and backup. As you delve deeper into development, tools like Git and platforms like GitHub will become second nature to you.
Instructions to Clone a GitHub Repository:
Prerequisites:
Ensure you have Git installed on your local machine. If not, you can download it from
And that's it! Students now have a local copy of the f23REACT repository from GitHub on their machines. They can now work on it, make changes, and if they have the necessary permissions, push updates back to the remote repository.
How to manually make directories on Github
Manually creating directories (or folders) directly on GitHub involves a bit of a workaround, as GitHub does not provide a direct "create folder" UI option. However, you can achieve this by adding a new file and using the folder path in the filename. Here's how you can manually create directories on GitHub:
Navigate to Your Repository:
Open your target repository on GitHub.
Add a New File:
Click on the "Add file" button and select "Create new file".
Enter the Directory Path:
In the name field of the new file, you can define the directory structure using slashes (/). For example, if you want to create a directory called myFolder and within that another directory named subFolder, you would type:
bashCopy code
myFolder/subFolder/
After the final slash, add a placeholder filename like .gitkeep (it's a convention to use .gitkeep to preserve otherwise empty folders in Git). So the full text would be:
bashCopy code
myFolder/subFolder/.gitkeep
Note: .gitkeep is not a special Git file. It's just a convention to push empty directories to repositories. The name itself has no special significance.
Commit the New File:
Scroll down to the bottom of the page. You'll see the "Commit new file" section. Enter a commit message, and choose to commit directly to the main branch (or create a new branch and start a pull request). Click the "Commit changes" button.
Verify the Directory:
Once you've committed the changes, you'll see that the directories have been created with the placeholder .gitkeep file inside.
Remember, this method is essentially a workaround, and if you're working with Git locally on your machine, it's more straightforward to create directories and push them to GitHub. But for quick edits or changes directly on the GitHub platform, this method does the trick.
Let's break down the GitHub integration process in Visual Studio Code into simple steps.