index.html

<!DOCTYPE html>  

<style>

    #banner {
        background: #ff6600;
        border-radius: 6px;
        padding: 20px;
        margin: 10px;
        color: #fff;
        font-size: 29px;
        font-family: "Helvetica Neue";
        font-weight: 100;
    }
</style>
<html lang="en">   
<head>   
<div id="banner">
    <span id="banner-message">Hacker News Feed</span>
</div> 

<meta charset="utf-8">
<link href="./bootstrap.css" rel="stylesheet">  
</head>  

<body>  

<!-- Google Tag Manager -->
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-PZWSZ2"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-PZWSZ2');</script>
<!-- End Google Tag Manager -->

<table id="feed" class="table table-striped">  </table>
<script src="http://cdn.pubnub.com/pubnub.min.js"></script>
<script>
    function createTable(json) {
        var table = document.getElementById("feed");
        table.innerHTML = "";
        for (var i = 0; i < 30; i++) {
            var row = table.insertRow(i);
            var obj = json[i];
            cell1 = row.insertCell(0);
            cell2 = row.insertCell(1);
            cell3 = row.insertCell(2);
            cell1.innerHTML = obj["rank"];
            cell2.innerHTML = '<a href="'+obj["link"]+'" target="_blank">'+obj["title"]+'</a>';
            cell3.innerHTML = '<a href="'+obj["comments"]+'" target="_blank">'+"Comments"+'</a>';
        }
    }
    function pubSub(){
        var pubnub = PUBNUB.init({
            publish_key: "demo",
            subscribe_key: "demo"
        });

        pubnub.subscribe({
            channel: "hacker-news",
            message: createTable
        });
    }
    pubSub();
</script>
</body>  
</html> 