For us it's great to have you applying to join our dev team!
To get an idea about your work, we would like you to complete the following test. Keep in mind that there is no minimum time to deliver it, you have a maximum period of 2 days to finish it.
-
The test must be 100% Responsive
-
Use a component-driven library or framework (Vue.js, Reactjs, AnguliPr.js).
-
Use some package manager (npm, yarn, bower) to handle dependencies external.
-
Good handling of git is important.
The two requested views must be exactly the same as the designs shown in attachments (listing.png, login.png), the third view should be designed to criterion of the developer.
-
Make a login with its respective validations consuming the JSON that comes indicated in the DETAILS section (see image login.png in the attached .zip).
-
When logged in, the user will be able to see by default the display of all stores consuming the JSON data and also a restaurant search section (see image listing.png in the attached zip).
-
Add a search engine to the list.png view that should filter by store name.
-
Animations should be applied to the images of the stores; animations are a free choice (reel, flip. etc.)
-
By clicking on the detail of the store you must show the products and characteristics of the store (name, address, description and product, the data is sent by JSON),
The way to show it is free choice (reactive, modal or view), for this we do not place guiding image for creativity to be used to its fullest expression with respect to layout images and animations.
- All media resources are in the attached zip img folder, the icons of the footer should redirect to their corresponding social networks, the brand icon should refresh or redirect to home.
In the api.json you will find a list of users, stores and products.
- The json must be consumed in the Login and in the description of stores.
Extra points will only be taken into account if the functionalities of the previous points, were completed correctly.
-
Use Sass, Less or any other tool to work with dynamic CSS.
-
Unit test your elements on the front-end side.
-
Apply a JS animation in the background of the login (change the water image by some JS animation that suits the design).
-
Upload your solution to a git repository.
-
Add a README with the instructions to execute your solution, as well as any other information that you consider necessary. Additionally we would like you to leave the arguments of the technical decisions you made regarding design, code and / or technologies when testing.
- pperez@perez.com
- rp1234