Instagram feed

I want to display the last few image of my Instagram. Do you have any advice? I found instafeed.js, but it will stop woking completely on March 31, 2020.

Hello Koli,

I’ve been taking a look at the issue, and it looks like the source of the problem is Instagram deprecating its API.

In any case in one of the issues of the instafeed repo, a user has created a simple code to get the latest pictures from the feed:

Let us know if it’s enough for you :blush:

Thanks Pablo. To be honest, I have no idea, how to do it in Frontity. I set up the Zap, as described in this link, added JQuery with npm install jquery --save,
added to my footer.js this code:

const InstaFeed = () => {
  $.get("", function(data) {
      .each(function() {
        // or "item" or whatever suits your feed
        var el = $(this);
        var title = el.find("title").text();
        var link = el.find("link").text();
        var image = el.find("enclosure").attr("url");
        var description = el.find("description").text();
          '<a href="' +
            encodeURI(link) +
            '" target="_blank" title="' +
            title.replace("Caption: ", "") +
            '"><img src="' +
            encodeURI(image) +
            '" alt="' +
            title.replace("Caption: ", "") +
            '" /></a>'
  return null;

But I have no idea how to create an HTML element with the id #instafeed, and I get this error:

TypeError: jquery__WEBPACK_IMPORTED_MODULE_6___default.a.get is not a function
      at InstaFeed (webpack-internal:///./packages/frontity-chakra-theme/src/components/footer.js:13:7436)
      at processChild (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:397:2319)
      at resolve (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:396:122)
      at ReactDOMServerRenderer.render (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:433:1199)
      at (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:433:55)
      at renderToString (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:470:116)
      at app.use (webpack-internal:///./node_modules/@frontity/core/src/server/index.tsx:45:243)
      at process._tickCallback (internal/process/next_tick.js:68:7)

I really discourage you to mix jQuery with React. It leads to bad performance and UI problems.

These days there are React packages in npm for almost anything you can imagine.

Thanks @luisherranz and @Pablo!
I succesfully created my InstaFeed with Zapier and Axios. I also created a mini-Tutorial about it. Cheers!


Great to see that you made it work @koli14!