Frontend Homework Assignment

Build a simplified purchase funnel that collects order details and executes the purchase.

Design

View in Figma

Click ▶ button in the toolbar to view an interactive prototype:

Endpoints

Mock API

cv-mock-api.vercel.app

• Get packages: GET /api/packages
• Get VAT rates: GET /api/vat-rates
• Create order: POST /api/orders

IP API

ipapi.co

• Get user’s country: GET ipapi.co/json

Requirements

• Fetch packages from GET /api/packages
• Apply a correct VAT to the price by fetching VAT rates from GET /api/vat-rates and matching one of them with user’s country through GET ipapi.co/json. If VAT rates’ endpoint does not contain user’s country, apply 0% VAT
• Execute purchase by sending order details to POST /api/orders with the following payload (replace with actual values):

  {
    "packageId": "single",
    "buyer": {
      "firstName": "John",
      "lastName": "Doe",
      "email": "john.doe@example.com"
    },
    "vat": {
      "countryCode": "lt",
      "rate": 21
    },
    "price": {
      "currency": "EUR",
      "amount": 14.99,
      "grossAmount": 18.14,
      "vatAmount": 3.15
    }
  }

• Use React Hooks
• Write some meaningful tests
• Share code as a private repo on GitHub (suggested repo name format: name-s-cv-homework). Add @and1-lt as a collaborator for review
• README should include instructions on how to run the app
• Deploy the app somewhere (deployed preview link must follow pattern name-s.domain, for example john-d.vercel.app)

Notes

• You can bootstrap and structure the app however you want
• If you’re unsure on how some interaction should work, just use your best judgement ✌️