Directory

JS
Fetch API
Error Handling
Modal Function
Search Function
Gulp
SASS

The Brief

This project set by Treehouse wanted a searchable directory with a lightbox on selecting an employee.

The Build

Using modern CSS like grid and flexbox, the main look was easily achievable.

The search functionality was created by taking the input and using 'indexOf' on the full list of employees to toggle the display property of non-matches.

The lightbox was the most difficult task. Care had to be taken so that the images didn't appear to 'flash' when using the arrows to go through the list. Also, I adapted the list to only include employess that met the search criteria.

All of this was setup using Gulp and SASS to make the build an easier experience.

Inspect the Code