VSTS widget for GitHub badges

category: [ VSTS / TFS ] tags: [ GitHub Projects ] [ VSTS / TFS ] [ VSTS Extensions ]
created: 28 Jan 2016 @ 09:53 modified: 24 Apr 2017 @ 13:57


When I first heard about the SDK for widgets in Visual Studio Team Services (VSTS) I wanted to make a couple of widgets, one of these was a GitHub widget that would show some info from any GitHub repo on your VSTS dashboard. This can can be helpful when you have your source open on GitHub but still work out of VSTS.

The implementation is very simple and you can see it and contribute on GitHub on one of my projects VSTS.GitHubWidget.

Install

Go to the Visual Studio Marketplace and head over to the Integration section and look for GitHub Widget

image

You can also follow this link for GitHub Widget. Now all you need to do is hit Install

ApplicationFrameHost_2016-01-28_10-53-57

Click Continue

ApplicationFrameHost_2016-01-24_22-17-53

and then click on Confirm to install the extension

ApplicationFrameHost_2016-01-24_22-18-42

and you will now have the extension installed in the account you selected.

ApplicationFrameHost_2016-01-24_22-19-48

Usage

On your dashboard click the add widget button

chrome_2016-01-24_22-21-45

This will popup the widgets catalog and you will notice the GitHub widget in the list of widgets in the catalog, click on it and then click Add.

ApplicationFrameHost_2016-01-28_11-52-33

Your new widget will appear on your dashboard blank

chrome_2016-01-24_22-24-24

Click on the Configure icon and the settings will fly out from the right. Enter a name for the widget as well as the username and repo that you want to get information for

ZoomIt64_2016-01-28_10-09-04

Now click Save and your widget configuration will be applied to your widget and it will show you the counts for Stars, Watches and Forks on your dashboard.

firefox_2016-01-28_10-10-16

When you are finished editing your dashboard the tick icon to complete editing your dashboard

chrome_2016-01-24_22-30-38

Now every time you land on your dashboard you will automatically gain insights into your GitHub projects.

firefox_2016-01-28_10-10-37

Enjoy

ABOUT ME

Gordon Beeming works at Nologo Studios in the sunny city of Durban, South Africa. He is the Lead for the Data and Services Team and has a strong focus on Developer Efficiencies and R&D. When he's not hacking away at a keyboard in Visual Studio he'll generally be relaxing with his family or hitting the black top getting in some mileage. He is a Visual Studio ALM Ranger and Visual Studio ALM MVP.

Follow me on Strava