Visual Studio Source Control With Git & Visual Studio Online

I’ve used a variety of source control systems over the years.  My first experience with source control was with the old Concurrent Versions System, aka “CVS”.  When I first started working at Atari in 1990, the programmers in the TOS operating system group (for the ST computers) were using CVS to manage the source code.  I didn’t immediately adopt it myself, however, because the CVS tools weren’t actually running natively on the Atari quite yet.  The TOS programmers were doing their builds via a TTY connection to a PDP-11 system called “Beauty” that functioned as a file server and build server.

There weren’t really any version control tools running natively on the Atari back in those days, but a few years later I transitioned to using a PC as my main machine. I tried using CVS but didn’t really care for it.  Then I had a chance to try out Microsoft’s Visual SourceSafe product, and it became my main source control tool for the next several years.

After Microsoft discontinued Visual SourceSafe, I ended up using Perforce for my own source control needs for many years.  I was happy with Perforce and reasonably proficient at using it.  It worked with Windows and Mac, had a reasonable GUI front-end so I didn’t have to deal with command line tools too often.

Unfortunately, I recently lost access to the server I’d been using for a remote Perforce repository.   I was able to clone everything off before it went away, but until recently,  I hadn’t yet decided what to do about a new remote repository.  I could simply run Perforce locally and periodically back it up to the cloud but I wasn’t in any big hurry so I have been experimenting with different setups for awhile.

I finally found one I like.

Introducing Visual Studio Online

Microsoft has a website called Visual Studio Online that is designed to help both individual developers and development teams to get the most out of the Visual Studio development environment. One of the nice features is that after you’ve created a free account, you can manage source code projects with their  Git source control repositories. Did I mention it was free?

There are other free Git repositories out there, but they’re generally aimed at open source and don’t allow private, restricted-access projects. Which make them unsuitable for many developers.  Paid options generally aren’t too expensive, but even $10 a month gets to be noticeable after awhile. Source control projects on Microsoft’s Visual Studio Online, however, are private by default.  After all, they have the open-source, free access side of things pretty well covered via their CodePlex site.

So far I’ve only scratched the surface of the options available with a free account, but Visual Studio Online does offer paid services as well.  If you need more than 5 users on a project or more sophisticated project management tools, they have varying plans starting at $20 per user per month.  There’s also an option that includes a subscription-based license for Visual Studio.  And like most of Microsoft’s other developer stuff, if you’ve thrown a bunch of money at them to become a MSDN subscriber, all of this is included anyway.

This post is aimed mainly at two categories of developer.  Those who haven’t used Git to manage a project before, and those who haven’t used the source control features in Visual Studio. Up until recently I was in both of those categories myself.  My previous experience with Git was mainly limited to using it to download various libraries or open source projects created by others.  I’d never really tried to use it to manage my own projects.

But, after discovering Visual Studio Online’s setup, and having switched over to Visual Studio 2013 last year, I decided to give it a try.

My first project went OK, but when I tried to do it again with another project, I came to the conclusion that I’d gotten lucky the first time around. Maybe it would have made more sense if I’d been more experienced with GIT, but I found the process somewhat confusing.  I went online and browsed around awhile looking for a tutorial, but didn’t find anything that covered the entire process from start to finish.

After banging my head against the keyboard for awhile, I eventually got it more or less figured out.  But since I’d never really found the sort of basic introduction anywhere online, I thought maybe it’d be a good topic to write about.

Install The Git Command Line Tools

Before we do anything else, let’s make sure the Git command line tools are installed.  Go to the View menu and select the Team Explorer item near the top. This will open the Team Explorer view if it’s not already open.  Find that window and click the Home icon from the icons at the top, then click Settings in the next screen.

Once you’re in the Settings screen, near the bottom there should be a section labeled Git, and one of the links underneath it should be Install 3rd Party Tools.  Click that and follow the prompts.

New Project Time

Let’s assume you already have an existing project in VS2013 that hasn’t yet been added to source control.  In the Solution Explorer window, right-click on the solution name at the top, and select “Add Solution To Source Control” from the pop-up menu.

001

You can also create a new project and select the Add To Source Control option at the bottom right corner of the window.

014

Assuming that you haven’t gone into the Visual Studio preferences and set a specific source control option, either of these steps will bring up a window asking you to select between the different options for source control.  By default if no add-ons for other systems are installed, you’ll see choices for Team Foundation Server and for Git.  As previously indicated, we’ll be using Git.

002

A new repository will be created in the solution directory.  You can view the available local repositories by going to the View menu and selecting Team Explorer. Then click the Connect  (electrical plug) icon.  Your new repository should be shown at the bottom of the list of Local Git Repositories.

003

Now you’ve created a repository for your project, but you haven’t actually added any files to it.  Let’s do that now.  But first, look at the Solution Explorer and you’ll see that some of the entries now have a little plus sign icon at the left side.  This indicates that these files are under source control and that they need to be added to the repository.

Click the Home icon, then select Changes from the window.

004

This will take you to the Changes screen, where you can commit changed files, or add new ones, to the repository.  You should see a list of the Included Changes, which is the list of files that are about to be added or updated, followed by Excluded Changes, which is a list of other files that Git thinks should be updated, but which won’t be, and finally at the bottom is a list of Untracked Files which are other files found in the project’s directory that are not under source control.

005

Note that the list of Included Changes shows “[add]” at the end of each line.  This specifies that the file is not yet contained in the repository but will be added.

Now let’s type “Initial Check-in” into the yellow edit box at the top, where it’s asking us to enter a commit message.  Every time you add or update files, you need to include a message of some sort.  Ideally this describes what the changes or additions were, so that three months from now you can figure out what happened.  Once you’ve typed in a message, the Commit button will become enabled.  Click it when you’re done.

006

Now at the top of the window you should see a message indicating the Commit was created.    You should also see that the plus sign icons in the Solution Explorer window have been changed to little padlock icons.  This indicates that they have been saved in the repository and no changes have been made since.

Note that it also asks you to “Sync to share your changes with the server.”  This is asking us to synchronize with another Git server based somewhere on the web or your local network.  If you’ve never done this before (which we haven’t in this example) then clicking it will prompt us to specify the remote server.

007

And that takes us to…

Visual Studio Online

This is where the connection to Visual Studio Online comes in.  If you haven’t already done so, you’ll need create an account.  (Click here).  Note that you could also enter the name of any other remote Git repository other than Visual Studio Online, but that’s what we’re using for this example.

Visual Studio Online offers a lot more than just a Git repository, by the way, so if you haven’t given it a good look, you really should.

Once you’re signed into your Visual Studio Online account, go create a new project:

008

This will bring up a pop-up for you to enter information about the new project.  Enter the project name and select Git as the source control method.  Note that there is an option for Process Template that will allow you to select from different development process strategies like Scrum or Agile.  This doesn’t really affect our source control situation, but it does change a few things about how Visual Studio Online otherwise helps you manage the project.  It’s something you might want to take a good look at after finishing this article.

009

After you create the project, select the Navigate To Project button at the bottom.  Then in the next screen, select Add Code.  This will take you to a screen with important info about the new Git repository that has just been created for your project.

010

The red arrow points to the URL for the repository.  This is what you need to enter as the “remote server” back in Visual Studio.  So, let’s copy that from the web browser.

Back To Visual Studio

Now we switch back to Visual Studio and paste that URL into the yellow edit field:

007

After you’ve pasted in the URL, click Publish and your local repository will be copied to the remote one. Note that you may be prompted to enter your login credentials for the Microsoft account you used when you signed up at Visual Studio Online.

This operation is more or less the same as issuing the following command lines from the solution folder:

git remote add origin https://xyz.visualstudio.com/DefaultCollection/_git/pdq 
git push -u origin --all

Where “xyz” is the name of your Visual Studio Online account and “pdq” is the name of the project you created in it.

After The Initial Add & Publish

Once you have added your files to your local repository and published them to the remote one, it’s fairly easy to manage things, at least as far as basic operations like adding new files, publishing updates, etc., are concerned.  Of course if you get into more advanced functions, things get more complex.

We’re not going to get into the underlying methodology of using Git’s more advanced functions in this article. If you want to look at the documentation for it, click here.

Checking out a file for changes is automatic within the Visual Studio IDE.  Simply double-click a file in the Solution Explorer as you always did.  When you’ve changed a file, the icon at the left side will change from a padlock to a red checkmark to indicate that the file is checked out locally and that changes need to be committed.

Now if you go back to the Team Explorer window and look under Changes, you’ll see that there is just one file listed under Included Changes.

012

Enter “minor changes” as the commit message and then click the Commit button.  It will save the change to the local repository, then give you a link to sync the changes to the remote repository.

You don’t have to sync every commit with the remote repository immediately, but it usually only takes a brief moment so unless you’re offline it’s probably a good idea. Click where it says “Sync” and it will take you to the Unsynced Commits display. Here it will show that there is one local commit awaiting a push to the remote repository. Click the Push button to synchronize the two.
013

Ongoing Changes & Additions

Once you have committed the changes to a file, it’s marked with the padlock icon again in Solution Explorer. It will remain that way until you open it and make changes again.  Even if you make changes using an external program, Visual Studio will notice and mark it with the red checkmark.

As you create new files within your project, they’ll initially have the little plus sign icon until you have done a Commit operation that adds them to the repository.

In Conclusion

In a future article we’ll discuss more advanced topics like creating a code branch and how to reconcile multiple versions of a file which have been changed by different users.

The Git tools within Visual Studio aren’t necessarily the most sophisticated, but they’re sufficient for most basic operations.  You can always use other popular tools for Git management such as SourceTree or the Git command line tools.  There are also a variety of extensions for Visual Studio that provide additional functionality.

Most importantly, if you’re an individual developer who hasn’t been in the habit of using source control, you really need to reconsider that idea. My guess would be that you’ve avoided it because it just seemed like too much extra work.  Easier just to ZIP up your source code directory and save it to another drive, yes?

No, not really. The tools built into Visual Studio minimize the extra work you’ll need to do, and the advantages to using a source code control system are more than worth it.  Don’t forget also that you can use the source control functions with any sort of Visual Studio project.  Even if it’s just a plain HTML website.

For customers who are interested in creating a blog, or who need a content management system, we usually recommend using the popular WordPress content management system.  For customers on a budget, WordPress is a great way to go because the software itself is free.

One of the greatest strengths of WordPress is the ability to use custom themes so you can customize the appearance of your website.  There are a wide variety of different themes around the web to choose from.  Some websites offer “premium” themes, but there are thousands of free themes available as well.

  • WordPress Custom Themes – We can help you select one of the many excellent free themes out there, and then customize it as needed to make it your own.  If you can’t find an existing theme that you like, we can create an entirely new custom theme for you!
  • Ultra-Customized WordPress Themes – There are a lot of great WordPress themes out there, but most of them do nothing more than change around the colors, background images, and rearrange where everything goes on screen.  They don’t offer any additional functionality.  If you need something more, then you need a theme that is customized for your specific needs.  When you need customization that goes beyond shuffling artwork, we’ve got the programming skill and experience to make your theme do whatever you need.
  • Custom WordPress Plugins – There are many plug-ins out there for WordPress that cover a lot of subjects, but if we can’t find one that does what you need, we can create it as needed!  We can even integrate customized plug-ins with your custom theme to take WordPress beyond the usual limits.

Are you lost every time you go to the store to buy a new computer? Do you need a new laptop, or a new printer, and you just don’t know which one to buy?

Let Mike Fulton Consulting help.  We’ll sit down with you and figure out which features are the most important and we’ll do the product research for you! Having the right facts before you buy makes all the difference.

We also offer custom application programming for Windows or Macintosh platforms, database programming, mobile development for Android and iOS, and much more.

If you have questions, please send EMAIL or select the Contact Mike item in the main menu. Please include details about your interest, and make sure to include complete contact information.

Big companies usually have a full-time staff of IT techs who are ready to go whenever someone around the office needs a new printer installed, or when the WiFi isn’t working, but small businesses can’t afford that luxury.

When small businesses have an IT problem, it often gets ignored because nobody knows what to do. At best, an inefficient workaround is used, hurting productivity.

Now there’s another option. Mike Fulton Consulting can be your on-demand IT staff! We can help you get new computers up and running, install printers and other peripherals, install software, and more. Give us a call!

Our main focus these days is website design and creation. If you have specific requirements, let us know and we’ll find the solution that’s best for you.  If you don’t know the specifics for your new website, talk to us and we’ll help you figure it out!

For those sites running on Microsoft-based servers, we can do custom, high-performance ASP.NET solutions.

If you’re using a Linux-based server, we can do a completely customized solution or we we can start off with a popular web content management system such as WordPressDrupal, or Joomla and customize things as needed.  Want to set up an eCommerce site and get your merchandise on the web?  We can do that too!