In this unit, you will create a Giphy App. The Giphy App will take a search term as an input and display a random Gif in a thumbnail on the screen. To create this project, you will learn the anatomy of an API Request, use AJAX to make a simple GET request, handle a JSON response object, and use jQuery to display a gif.
Follow the steps below to make your very own site! Make sure to check off your items as you complete them. [ ] => [x]
- Go to the repository at https://github.com/ScriptEdcurriculum/giphy
- Fork this repository to your github account and clone it to a new workspace
- Review your Starter Code and make sure you understand what code has already been written for you.
- Add, commit, and push your changes
- Make your site live on gh-pages
- Create an AJAX function inseide the click handler
- Get the response from using your search URL https://api.giphy.com/v1/gifs/search?q=puppy&rating=pg&api_key=dc6zaTOxFJmzC
- Display the original image to the screen
- Push your changes!
- Take user input from the input box when button is clicked
- Update the API request url based on user input
- Display the image to the screen
- Push your changes!
- Complete one of the folowing extensions
- Create a button that randomly chooses only one gif from response.
- Display all the images in the response to the screen.
- Create a mail_to link that will email the gif to anyone you want.
- Make the gif pop out in a modal when clicked on.
- Push your changes!