Instafetch.js

Pourquoi ce plugin ?

Pas de jQuery. Pourquoi utiliser un fichier de 87 Ko uniquement pour écrire du code JavaScript uniquement utilisé pour AJAX afin de renvoyer du code JSONP ? Utilisons fetch à la place. Instafetch.js est un fichier de 6 Ko qui renvoie votre flux Instagram avec la possibilité d'inclure des légendes.

Installation

Instafetch.js est disponible sur CDNJS, NPM, Bower et GitHub.

CDNJS

<script src="https://cdnjs.cloudflare.com/ajax/libs/instafetch.js/1.5.0/instafetch.min.js"></script>

NPM

$ npm install --save instafetch.js

require('instafetch.js');

Bower

$ bower install instafetch.js

<script src="chemin/vers/bower_components/instafetch.js/dist/instafetch.min.js"></script>

Télécharger via GitHub

(Ou Contribuer)

Comment l'uiliser ?

L'API Instagram utilise le protocole OAuth 2.0, vous aurez donc besoin d'un jeton d'accès. Le moyen le plus simple d’obtenir votre jeton d’accès est de vous connecter à Instagram sur votre navigateur et d’en générer un sur le site Pixel Union.

instafetch.init({
  accessToken: 'JETON_D_ACCES', // Jeton d'accès Instagram
  target: 'instafetch',         // Conteneur
  numOfPics: 20,                // Nombre de photos
  caption: false                // Description
});

Instafetch.js rechercherai un élément avec l'ID de instafetch par défaut. L'élément cible peut être modifié lors de l'initialisation du plugin.

Le plug-in vous permet également de définir le nombre d'éléments à renvoyer à partir de votre flux et si vous souhaitez inclure les légendes.

Promise Polyfill

Instafetch.js ne comptait initialement que 3 Ko, mais ces 3 Ko ne prennent en charge aucune version d'Internet Explorer. IE renverra "Promise is undefined" et le flux Instagram sera vide. La version 1.2 incluait le polyfill ES6-Promise, qui ajoutait 7 Ko supplémentaires à IE. La version 1.3 a supprimé le polyfill ES6-Promise pour un autre polyfill Promise qui n'a ajouté que 3 Ko.