InventiStudio Front-end recruitment task
Hello Stranger!
Since you got here, you're probably taking a part in our recruitment process for Front-end developer position, right? We're super happy to hear that! Getting right to it — the main purpose of this task it to check out your HTML, CSS and JavaScript skills. We'd like to get to know your aproach of solving the following problems:
- Implement functionalities for the User stories (first one is already done),
- use Vuejs UI library with it's related ecosystem parts like Vuex and Vue-Router,
- provide the best possible User Experience (being strict with the designs, responsiveness, hover/focus states of interactive elements — everything to your liking and ideas),
- write a code that follows project's guidelines (e.g linters).
Feel free to open an issue if you got any questions or sugestions! Once it's ready, send us a repository link at hello@inventi.studio!
Happy coding and cheers,
Kamil & Piotrek, InventiStudio
- As a guest I am able to sign in.
- As a user I am able to sign out.
- As a user I am able to see all my transactions.
- As a user I am able to see all my withdrawals (transactions where I took money out of my wallet).
- As a user I am able to see all my additions (transactions where I added money to my wallet).
- As a user I am able to see wallet summary.
At /design directory you can find previews of User Interface, design guidelines and all the required assets.
API Url: http://217.182.66.13:4000/
E-mail: john.doe@mail.com
Password: password
Endpoints:
Get all transactions.
GET /transactions
| Name | Type | Description |
|---|---|---|
| x-auth-token | uuid | Session's token. |
| Name | Type | Description |
|---|---|---|
| transaction | Object[] | List of transactions. |
| transaction.name | String | Transaction's name. |
| transaction.amount | Number | Amount of money withdrawn/added. |
Validate token.
GET /sessions/:token
| Name | Type | Description |
|---|---|---|
| token | uuid | Session's token. |
| Name | Type | Description |
|---|---|---|
| session | Object | - |
| session.expiresAt | Date | Date of session's expiry. |
Create new session.
POST /sessions/
| Name | Type | Description |
|---|---|---|
| session | Object | - |
| session.id | uuid | Session's token. |
Destroy session.
DELETE /sessions/:token
| Name | Type | Description |
|---|---|---|
| - | - | - |
# Clone repo and install deps
yarn# Run dev server with hot reload at localhost:8080
yarn dev# Run sass-lint
yarn lint:sass
# Run ESlint
yarn lint:es
# Run all linters
yarn lint# Run Unit tests
yarn test:unit# Run e2e tests
yarn test:e2e# Build for production with minification
yarn build
# Build for production and view the bundle analyzer report
yarn build --report
# Run production server
yarn startFor a detailed explanation on how things work, check out the guide and docs for vue-loader.
It's just a recruitment task, we won't use it in any commercial way!