/iwoca-frontend-interview

Primary LanguageJavaScript

iwoca frontend interview test (application portal)

Setup

  1. Clone this repo to your local machine, its a partially setup create-react-app project
  2. Make sure you are using the correct node version:
    1. Manually: node -v should return 16.13.0
    2. If you don't have Node version manager (NVM) install install it from here
    3. Using nvm: Run nvm install to install the node version and nvm use to use it
  3. Install the dependencies with npm install
  4. Run npm start to start the frontend on localhost:3000 and the api server on localhost:3001

The Task

Currently there is only one application which is shown using a hard coded JSON fixture in the codebase

The applications api http://localhost:3001/api/applications will return a JSON object of all applications for that user

You can paginate the endpoint using the query string ?_page=2&_limit=5 you must return 5 new applications every time the load more button is clicked, _page= is the page you will be returning and _limit= is number of applications to return

see attached Figma Link for how this should look

  1. There is a pre styled <Button /> component you can use for this.
  2. Any comments you want to pass along to the reviewer add to COMMENTS.md and commit
  3. To submit either send us a link to your public fork or another public repo. Alternatively you can zip up your files minus node_modules and email it over.

Notes

  • We consider tests important here at iwoca. Jest is our preferred way of writing them, but you can use cypress or another library if more comfortable
  • Feel free to alter the technologies used in the code base, eg. we use CSS modules but if you are more comfortable with styled-components for example you can install and use that for your portion of the task.
  • Attention to detail in the design will go a long way.
  • All the tickets features are for desktop but we would be very happy to see mobile considered.
  • Remember to check your project runs before submitting. - we will be running it in development mode to review.
  • Feel free to refactor the code where appropriate.

Tasks

  • npm run e2e: Run the Playwright tests
  • npm run e2e:ui: Open the Playwright interactive test runner
  • npm run e2e:debug: Run the Playwright tests in debug mode