github
Affichage de la chronologie / des flux GitHub sur votre site Web

Affichage de la chronologie / des flux GitHub sur votre site Web

Ce document explique comment afficher vos flux / timeline GitHub sur votre site Web.

Exemple: Un exemple en direct est disponible à l'adresse suivante:

https://newtonjoshua.com

Calendrier GitHub:

GitHub fournit la chronologie publique pour tout utilisateur au format Atom.

Vous pouvez voir votre calendrier à:

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

référez-vous à: https://developer.github.com/v3/activity/feeds

API de flux Google:

Grâce à l'API Feed, vous pouvez télécharger tout flux RSS Atom, RSS ou Media en utilisant uniquement JavaScript, afin de pouvoir combiner des flux avec votre contenu et d'autres API avec seulement quelques lignes de JavaScript. Cela facilite l'intégration rapide des flux sur votre site Web.

reportez-vous à: https://developers.google.com/feed/v1/devguide

Chargement de l'API JavaScript: Pour commencer à utiliser l'API de flux, incluez le script suivant dans l'en-tête de votre page Web.

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

Ensuite, chargez l'API Feed avec google.load (module, version, package).

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

Spécification de l'URL du flux: Vous pouvez appeler google.feeds.Feed () comme suit:

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

Chargement d'un flux: .load (callback) télécharge le flux spécifié dans le constructeur depuis les serveurs de Google et appelle le rappel donné à la fin du téléchargement.

<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>

L'appel du gestionnaire onLoad: setOnLoadCallback (callback) est une fonction statique qui enregistre la fonction de gestionnaire spécifiée à appeler une fois que la page contenant cet appel est chargée, où callback est une fonction requise lorsque le document contenant est chargé et que l'API est prête à être utilisée

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

Définition du nombre d'entrées de fil: .setNumEntries (num) définit le nombre d'entrées de fil chargées par ce fil sur num. Par défaut, la classe Feed charge quatre entrées.

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

Maintenant, vous pouvez formater et afficher vos flux / timeline GitHub sur votre site Web.