Skip to content

Combine your favorite Pokemon and quote in an animated Pokedex widget

Notifications You must be signed in to change notification settings

MelisaIm/pokequotes

Repository files navigation

PokeQuotes README

pokedex gif

Welcome to PokeQuotes:

This project explores web site scraping, combining the data from multiple sources into an easily digestible (enjoyable) widget and rendering a Pokedex completely styled with CSS and animated with JavaScript. The input form will request a link from a Pokemon sprites library and a link to a quote page on the BrainyQuote site.

Some tools employed included DOMParser (to convert the fetched HTML text to a DOM-like element to ease site scraping), Webpack (to Load files as modules as required by each process/function in the code permitting modular programming), Surge (to deploy the melisaim-pokequotes.surge.sh), CodePen (to mock up the pokedex, feel free to play with it!, serve-npm (to mimic a production environment and easily share with local network), Materialize (to use their CSS library and dialog jquery) and elementX (to create dom/html elements in a functional way).

Future Enhancements:

  • Better CSS Styling for Pokedex
  • Potential audio generated
  • More functionality in Pokedex "buttons"
  • Create Pokedexes specific to the generation of the Pokemon being rendered
  • String manipulate the quote to match the Pokemon in some way
  • Drop-down for Pokemon selection
  • Export of widgets (shareable)
  • Data caching
  • Create more interesting data outputs
  • Allow user customization (for better punning)

About

Combine your favorite Pokemon and quote in an animated Pokedex widget

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published