How To Use GitHub with VS Code in 2020 | Commit & Push | Part 1

today I'm going to show you how to efficiently use github with vs code without the terminal we all secretly dislike this video we are going to focus on how to add an existing vs code project to get and kidnap and how to update the files afterwards with just a couple of mouse clicks first of all before you start you have to install git on your system give us the underlining technology which powers get up secondly make sure to have an account on github and that you have BS code installed just a quick check in the beginning make sure that under the setting get enable is checked a little side note github is a version control platform - they have existing projects and to work on projects in a team but you probably already knew that so let's start with the first step open an existing project with vs code and go to the source control menu and initialize repository it will ask you which folder you want if your followers already in the workspace it will appear here so ours is test project 0 1 now the files that are not updated with git appear with this u which stands for untracked to upload the files we have to go through a two step process commit and push to make commit we write a descriptive message of the changes this is our first commit so we say in it and click the check mark now the files are committed the next step will be to push the changes to get up but if we try to do it we will get this error that's why we have to add a remote repository first go to view and command palette and add remote if the remote repository a name I usually give it the same name as the project so this would be test project zero one and now the s code asks for the URL for the remote repository so let's go to github and create a new repository you can give it a name again I usually take the name I gave the project so this will be tensed for on shake 0 1 you either can have it as a public repository so anyone can see it or keep it private so in this example we keep it public you can add a readme to your repository which should have a quick description of your project this go practice in github so you should do it but for the sake of the tutorial we leave it out now we created the repository and we can copy the link and put the link in vs code click enter now we're able to push the changes you can push the changes here in the menu bar or what I like to do is go on this symbol now if you refresh github you will see our files here if we make some changes for example we say hello world my name is Sam we save the changes and then the source control menu it's automatically updated name change so we commit the changes and be pushed to github and now if we open github we refresh the page we can see the changes and it's all there is to it now you can sync your updated files with just a couple of clicks to github via vs code also don't forget that get created a hidden file in your local folder so don't accidentally delete it and don't make any changes to that folder another quick tip if for some reason you need the repositories link again just go here and you can get the link from github in the next video which is in the description down below I'm going to show you how to do it the other way around so if you have an existing project on github how to pull it to vs code I hope this video helped if you want to see more videos with tutorials like these make sure to subscribe and if that video helped consider giving it 'like see you in the next video [Music] you [Music]

Channel: Dev World

Views: 310,757

Keywords: web development, javascript, online marketing, css, html, github, web design, illustration

Id: 3Tn58KQvWtU

Length: 4min 13sec (253 seconds)

Published: Tue Mar 31 2020