DEV Community

Cover image for Don't overcomplicate git πŸ™‡β€β™‚οΈ
Chris Bongers
Chris Bongers

Posted on • Originally published at daily-dev-tips.com

Don't overcomplicate git πŸ™‡β€β™‚οΈ

I recently talked to someone who was confused by git commands in the terminal, and it was just not working.

I again was confused about why this person was trying to push a simple commit using terminal commands?

Call me lazy, but there are visual tools to do just this for you.

In this case, the person wasn't aware of these, so I'm writing this article.

Use the right tools for the right job.

Don't get me wrong, I can commit and do a lot of stuff with the git terminal commands, but why not leverage visual interfaces?

Today I'll show you two ways to create commits not having to open your terminal!

Note: The article is based on Mac, there might be a difference for Windows interface.

1. Using Visual Studio Code

My goto editor Visual Studio Code comes with a build-in git interface, and it's so simple to push and commit code.

Let me show you how it works.

Step 1. Finding the git window

To find the git window click the "tree" icon on the left, you will see all your changes that haven't been committed yet.

Git window in Visual Studio code

Here we see all our changes that are not yet committed.

Step 2. Selecting files to commit

You have the option to either commit all files (default) or choose which files you want to commit.

In my case, I'll only commit the files that need to go live.

Click the little plus if you hover a file.

Stage changes

Once we clicked this plus, it will look like this.

Stages vs. unstaged

Only the top two files will be committed now. The other ones will stay on our local machine for now.

Step 3. Writing the commit message

In the box up top, you'll see "message" this is where you write the commit message.

Commit message

Step 4. Commit your changes

Ok, now it's time to commit. There are two ways of doing that.

  1. Click the checkmark icon
  2. Or click the three dots -> Commit -> Commit

Commit code

Step 5. Pushing the commit

The last step in this process is to push the commit we just did.

Click the three dots again -> Commit -> Commit

Commit in Visual Studio

That's it. We now did a visual commit to GitHub via Visual Studio Code.

2. Using the GitHub app

Another way to do this is by using the GitHub app, which has a similar experience.

Download the GitHub desktop application first.

Step 1. Selecting the repo and files to commit

First, make sure you're on the right repository, or add it by browsing for the folder on your machine.

Then select the files you want to commit (Default is all)

GitHub Desktop

Step 2. Writing the commit message

We can then add our commit message and even add a description.

You see the little commit box at the left bottom of the application.

GitHub desktop commit message

Step 3. Commit the files

The next step is to commit the files.

Click the big button at the bottom.

Once you clicked that, the commit will be set. You'll see the number of commits on top now.

Commit in GitHub desktop

Step 4. Push the commit

Now we can click the button up top to push the actual commits.

You can push multiple commits at once.

Push commit in GitHub desktop

That's all. We now saw two ways to commit using a visual interface!

Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on Facebook or Twitter

Top comments (28)

Collapse
 
moopet profile image
Ben Sinclair • Edited

Don't get me wrong, I can commit and do a lot of stuff with the git terminal commands, but why not leverage visual interfaces?

  • Because there are a million different visual interfaces, and one day you'll switch IDEs or want to do something you can't find a button for and you'll be frustrated
  • Because you likely can't automate most of it
  • Because you'll probably need a bigger screen

Or in cases like mine, perhaps you find most visual interfaces confusing?

Collapse
 
dailydevtips1 profile image
Chris Bongers

If you are familiar with git any GUI would do
In what sense automate? I don't know what git commands you use every day, but for me, it's 9/10 times nothing fancy

I do see why you could find some of them confusing, it's a matter of what everyone personally likes better

Collapse
 
moopet profile image
Ben Sinclair

For example, I have a few scripts that fetch changes and start/manage features based on Jira ticket numbers.
There may well be a VSCode plugin for that, and a Jetbrains plugin, and a Sublime plugin, etc., etc., but I don't need to learn a new language to make them. I can just copy my script and it'll work, and it's infinitely hackable because it's my own script.

Thread Thread
 
dailydevtips1 profile image
Chris Bongers

That actually sounds awesome Ben!
I'm all for hacking your own scripts and making your life easier.

You should share some of those ideas here on dev.to 🀟

Collapse
 
delta456 profile image
Swastik Baranwal

I believe its necessary to know how to do it via command line.

Collapse
 
sandordargo profile image
Sandor Dargo

To me, everything that is git, but not the CLI, is in fact overcomplicated.

Collapse
 
dailydevtips1 profile image
Chris Bongers

Haha see where your coming from

Collapse
 
cicirello profile image
Vincent A. Cicirello

Knowing how to do it at the command line is certainly important, but it doesn't mean that you must use the command line on a regular basis. I use the Github Desktop App for 95% of my usage of git. I can certainly do everything from the command line, but the basics of git are quicker from the app. Faster == more productive. For example, seeing what files have changed, you can certainly do a git diff from command line, but from the app you literally do nothing assuming you have the app open while you work. The list of changed files is just there. Now seeing what specifically is different in one of those files is again easy enough from command line, but from the app you just click on it. These 2 examples are both very small time savings, but it adds up when they are operations you do often. Github Desktop, and other similar applications, work really well for the basic things that you do most often (though not so well, or at all, for more advanced).

Collapse
 
dailydevtips1 profile image
Chris Bongers

100% agree, I think we are on the same page on it.
I hardly know what files I change and can just have a quick view and see what's going on.

Collapse
 
dailydevtips1 profile image
Chris Bongers

Yes 100% if you don't understand git there is no point in leveraging the gui's
But they make our life easier, so use whatever helps us.

Collapse
 
jessekphillips profile image
Jesse Phillips

I utilize git gui and gitk

But these make each step clear what is happening. I have not used visual s code, but when people utilize different GUIs I find they still don't know what is happening, and I can't find a way to tell the without jumping into one of these other tools.

Graphical tools have the unfortunate effect of being proactive instead of reactive. You go to push or switch branches and it starts asking how much of your local filesystem you want to keep.

The command line is simple. If you don't use --force your changes are safe.

Collapse
 
dailydevtips1 profile image
Chris Bongers

This is true, hence knowing what your doing is very important

Collapse
 
stevepryde profile image
Steve Pryde

I learned git via the cli so that is what I am most comfortable with. The problem I have with most GUIs is that I don't know what git commands they are actually running so I have no way to trust what they're actually doing behind the scenes.

You're learning a tool either way I guess.

Collapse
 
soumyaranjannaik profile image
Soumya Ranjan Naik

You can see the git output on output console of vscode.

Collapse
 
stevepryde profile image
Steve Pryde

I assume that is after you ran it? I guess with practice you'd get to know which GUI functions corresponded to which commands but ideally I'd want to know the command that would be run ahead of time and then I could confirm it. There probably is a GUI out there that does this.

Does vs code do anything like this?

Collapse
 
dailydevtips1 profile image
Chris Bongers

True, the VSC git GUI does have the output in there indeed.

Collapse
 
dailydevtips1 profile image
Chris Bongers

Hmm, that actually is true!
With most GUI's you don't know what it is actually running!

Good point Steve.

Collapse
 
scroung720 profile image
scroung720

I respect the people that use GUI. However, I prefer using the command line for me it is more natural and fast. Using GUI interfaces feels slow, the two exception is to analyze the graph history and to blaming/diffing commits.

I didn't thought about having my markdown for blog post in a repository that is a cool idea thanks for sharing.

Collapse
 
dailydevtips1 profile image
Chris Bongers

Hey thanks, it's whatever works best for someone, I'm personally so used to my VSC workflow I tend to use the git in there a lot.

Markdown for blog post is very popular in all the static site generators (I'm using 11ty) but gatsby for instance also has this.

Collapse
 
djnitehawk profile image

use whatever you're comfortable and productive with. for me gitkraken is life πŸ˜‹
ctrl+shift+enter to commit. drag n drop a branch to merge. doesn't get any simpler than that imho.

Collapse
 
dailydevtips1 profile image
Chris Bongers

100% always use whatever your most comfortable with and works for you.
Just an option that people can try, I just learned not everyone is aware of tools like this.

Collapse
 
djnitehawk profile image
DΔ΅ ΞΞΉΞ“ΞžΞ—Ξ›ΟˆΞš

yep! to be honest, i've been a developer for over a decade working in teams of many sizes and i've never used the git CLI even once. i just don't see the point in doing things the tedious way.

Thread Thread
 
dailydevtips1 profile image
Chris Bongers

Always do what feels good for you, unless your manager is really forcing you ofcourse πŸ˜‚

Collapse
 
winstonpuckett profile image
Winston Puckett

This is a good example of abstraction. You don't need to learn cli commands to be effective in git. You could be using that time to learn something that addresses the problem you have.

Hopefully I can say this as I use the cli almost exclusively and love bash.

Collapse
 
dailydevtips1 profile image
Chris Bongers

Of course you can, I do think you need to know the basics of Git, what it is, how it works, but make use of whatever works for you.

If it's the CLI => 100% fine
if it's a GUI => Also fine
If it's a bash script doing all for you => Great stuff

Collapse
 
dailydevtips1 profile image
Chris Bongers

True, I personally have an intern now, and he is so good, he will just say Chris I don't feel comfortable doing a commit, can you guide me through it again.

And there is never shame in asking how to do something.

Collapse
 
hebashakeel profile image
hebaShakeel

Can you please tell me how you design your cover image. I really really like them.
Thanks!

Collapse
 
dailydevtips1 profile image
Chris Bongers

Hi Heba! (Hope I got your first name right here)

I'm using Sketch and just created a "template" for my blog.
Happy to share the Sketch file if it helps you?

Drop me a message with you email and I'll send it over