Skip to content

fac-17/week4_MEIA_Autocomplete

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

85 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Autocomplete App

Imgur

Project Description

A simple autocomplete widget that accepts a search input and shows an auto-updating list of completed inputs. Specifically it uses the list of countries and gives the opportunity to visit that country Wikipedia.

Installation

1 - Clone the repository

2 - Run npm install -> that will install all the dependencies for you :)

User stories

As a user visiting this site, I should be able to

  • Type in a query into a search input
  • See a list of suggested queries that start with the text I entered
  • See an updated list of suggestions each time I input a new character into the search field
  • Be able to choose a suggestion from the list with the mouse

Stretch Goals:

  • Use an external API to populate the data
  • Be able to use keyboard to navigate suggestions
  • Use the widget value to navigate to Wikipedia

User Journey/Project Whiteboarding (white paper-ing to be precise)

app architecture draft

The Grand Plan

  • Plan out all main pieces of the app
  • Set up file architecture (focus on separation of concerns)
  • Use hardcoded data and focus on building search functionality
  • Write server functions to handle static assets
  • Write server functions to handle /search API call
  • Create a search function using TDD for our server consumption
  • Build a frontend side that consumes /search API
  • Work on style and accessibility

The team

  • We need to be four to make a quadruple!

  • Reuben (in green)
  • Andy (in purple)
  • Jan (in red)
  • Sarah (in yellow)

Learning opportunities

  • Learning how to create a server from the scratch
  • Working on the differents directories
  • Front-end: plenty of new listeners
  • Keeping the design simple, clear and user-friendly