Over a million developers have joined DZone.

Private Web Application Running on Github

DZone's Guide to

Private Web Application Running on Github

· DevOps Zone
Free Resource

The DevOps Zone is brought to you in partnership with Sonatype Nexus. The Nexus Suite helps scale your DevOps delivery with continuous component intelligence integrated into development tools, including Eclipse, IntelliJ, Jenkins, Bamboo, SonarQube and more. Schedule a demo today

I wanted to launch a small web application in stealth mode. I also wanted it to run completely on GitHub, using GitHub Pages. I was able to setup a GitHub repository, as a private repo, then was able to launch a GitHub Page for the same repository and make this branch public.

This approach gives me two branches to work with. The master which is private and the gh-pages which is public. Using Jekyll I was able to quickly setup a basic website in the gh-pages brand of my repository. Once I had the basic site outline and index page setup, I needed a way to make content show on each page, but only for people who had access.

To secure my website I did two things. First I setup a JSON file that was stored in the private, master branch of my site repository. Then I setup my site to pull the navigation of the site and the content for each page from this JSON file. My site would load the home page, about page and other pages from this private JSON file.

Next I needed to provide a key to my private website, one that would allow the public gh-pages branch to pull the JSON file from the private master branch. I opted to use oAuth as the authentication layer. I went to my GitHub settings and generated an oAuth key for a specific application I set-up for my project. Using this key I can control who has access to my site.

  <script type="text/javascript">
        function getUrlVar(key){
            var result = new RegExp(key + "=([^&]*)", "i").exec(window.location.search); 
            return result && unescape(result[1]) || ""; 
        $ThisPage = getUrlVar('p');    
            $ThisPage = "Home";
        $token = getUrlVar('t');
        var github = new Github({
            token: $token,
            auth: "oauth"
        var repo = github.getRepo('kinlane', 'api-commons');
        repo.read('master','site.json',function(err, data){            
            if(!err) {
                $Site = jQuery.parseJSON(data);
                // Build the navigation
                $.each($Site['navigation'], function($key, $value) {
                    $value = $value + '?p=' + $key + '&t=' + $token;
                    $NavigationString = '<li><a href="' + $value + '" title="' + $key + '">' + $key + '</a></li>';
                // Build the Page Content
                $.each($Site['pages'], function($key, $value) {

When you visit the website URL, then append the oAuth token as a variable, all the content shows on the website. Using Github.js I pass the oAuth token and authenticate with the master repository, pull the contents of the JSON file and publish to the page.

My JSON file located in the private master repository acts as a sort of backend database to my public gh-pages repository which is actually viewed publicly at the website URL. Using JavaScript, the GitHub API and oAuth for security I'm easily able to control access to the web application.

A more advanced approach to this would be to require oAuth authentication using GitHub, allowing each user to be managed through GitHub team or collaborators settings. Then I could control each user who has access, but the approach applies to both scenarios, and is a pretty quick and dirty way to launch a private web site or application, that completely runs on GitHub.

The DevOps Zone is brought to you in partnership with Sonatype Nexus. Use the Nexus Suite to automate your software supply chain and ensure you're using the highest quality open source components at every step of the development lifecycle. Get Nexus today


Published at DZone with permission of Kin Lane, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

The best of DZone straight to your inbox.

Please provide a valid email address.

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}