GIT and GitHub

How to integrate GIT + GITHUB on your visual studio code, part 2: add a local GIT project we don´t have on our GitHub

So, we come from here and we will learn now how to put one project we have on our local machine, and add it to GitHub, then we can start sync both.

On the official github documentation, we have a good article talking about it::

This is a very useful picture with the steps:


The git bash is a command line toolavailable when you install git, but I prefer to use Visual Studio Code. So, instead of step 2, we will open our project with VCS, where we have all the subfolders, files…

For the example we wwill use our old friend HTML 5 HERALD basic template, we can find here.

We see a basic structure folder/index.html and nothing more



Now, opened the project on VSC, we will open the integrated Terminal this wonderful IDE has, to do that go to view/Terminal


Now, on this shell, we will execute the git init command mentioned above.Sorry but I can´t get a better image. However what you can red there is what the init git command does: create en empty git repository, aka, a project which now is able to be version controlled.git init


As we said on the first article,we now have some directories and files which have not been added to out repo (remember? git init creates an EMPTY repo and the changes, as said on the first article, must be added and commited before sync; before you add them the will appear with a green “U” which means untracked file, not added to the repo). that will we made with the git add . (dont´t forget the point in this case) command.

git add .

Maybe you have noticed that git add . does exactly the same as the + icon we explained on first article; actually they do the same but is better you learn the command way in case some day you use another shell, terminal or IDE. And yeah, sometimes whern you execute it, nothing happens apaprently, no message to tell you changes have been added. I think there is a way to check the changes added and ready to commit but honestly I don´t remember now.

So, with our added changes ( the green “A” -added- appears now instead the green “U” -untracked-), it is time to commit the changes, preparing them with a message to be “launched” to the remote Github repo (that´s how I see it at least 🙂 ).

Again, we won´t use the thick symbol like on last article to do it. The command version to do a commit would be

git commit -m "message-to-describe-thechange"

We can see result is just the same

git commit command

Now probably you will have to set the remote repo URL, because otherwise GIT doesn´t know where it is!

So now we will look for the remote URL like explained on first article (just copy the url of your project on Github), and we will set it as remote repo URL. this way, with git remote

git remote add origin REMOTE REPOSITORY URL


Here, like it happened on first article, maybe you should give your github credentials in order to have permission to sync repo.

Last step would be push the changes to the remote repository, with git push command

git push origin master

git push

And here we have!

RELATED POSTS  How to integrate GIT + GITHUB on your visual studio code, part 1: Clone a github repo to our equip

Hope it helped you. Maybe you have observed we made here many things we did on first article with command line instead of VSCode Icons. May is better this way, as said before.