/06-Ajax

Primary LanguageJavaScript

University of Denver

Class: DU_VIRT_FSF_PT_09_2019_U.O.MW

Program: Full Stack Flex Online Part-Time

06-AJAX Assignment 2 (Code-name: GifTastic, AKA GIT-Tastic Dance Machine)

...........................................................................................................

GIT-Tastic Dance Machine Overview

About

In this assignment, I've created a fun and interactive program for web browsers utilizing the GIPHY API, jQuery, Javascript, CSS, and HTML to make a web page that populates with gifs of the users choice. This app runs in the web browser and dynamically updates the HTML pages from the jQuery libary from within JavaScript utilizing AJAX queries and timers to build JavaScript programs that execute functionality at various times.

Objective

  1. I've created a GIF Search Program that allows the user to click a button to display the Top 10 GIF's for some popular dances.
  2. Each GIF will display the current Rating.
  3. The user will have the option to click the Image to initiate (START/STOP) the animation for each GIF.
  4. If the user is not satisfied with the current dances, they will have to option to add their own favorite dances.

Demo

Demo Site: This link will take you to the game

Key Topics

  • AJAX
  • GIPHY API
  • Code comments
  • Console
  • Variables
  • Types
  • Booleans
  • Numbers
  • Strings
  • Arrays
  • Conditional statements
  • Equality
  • Logical, comparison and ternary operators
  • Functions
  • Alerts, confirms, prompts
  • Global vs local scope
  • jQuery
  • Timers
  • DOM traversal and manipulation
  • Event handling

Requirements

Build Tools

  • GIPHY API/AJAX
  • Bootstrap
  • jQuery