Skip to content

Latest commit

 

History

History
77 lines (62 loc) · 2.6 KB

README.md

File metadata and controls

77 lines (62 loc) · 2.6 KB

Gclone Client

Installation & Usage

Installation

  • npm install to install dependencies

Usage

  • npm run dev to run
  • npm test to run the tests

Changelog

index.html

  • added form with search bar and 2 buttons

index.js

  • refactored to reduce uneeded code by creating the target elements and listeners for them
  • added the event listener and handler for button search
  • added the event listener and handler for feeling lucky
  • fixed the query formating that send request to the server
  • refactored event handlers to include smaller reusable functions
  • function to get the result data
  • function to create the result list
  • function to create the formated one result sample and append it to the view
  • cleanup of the file

data.js

  • static file

Bugs

  • client sends incorrectly formatted keyword as aquery to the server
  • content from old search needs to be destoryed on new search
  • long load times - confusing - should tell user that query is running !
  • does not identify listeners
  • does not remove previous search results so new search results are not displayed

layout bugs

  • flex layout causes content to shift off left of screen on window resize
  • flex flow causes unpleasant break up of content when search alligned to top of screen

TODO

Functionality

  • upon search button pressing send request to the server with search keyword
  • feeling lucky button:
    • pass the keyword
    • then generate random index for the search result
    • select and redirect to the result with randomIndex

Design

  • search area that hides
    • add logo
    • x in search bar to clear content on click
  • style the buttons
  • format the output of the query
  • responsive design!
  • some issues with content width being more uniform
  • footer
  • add search info text between search bar and results like google has

Other

  • Create review branch
  • README file
  • Boiler plate of the project
  • Create the static data to develop the client side without consuming API requests
  • Hook the event handlers to send query to the server instead of static data
  • use function from server or add the logic to return only 10 results

Other

  • Create review branch
  • README file
  • Boiler plate of the project
  • Create the static data to develop the client side without consuming API requests
  • Hook the event handlers to send query to the server instead of static data
  • use function from server or add the logic to return only 10 results