This task is to be undertaken as part of applying for the above position with Advanced, and is designed to demonstrate your abilities in:
- JavaScript
- React
- HTML & CSS
The following pre-requisites should already have been communicated to you.
- Ensure you have access to a GitHub account
- Setup a local development environment that you can clone a repository to, work from, and commit from, which includes:
- Node 14+ (minimum required by create-react-app)
- NPM 5.6+ (minimum required by create-react-app)
TheCocktailDB is a free-to-use API which gives details about popular cocktails. Your task is to create a React application which queries the API and displays details about the returned cocktails. The details you should display should at minimum include the following (all of which are supplied by the API):
- The name of the cocktail
- Whether or not the cocktail is alcoholic
- A photo of the cocktail
To start with, you should simply display all cocktails that are returned by hitting the following endpoint, which filters for all cocktails containing the word "margarita": www.thecocktaildb.com/api/json/v1/1/search.php?s=margarita
We are interested in a number of things:
- The quality of your code and whether or not it is production ready
- How you structure your code / project
- How you interact with Git(Hub)
However, we appreciate that we may not be able to get all of this from a small task, so please take your time and work like you would on any normal project. We will then aim to discuss the task with you during your next interview.
To help you get started quickly, this repository contains an instance of the create-react-app, a simple React application. It is recommended that you simply clone this repository to your local machine and work directly on it, however you may start from scratch if you wish.
- Fork this repository to your GitHub account and clone it to your development environment
- Run
npm install
to install and build the solution - Run
npm start
to start the application - Complete the task, checking in your code as you go (and ensuring you do a final push to GitHub prior to the end of the time window)
- Complete the questions in the FOLLOW-UP-QUESTIONS.md file (you do not need to do this within the 2 hour window)
- Return the completed task to the hiring manager, by either:
- Setting the repository to public and supplying the hiring manager with the URL (recommended)
- Sharing the repository with the hiring manager directly (GitHub project -> Settings -> Collaborators)