Flickr ajax

Overview

Display photos using Flickr api

date

March 2017

tools used

HTML, CSS & jQuery

How

By using Flickr's api to access the photo feed. The images display based on the tag name which is the text on the button. By using jquery $.getJSON() and passing in the flickerAPI as the url, the flickrOptions object as the data and the displayPhotos function as the success. The data is the part which links the tag name to text of your choice, in this case animals. Within the data section the format can be set to JSON. The function to display makes use of jquery each to loop through the object of flickr information. The $.getJSON() method takes three arguments, url, data and a success function that deals with the data returned. Here the success function can display the data by building up html strings and finally append to the dom.

Learnt

AJAX using $.getJSON() method. Social API.

See the Pen AJAX Flickr by Harry Beckwith (@fun) on CodePen.

← Back to all projects