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.

Getting Started

To get this app running locally all you need to do is:

1. Fork this repo into your personal github account.
2. Clone the forked repo into your computer git clone [email protected]:[YOUR_USERNAME]/flickr-gallery.git
3. In the created folder install the node modules npm install
4. Run the app npm start
5. Your local app should be available at http://localhost:3000

Your Tasks

This project includes several tasks for different skill levels. You may try completing them all but if you are new to Web Development, complete the tasks that are a bit above your level. You can and should learn new skills during the process, you may consult with Google and friends but you will need to explain why you implemented what you implemented, so be responsible for your code.

Task 1 - 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. (easy)
2. Rotate: each click should rotate the image by 90 degrees. (intermediate)
3. Expand: clicking an image should display this image in a larger view. (hard)

Task 2 - 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. (easy)
2. Infinite Scroll: currently the gallery displays only 100 images. Create a mechanizm that loads more images from flickr when the user is scrolling past the last image. (hard)

Tips

• You don't need to complete all tasks. If you are new to web development, finish only the easy tasks. If you have the required skills, try to complete the intermediate and hard tasks too. This test is designed to see how you complete tasks that require self learning, not to test your existing knowledge.
• You can see a working demo video of the completed app here
• Think about the product you create, try inovating the user interface, you don't have to create the exact solution in the video, be creative.

Deploying Your Project

After you've completed your tasks, and you are ready to submit it, do the following:

1. Make sure your code is on the master branch and that it is pushed into your repo.
2. Run the deploy script npm run deploy
3. You project should be live on https://[YOUR_USERNAME].github.io/flickr-gallery/
4. Send us an email with the repo link and the deployed app link
5. Profit

Good Luck!