Giter Site home page Giter Site logo

etsy-searcher's Introduction

Searching Etsy

An all client-side and dependency-free app that searches Etsy for you. It is written completely in ES6 and transpiled with babel.

##Compatibility This site was tested on Chrome 50. Any other modern browser should work, except IE.

Deploy

npm install

Then just serve up the root directory using your favorite webserver. I used python SimpleHTTPServer.

Features

In addition to typing in the input box and searching Etsy, this app as a few other features.

Bookmarkable Search

You can navigate to the root page with the ?q=[search term] query parameter and the page will automatically search on that term.

Forward and Back

Every search utilizes HTML5 pushState() api, essentially going to a different url. This allows for the user to go back and forth between searches by going forward or back in the browser.

Infinite Scroll

As the user scrolls, automatically fetch more results.

Responsive

The the site is fairly responsive thanks to Twitter Bootstrap.

Organization

  • components.js - creates listing and spinner DOM components
  • etsy.js - queries esty
  • extend.js - a simple implementation of methods like $.extend.
  • infinite-scroll.js - provide a function to call a callback when the user gets the bottom of the screen
  • jsonp.js - library to make jsonp calls
  • main.js - orchestrates the page.
  • routing.js - handles on page route changes
  • url.js - convenience methods for dealing with urls
  • shoebox.js - entry file for my utility function

etsy-searcher's People

Contributors

shoebox639 avatar

Watchers

 avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.