Triple A Frontend Recruitment Exercise

Task Overview

Your task is to build a simple, intuitive frontend web application that interacts with a provided backend binary to demonstrate internal financial account transfers. The backend binary already provides the necessary APIs for creating accounts, retrieving account balances, and processing transactions.

You are expected to focus on usability, clarity, and maintainability of your frontend solution.

Assumptions

• You do not need to handle authentication or authorization.
• Currency is uniform and handled in the backend.
• The backend is provided and already implements the described API. The server will be running on the command:

docker run -p 8860:8860 tripleaio/transfer-api-server

• The backend will handle all business logic, including account creation, balance retrieval, and transaction processing.

Hey New Readers 👋

If you’re new here, make sure to check out my Frontend Army publication, where I have published 50+ detailed Frontend interview experiences, Top ReactJS, JavaScript questions, and many more.

Great resource for anyone preparing for Frontend Engineer interviews 🚀

Backend Integration

Request/Response Examples:

Create Account:

POST /accounts

{
   "account_id": 123,
   "initial_balance": "100.23344"
}

Retrieve Account Balance:

GET /accounts/123

Response:
{
   "account_id": 123,
   "balance": "100.23344"
}

Execute Transaction:

POST /transactions

{
    "source_account_id": 123,    
    "destination_account_id": 456,
    "amount": "100.12345"
}

Response:
{
    "source_account_id": 123,
    "destination_account_id": 456,
    "amount": "100.12345"
}

Requirements

• Provide a clear and simple user interface.
• Allow users to: — Create new accounts. — View current account balances. — Initiate transactions between accounts.
• Display errors clearly and guide users in correcting issues.
• Ensure good user experience and feedback on actions taken

Technical Expectations

• Use modern web technologies (React, Vue, Svelte, Angular, or similar).
• Adhere to good practices regarding componentization, state management, and readability.
• Implement basic validation for user input.
• Handle backend API integration gracefully, including proper error handling

Deliverables Deliverables

Provide a publicly accessible Git repository with:

• Instructions on setting up and running the frontend application.
• Clear documentation of assumptions and technical choices.

Note: Do not mention the backend provider name or exercise context explicitly in your repository.

Evaluation Criteria

• Criteria: Correctness and robustness of frontend-backend integration.
• User-friendliness and clarity of the user interface.
• Quality, readability, and maintainability of the code.
• Adherence to frontend best practices and clear documentation

While preparing for interviews, I came across a platform called **PracHub**, where I found the questions and solutions really helpful. You should check it out, it’s definitely worth exploring.