Recruitment test solution

Recruitment test, given by a web development company in Malaysia

Instructions given by the recruiter

Create an app, that can enter the daily expenses. The app will have one screen. At the top of the screen is a form where user enter the description and amount, and a button to "Add" the item to the expenses.

Following the form, there is a list of the expenses that has been added. The list shows the expense description and the amount. At the bottom of the list, the total of all the expenses are shown.

Technical Specifications

1. App should be a single page JS app.

2. App should save newly created expense into the backend through an HTTP API.

3. App should load existing expenses in the database through an HTTP API, when the page loads.

4. When new Item is added to the list, it should appear at the top of the list.

5. Following the rule 4, the list should be sorted by date in descending order. Last comes first.

6. When displaying the new Item at the top of the list, it should slide down with an animation.

7. Each item in the expenses list will have a "Delete" button. When pressed, the Item will be deleted from the list. The deleted item should slide up and disappear.

8. App should delete the item from the backend database through an HTTP API.

You can use any framework/library that you want. Backend can be created with any backend technology (eg. PHP, NodeJS, Java, Firebase, Amazon Lambda, etc).