{"id":26625,"date":"2016-06-14T23:01:43","date_gmt":"2016-06-14T15:01:43","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=26625"},"modified":"2017-11-22T23:22:57","modified_gmt":"2017-11-22T15:22:57","slug":"version-control-git-vs-code","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/","title":{"rendered":"Version Control in Visual Studio Code with Git [Guide]"},"content":{"rendered":"<p><strong>Integrated Git support<\/strong> is one of the greatest features of <a href=\"https:\/\/code.visualstudio.com\/\" target=\"_blank\">Visual Studio Code<\/a>, Microsoft\u2019s new <a href=\"https:\/\/www.hongkiat.com\/blog\/visual-studio-code-features\/\">source code editor<\/a>. <a href=\"https:\/\/git-scm.com\/\" target=\"_blank\">Git<\/a> is a <strong>distributed version control system<\/strong>, that allows you to track your work, move back and forth between versions, and work on different branches at the same time. It\u2019s also used by <a href=\"https:\/\/github.com\/\" target=\"_blank\">Github<\/a>, the popular Git repository hosting service.<\/p>\n<p>Visual Studio Code <strong>supports Git by default<\/strong>, which means you don\u2019t have to install any packages or extensions to use it. The Side Bar contains a separate <strong>Git<\/strong> View you can quickly open by clicking on the <strong>Git<\/strong> icon in the View Bar (<a href=\"https:\/\/code.visualstudio.com\/docs\/editor\/codebasics#_basic-layout\" target=\"_blank\">see VS Code\u2019s parts<\/a>), or by hitting the <span class=\"key\">Ctrl<\/span>+<span class=\"key\">Shift<\/span>+<span class=\"key\">G<\/span> key binding.<\/p>\n<p class=\"note\"><strong>Read more: <\/strong><a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/key-binding-management-visual-studio-code\/\">Increase productivity in Visual Studio Code with key binding<\/a><\/p>\n<h2>Install Git<\/h2>\n<p>As Visual Studio Code <strong>uses the Git install of your computer<\/strong>, first you need to install Git. You can quickly download it from <a href=\"https:\/\/git-scm.com\/downloads\" target=\"_blank\">Git\u2019s official website<\/a>. You need to install <strong>at least <code>version 2.0.0<\/code><\/strong> to make VS Code\u2019s Git features work properly.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-install.jpg\" alt=\"Install Git\" width=\"700\" height=\"469\"><\/figure>\n<p>Although Visual Studio Code allows you to <strong>manage Git visually<\/strong>, if you also want to learn how to use Git from the command line, here are some useful resources:<\/p>\n<ul>\n<li><a href=\"https:\/\/try.github.io\/levels\/1\/challenges\/1\" target=\"_blank\">Github\u2019s interactive Git tutorial<\/a><\/li>\n<li><a href=\"https:\/\/www.atlassian.com\/git\/tutorials\/\" target=\"_blank\">Atlassian\u2019s Git tutorial<\/a> \u2014 Atlassian is the company behind the <a href=\"https:\/\/bitbucket.org\/\" target=\"_blank\">Bitbucket<\/a> source code hosting platform (similar to Github)<\/li>\n<li><a href=\"https:\/\/www.atlassian.com\/dms\/wac\/images\/landing\/git\/atlassian_git_cheatsheet.pdf\" target=\"_blank\">Atlassian\u2019s Git Cheat Sheet (PDF)<\/a> \u2014 this is the fastest way if you\u2019ve already used Git, but don\u2019t remember one or two commands<\/li>\n<li><a href=\"https:\/\/git-scm.com\/book\/en\/v2\" target=\"_blank\">The entire Pro Git handbook<\/a><\/li>\n<\/ul>\n<h2>Initialize Your Repository<\/h2>\n<p>If your workspace isn\u2019t yet tracked by Git, first you need to <strong>initialize a new repository<\/strong>. To do so, click on the <span class=\"key\">Initialize git repository<\/span> button in the Git View.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/initialize-git.jpg\" alt=\"Initialize Git\" width=\"700\" height=\"358\"><\/figure>\n<p>VS Code will create a <strong><code>.git<\/code> folder inside your workspace<\/strong> (you can\u2019t see this from VS Code, as it\u2019s a hidden directory, but you can find it in your file manager in the root folder of your project), and it will also <strong>add your untracked files to the Side Bar<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-untracked-files.jpg\" alt=\"Git Untracked Files\" width=\"700\" height=\"388\"><\/figure>\n<h2>Stage Changes<\/h2>\n<p>After your Git repository is set up, it\u2019s time to <strong>create your initial commit<\/strong> (a commit is a recorded state of your whole repository you can later move back to). Before committing, you need to add the files you want to track with Git to the <a href=\"https:\/\/git-scm.com\/book\/en\/v2\/Getting-Started-Git-Basics#The-Three-States\" target=\"_blank\" rel=\"nofollow\">staging area<\/a>, or in other words you need to <strong>stage the changes<\/strong>. Click on the <span class=\"key\">+<\/span> button that appears on hover next to each file to stage them.<\/p>\n<p>After you click on the files you want to stage, Visual Studio Code moves from the <code>Changes<\/code> folder to the <code>Staged Changes<\/code> folder, that means that now they are <strong>in the staging area<\/strong>. If you want to <strong>stage all your files at once<\/strong>, there\u2019s a <span class=\"key\">+<\/span> button next to the <code>Changes<\/code> subtitle as well (it appears on hover), and click on it.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-stage-changes.jpg\" alt=\"Git Staged Changes\" width=\"700\" height=\"393\"><\/figure>\n<h2>Commit Changes<\/h2>\n<p>Staged changes are not yet recorded, you also need to <strong>commit them<\/strong>, so that later you can have a look at or move back to the <strong>current state of your repository<\/strong>. In order to commit the staged changes, you need to <strong>add a commit message<\/strong> that describes the changes you made since your previous commit.<\/p>\n<p>As in our example this will be the initial commit, let\u2019s use the striking \u201cInitial Commit\u201d message. Type your commit message <strong>into the input bar<\/strong> at the top of the Side Bar, and click <strong>on the little tick icon<\/strong>. Now you are ready with your first commit, the initial state of your repository is recorded.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-commit-changes.jpg\" alt=\"Git Commit Changes\" width=\"700\" height=\"393\"><\/figure>\n<p>Your Git working directory is clean, all the changes you made so far are tracked, and your Git View says there are 0 changes (it always compares to your last commit). If you make new changes in your workspace, the new changes will appear again in the Side Bar, and you\u2019ll need to <strong>commit them again<\/strong> once they reached the amount that\u2019s worth committing.<\/p>\n<p>On the screenshot below you can see how your code editor needs to look like right after committing.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/vs-code-after-commit.jpg\" alt=\"VS Code After Commit\" width=\"700\" height=\"392\"><\/figure>\n<h2>Follow Changes<\/h2>\n<p>When you go on with your work, if you are not sure about how the current version compares to your last commit, you can quickly check the differences. In the Git View, you only need to <strong>double click on the file you want to analyze<\/strong>, and  VS Code will show the current and the previous versions side by side, so you can <strong>quickly compare them<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-diff.jpg\" alt=\"Git Diff\" width=\"700\" height=\"327\"><\/figure>\n<p>When speaking about following changes, it\u2019s also important to know about Visual Studio Code\u2019s <strong>gutter indicators<\/strong> that annotate the changes compared to your previous commit, even when the side by side view is not open. VS Code uses <strong>3 kinds of gutter indicators<\/strong>:<\/p>\n<ol>\n<li>a <strong>red triangle<\/strong> for every line deletion<\/li>\n<li>a <strong>green bar<\/strong> for every line addition<\/li>\n<li>a <strong>blue bar<\/strong> for every line modification<\/li>\n<\/ol>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/gutter-indicators.jpg\" alt=\"Gutter Indicators\" width=\"700\" height=\"305\"><\/figure>\n<h2>Create Branches<\/h2>\n<p>Git allows you to <strong>work on different branches<\/strong> at the same time. This is not only good for experimenting with new solutions, but can also significantly facilitate teamwork where developers can work on different branches (however this is not obligatory, as they can also stay on the same branch).<\/p>\n<p>In Visual Studio Code, you can <strong>create new branches<\/strong> by opening the Quick Open palette by hitting <span class=\"key\">Ctrl<\/span>+<span class=\"key\">P<\/span> (<span class=\"key\">Cmd<\/span>+<span class=\"key\">P<\/span> on Mac), then typing the <code>git branch<\/code> command into the input bar. You also need to add the name of your new branch to the end of the command.<\/p>\n<p>As the name of the new branch in our example will be <code>test-branch<\/code>, I\u2019ll use the <code>git branch test-branch<\/code> command, but you can use any other name. In the left side of the status bar (blue bar at the bottom of the screen) you can always quickly check which branch you are currently working on. On the screenshot below, you can see that I\u2019m currently on the <code>master<\/code> branch.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/create-new-branch.jpg\" alt=\"Create New Branch\" width=\"700\" height=\"387\"><\/figure>\n<h2>Checkout Branches<\/h2>\n<p>To <strong>switch between branches<\/strong>, type <code>git checkout<\/code> into the Quick Open palette (<span class=\"key\">Ctrl<\/span>+<span class=\"key\">P<\/span>\/<span class=\"key\">Cmd<\/span>+<span class=\"key\">P<\/span>), and you can choose from your available branches. On the screenshot below, you can see from the status bar that I\u2019m currently on the branch called <code>test<\/code> (I created it after <code>test-branch<\/code>), and if I want to move to a different branch, I can now select from the <code>master<\/code> and <code>test-branch<\/code> branches.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-checkout.jpg\" alt=\"Git Checkout\" width=\"700\" height=\"381\"><\/figure>\n<h2>Use Git Commands from the Command Palette<\/h2>\n<p>You can access Git commands from the Command Palette (<span class=\"key\">F1<\/span> on Windows and Linux, <span class=\"key\">Shift<\/span>+<span class=\"key\">Cmd<\/span>+<span class=\"key\">P<\/span> on Mac) as well. You don\u2019t have to do anything else, just type the command <code>Git<\/code> inside the Command Palette, and you get a dropdown list of the available commands you can quickly choose from.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-command-palette.jpg\" alt=\"Git Command Palette\" width=\"700\" height=\"382\"><\/figure>\n<h2>Advanced Git Operations<\/h2>\n<p>So far, we have looked at how to use basic Git operations in Visual Studio Code to track our work. VS Studio Code has advanced Git features as well, such as <a href=\"https:\/\/code.visualstudio.com\/docs\/editor\/versioncontrol#_remotes\" target=\"_blank\">managing remote repositories<\/a>, <a href=\"https:\/\/code.visualstudio.com\/docs\/editor\/versioncontrol#_merge-conflicts\" target=\"_blank\">merging conflicts<\/a>, and you can even configure VS Code as your <a href=\"https:\/\/code.visualstudio.com\/docs\/editor\/versioncontrol#_git-patchdiff-mode\" target=\"_blank\">external Git editor<\/a>.<\/p>\n<p>The <a href=\"https:\/\/marketplace.visualstudio.com\/search?term=git&target=VSCode&sortBy=Relevance\" target=\"_blank\">Visual Studio Code Marketplace<\/a> also contains Git-related extensions that can make your Git workflow even more professional.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-extensions.jpg\" alt=\"Git Extensions\" width=\"700\" height=\"419\"><\/figure>\n<p>I myself found the extension <a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=donjayamanne.githistory\" target=\"_blank\">Git History<\/a> to be very useful, as it makes it possible to quickly have a look at the details of each commit, and to compare any two previous commits side by side. You can also read on the Git History extension <a href=\"https:\/\/www.hongkiat.com\/blog\/visual-studio-code-extensions\/\" target=\"_blank\">in my previous article<\/a> about VS Code extensions for front-end developers.<\/p>","protected":false},"excerpt":{"rendered":"<p>Integrated Git support is one of the greatest features of Visual Studio Code, Microsoft\u2019s new source code editor. Git is a distributed version control system, that allows you to track your work, move back and forth between versions, and work on different branches at the same time. It\u2019s also used by Github, the popular Git&hellip;<\/p>\n","protected":false},"author":146,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3393],"tags":[2081,2726,3213,3772],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.5) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Version Control in Visual Studio Code with Git [Guide] - Hongkiat<\/title>\n<meta name=\"description\" content=\"Integrated Git support is one of the greatest features of Visual Studio Code, Microsoft&#039;s new source code editor. Git is a distributed version control\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Version Control in Visual Studio Code with Git [Guide]\" \/>\n<meta property=\"og:description\" content=\"Integrated Git support is one of the greatest features of Visual Studio Code, Microsoft&#039;s new source code editor. Git is a distributed version control\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2016-06-14T15:01:43+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-11-22T15:22:57+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-install.jpg\" \/>\n<meta name=\"author\" content=\"Anna Monus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Anna Monus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/\"},\"author\":{\"name\":\"Anna Monus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/a601053a0ab457901e00cdc83bd5359e\"},\"headline\":\"Version Control in Visual Studio Code with Git [Guide]\",\"datePublished\":\"2016-06-14T15:01:43+00:00\",\"dateModified\":\"2017-11-22T15:22:57+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/\"},\"wordCount\":1203,\"commentCount\":4,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/version-control-git-vs-code\\\/git-install.jpg\",\"keywords\":[\"Git\",\"GitHub\",\"version control\",\"visual studio code\"],\"articleSection\":[\"Toolkit\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/\",\"name\":\"Version Control in Visual Studio Code with Git [Guide] - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/version-control-git-vs-code\\\/git-install.jpg\",\"datePublished\":\"2016-06-14T15:01:43+00:00\",\"dateModified\":\"2017-11-22T15:22:57+00:00\",\"description\":\"Integrated Git support is one of the greatest features of Visual Studio Code, Microsoft's new source code editor. Git is a distributed version control\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/version-control-git-vs-code\\\/git-install.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/version-control-git-vs-code\\\/git-install.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/version-control-git-vs-code\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Version Control in Visual Studio Code with Git [Guide]\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/a601053a0ab457901e00cdc83bd5359e\",\"name\":\"Anna Monus\",\"description\":\"Anna is Technical Editor and Writer for Hongkiat.com. She mainly covers front-end frameworks, web standards, accessibility, WordPress development, and UX design.\",\"sameAs\":[\"https:\\\/\\\/www.annalytic.com\\\/\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/anna_monus\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Version Control in Visual Studio Code with Git [Guide] - Hongkiat","description":"Integrated Git support is one of the greatest features of Visual Studio Code, Microsoft's new source code editor. Git is a distributed version control","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/","og_locale":"en_US","og_type":"article","og_title":"Version Control in Visual Studio Code with Git [Guide]","og_description":"Integrated Git support is one of the greatest features of Visual Studio Code, Microsoft's new source code editor. Git is a distributed version control","og_url":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2016-06-14T15:01:43+00:00","article_modified_time":"2017-11-22T15:22:57+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-install.jpg","type":"","width":"","height":""}],"author":"Anna Monus","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Anna Monus","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/"},"author":{"name":"Anna Monus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/a601053a0ab457901e00cdc83bd5359e"},"headline":"Version Control in Visual Studio Code with Git [Guide]","datePublished":"2016-06-14T15:01:43+00:00","dateModified":"2017-11-22T15:22:57+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/"},"wordCount":1203,"commentCount":4,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-install.jpg","keywords":["Git","GitHub","version control","visual studio code"],"articleSection":["Toolkit"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/","url":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/","name":"Version Control in Visual Studio Code with Git [Guide] - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-install.jpg","datePublished":"2016-06-14T15:01:43+00:00","dateModified":"2017-11-22T15:22:57+00:00","description":"Integrated Git support is one of the greatest features of Visual Studio Code, Microsoft's new source code editor. Git is a distributed version control","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-install.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/version-control-git-vs-code\/git-install.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/version-control-git-vs-code\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Version Control in Visual Studio Code with Git [Guide]"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/a601053a0ab457901e00cdc83bd5359e","name":"Anna Monus","description":"Anna is Technical Editor and Writer for Hongkiat.com. She mainly covers front-end frameworks, web standards, accessibility, WordPress development, and UX design.","sameAs":["https:\/\/www.annalytic.com\/"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/anna_monus\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-6Vr","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/26625","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/146"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=26625"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/26625\/revisions"}],"predecessor-version":[{"id":41657,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/26625\/revisions\/41657"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=26625"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=26625"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=26625"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=26625"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}