Frontend developer: Recruitment tasks
Please complete the tasks and send the link to the repository with access (preferred Github) to the address joinpandas@pandagroup.co.
01.
Using gulp and other technologies, create a website by styling it according to the attached graphics
- We try to automate the work, therefore we ask you to prepare a simple gulp file that will allow you to use Sass power (it can be ES5 or ES6).
- Please, style the given graphics in the layout folder.
- Remember about responsiveness
- Take care of code semantics
- Pros for BEM
- Avoid floats, flex is much more practical!
Suggested file structure
- /1
- — index.html
- — /src
- — /scss
- — main.scss
- — /scss
- — /layout – place layouts here
- — /disc
- — /css – in this place Gulp has to throw away .css files
- — Gulp files
Notes to the task:
Technologies to be used: CSS, HTML, JavaScript, Gulp
02.
In the test.html file, our goal is to have the select value updated after clicking on the li element.
- The code has already been written, but despite many hours of searching for a small bug, something is not working. Will you find a mistake?
Download the test.html file and place it in a folder named “2”
Notes to the task:
Technologies to be used: JavaScript
03.
Downloading API Giphy
- In the prepared index.html file, after clicking on the button, download the Giphy API and display one photo of a random cat.
- JQuery is already attached to the file, but nothing prevents you from using something newer (eg Axios, native fetch).
Download the index.html file and place it in a folder named “3”
Notes to the task:
If you choose the second solution, the most convenient way is to save it in https://jsfiddle.net/(unless you have a favorite boilerplate 😉 )
Documentation API: https://github.com/Giphy/GiphyAPI
Please complete the tasks and send the link to the repository with access (preferred Github) to the address joinpandas@pandagroup.co.