github
あなたのウェブサイトにGitHubタイムライン/フィードを表示する

あなたのウェブサイトにGitHubタイムライン/フィードを表示する

このドキュメントでは、GitHubのフィード/タイムラインをウェブサイトに表示する方法について説明します。

例：実例は以下から入手可能です：

https://newtonjoshua.com

GitHubタイムライン：

GitHubは、Atom形式の任意のユーザーの公開タイムラインを提供します。

あなたのタイムラインは以下の場所で見ることができます：

https://github.com/ {{GitHub_username}}。atom

https://developer.github.com/v3/activity/feedsを参照してください。

GoogleフィードAPI：

フィードAPIを使用すると、Atom、RSS、MediaのいずれかのRSSフィードをJavaScriptのみでダウンロードできるため、わずか数行のJavaScriptでコンテンツやその他のAPIとフィードをマッシュアップできます。これにより、ウェブサイトに簡単にフィードを統合することができます。

次を参照してください： https : //developers.google.com/feed/v1/devguide

JavaScript APIの読み込み：フィードAPIの使用を開始するには、ウェブページのヘッダーに次のスクリプトを含めます。

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

次に、google.load（モジュール、バージョン、パッケージ）を使用してフィードAPIを読み込みます。

<script type="text/javascript">
  google.load("feeds", "1");
</script>

フィードURLの指定：次のようにgoogle.feeds.Feed（）を呼び出すことができます：

var feed = new google.feeds.Feed("https://github.com/{{GitHub_UserName}}.atom");

フィードを読み込む： .load（コールバック）は、Googleのサーバーからコンストラクタで指定されたフィードをダウンロードし、ダウンロードが完了したら指定のコールバックを呼び出します。

<script type="text/javascript">

    function initialize() {
      feed.load(function(result) {
        if (!result.error) {
          var container = document.getElementById("feed");
          result.feed.entries.forEach(function (feed) {
            var feedTitle= feed.title; 
            var feedLink = feed.link;
            var feedDate = formatDate(feed.publishedDate);
            var feedContent = formatContent(feed.content);

           // display the feed in your website
          });
        }
      });
    }
    google.setOnLoadCallback(initialize);

    </script>

onLoadハンドラの呼び出し： setOnLoadCallback（コールバック）は、この呼び出しを含むページがロードされると呼び出される指定されたハンドラ関数を登録する静的関数です。callbackは、格納されているドキュメントがロードされ、APIが使用可能な状態

<script type="text/javascript">
    google.setOnLoadCallback(initialize);
 </script>

フィードエントリ数の設定： .setNumEntries（num）は、このフィードによって読み込まれたフィードエントリの数をnumに設定します。デフォルトでは、Feedクラスは4つのエントリを読み込みます。

var feed = new google.feeds.Feed("https://github.com/{{GitHub_UserName}}.atom");
feed.setNumEntries(500);

これで、GitHubのフィード/タイムラインをフォーマットしてWebサイトに表示することができます。