You are suggested to implement a simple profile search application using Nuxt and Vue frameworks. Expected technologies used are: ES6, CSS (with any pre/post processors), html, SFC.
Can be found here: https://www.figma.com/file/PyncPYa1rpOxRooTdfvgxHRN/Bravado-Quest
You are suggested to implement layout according to design above and a single page application based on Vue and its modules. Application should be running on a root url (/
). The sample data to use inside application should be taken here: https://raw.githubusercontent.com/allaud/bravado-quest/master/app/views/welcome/users.json.erb
Please note, the default app state contains all profile cards. When user starts typing, the results should be filtered in realtime, highlighting the matching string.
- General SPA application performance, including searching, scrolling and highlighting speed.
- Quality of Vue single file components (SFC)
- HTML(JSX) and CSS quality
- JS code quality
- Search should be stateful (using browser url e.g.
/search/Boris
) - Application should be published online for testing purposes