This is a series of articles related to Git GUI Clients.
Note. Although Git is very popular in the software development process, there is no category defined in this C # Corner site. So, we put the articles under the DevOps category.
When we discuss these Client GUI for Git, we concentrate on these following features associated with the specific Client GUI::
- Visual Studio, VS Code
- Repos Management (Local):
- Create a Repository, Branch
- Clone a Repository
- Merge, Rebase, Reset, Revert a Branch...
- Interaction between Local Repos and Remote
- Editor (+ the original environment functionalities, such as compiling, debugging, and so on)
- GitHub Desktop, TortoiseGit, SmartGit
- Repos Management (Local)
- Interaction between Local Repos and Remote
- GitHub Server
- Repos Management (Remote)
- Interaction between Repos and Server automation (pipeline)
A - Introduction
In this article, we will describe VS Code as a GUI client and its major features. The content of this article:
- A: Introduction
- B: Source Control Checkout
- C: Command Line:
- D: Timeline Panel
- E: Source Control Panel => View and More Actions
B - Source Control Checkout
From the left bottom corner => Click the Branch sign (main now) => A dropdown list beneath the search or command input window on the middle top of the screen is shown
![Source Control Checkout]()
In the list, the branches and the command to Create a Branch are shown, such as
- Create new branch
- Create a new branch from
- Branches
- Remote Branches
- Tags
The branch is associated with a commit number, which feature is not seen from Visual Studio Client, and is a powerful feature.
C - Command Line
Click Search Window in the middle of the top line => a Command list is shown:
![Command Line]()
Click More ?:=> Show all of the list:
![show all of the list]()
From the dropdown list, Click Show and Run Commands:
![Show and Run Commands]()
A Command list is shown:
![Command list]()
Type git => Git Commands will be shown:
![Git Commands]()
Type Timeline=> Click Explorer: Focus on Timeline View:
![Timeline View]()
Or even just Type Tim=> Click Explorer: Focus on Timeline View:
![Tim]()
Timeline Panel will be shown at the location on the Left Bottom
![Timeline Panel]()
D - Timeline Panel
Timeline Panel can also be accessed by Click Explorer on the Left Top icons => Click Timeline at the left bottom
![Timeline Panel]()
To open the dropdown box for timeline details => Click the Timeline Filter Icon (right-second icon on the top of Timeline):
![dropdown box for timeline details]()
Two types of timelines are shown:
- Git History: from Git system history
- Local History: from local VS code
such as
Git History:
![Two types of timelines - Git History]()
Local History:
![Two types of timelines - Local history]()
Highlight one commit of the history; it will show the details
![Highlight one commit]()
Find the difference between the current commit and the commit you Click
![difference between the current commit and the commit you Click]()
D
E - Source Control Panel => View and More Actions
From the Left Top corner => Click the top third icon. Source Control => Click the top line right corner in the left panel ![]()
(View and more actions) sign
![Source Control Panel]()
A dropdown list is shown => Click View
![View]()
Click View & Sort:
![View & Sort]()
Click Incoming & Outcoming:
![Incoming & Outcoming]()
Click Commit:
![Commit]()
Click Changes:
![Changes]()
Click Pull, Push:
![Pull, Push]()
Click Branch:
![Branch]()
Click Remote:
![Remote]()
Click Stash:
![Stash]()
Click Tags:
![Tags]()
References