Skip to content

lieblichaaron/advanced-gallery-exam

 
 

Repository files navigation

Flickr Gallery

Welcome to the Flickr Gallery application. This app is simple, you write a tag at the top and you get images from flickr with that tag.

Your Tasks

Step 1 - Installation

  • Fork this repo to your own account
  • Install the dependencies and run it

Step 2 - Image Actions

Each image has three buttons that appear on mouse hover. You need to make them work.

  1. Delete: clicking the delete button should remove the image from the display.
  2. Rotate: each click should rotate the image by 90 degrees.
  3. Expand: clicking an image should display this image in a larger view.

Step 3 - Gallery Actions

  1. Responsive: the gallery adjusts the size of each image so that all the images will fit into the screen without margin. However, when the window is resized, the images are not fitted so well. Make sure the images are always adjusted to the window width.
  2. Infinite Scroll: currently the gallery displays only 100 images. Create a mechanism that loads more images from flickr when the user is scrolling past the last image.
  3. Drag & Drop: let your users choose the order of the images by adding an option to drag & drop images to their new position.

Step 4 - Wrapping Up

  1. Try inovating the product, add any features you think are useful. be creative, creative is good.
  2. Deploy your result as a github page to https://[YOUR_USERNAME].github.io/flickr-gallery/
  3. Send us an email with your repo link and the deployed app link

Tips

  • Write readable code, and use descriptive commits (we'll need to figure out what you did)
  • Write tests for the features you write and make sure they pass (tests are written in spec.js files)
  • Be responsible for your code. You may consult with Google about the code you write but you will need to explain what you did.

Good Luck!

Addition

  • Added input option for multiple tags to search. Tags are collected as an array and joined to the format that flickr's api accepts them in the query string.

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 87.8%
  • SCSS 10.0%
  • HTML 2.2%