Ok so maybe 15 minutes is a little bit ambitious, but the point of this post is to show how easy you can setup a dev environment for anyone that is interested in contributing to PnP (or any other GitHub project for that matter).
Visual Studio Code
Recently Microsoft released a preview version of Code. https://code.visualstudio.com/ Basically Code is a very slim (and free) version of Visual Studio and can be used to “Build and debug modern web and cloud applications.”. Sounds good right!? At first sight Code is not much of an editor when compared to Visual Studio of course. But since it’s free and has GIT compatibility I wanted to gave it a shot with the OfficeDev PnP Git repository to show how easy it is to contribute to the community.
Let’s set this environment up!
Before I start writing this post I already had a Github account and forked the PnP to my Company Github. This is a very easy step which is described in the first chapter of this wiki: https://github.com/OfficeDev/PnP/wiki/Setting-up-your-environment
After you have this fork in place you can close down this wiki and continue here and Download Code from https://code.visualstudio.com/ and run setup. No further questions asked it just installs. Opening Code gives us the following interface.
Advanced GIT setup
In my search for good tutorials on how to setup GIT with PnP I came across the PnP Wiki which I mentioned before, but also this post from Patrik Björklund http://blog.cognit.se/hardcore-git/ I decided to follow this last one for a good GIT setup. The next steps are coming from this post.
Download CMDer (https://github.com/bliker/cmder/releases/tag/v1.1.4.1) and Pathman (https://code.google.com/p/pathman/) and unzip in a folder of choice for tooling. Pathman is a nice piece of software with a GUI to add Path variables. CMDer is a good looking commandline tool with GIT aboard. When both tools are unzipped start Pathman and add the path to bin folder where git.exe is stored “[CMDER folder]\vendor\msysgit\bin\”
Next up you can follow step 2 of Patriks Blog http://blog.cognit.se/hardcore-git/ to setup authentication with Github. This makes it easy to stay authenticated so you don’t have to put in your credentials constantly when developing. However if you don’t want to do this you can continue here.
Get your GIT together
Ok the following step is to get all Git repositories in sync so we can start developing! Fire up CMDER and start typing the following set of commands:
First set your CMDER path to a folder on your filesystem where you want your PnP repository to land. Then type:
git clone https://github.com/YOURUSERNAME/PnP (This is the url to the Fork you made in the very first step of this post)
The clone will land in the folder “PnP” so use cd PnP to go to your new clone. Next you need to create a remote to the original OfficeDev PnP repository to retrieve latest updates when you want to.
git remote add upstream https://github.com/OfficeDev/PnP
Now we create a dev branch for development by using:
git checkout -b dev origin/dev
Now make sure that the upstream remote is fetched so we can pull it to the dev branch
git fetch upstream
In order it looks like this
The final step now is to checkout the dev branch and pull the upstream to the dev branch
git pull upstream dev
This action will fill your console with a lot of info so I’ll spare you that screenshot :). When this is done you can setup Code with this fresh Git branch.
Code and GIT
Now we have a valid dev branch on our local dev machine we can configure Code to use this folder. This way we can commit changes to our branch from Code. The only thing you have to do is Open Folder and choose you PnP GIT repository on your filesystem and start Coding!
