Build a simple one-page web application that displays a navbar on the top with the title "My contacts", a button named "Add contact" and a responsive table showing a list of Contacts, giving the user the ability to edit and delete each record as well as adding new ones.
Katy is a Sales Manager at Consultia AG, a Swiss startup specialized in management consulting. One of Katy's daily tasks is going through the list of business contacts, checking for new sales opportunities. However, she doesn't like the ERP interface, because she thinks it's too slow and not user-friendly. Therefore, she asked the development team to build a simple contact list that retrieves the data from the ERP, showing only their Firstname, Lastname, Email, Phone and Company. Katy is hoping to increase her efficiency by managing the contacts (add* or delete contacts, edit* contact details) in an easy way through the new web application.
Fields to be added/edited: Firstname, Lastname, Email, Phone, Company (dropdown list).
For this challenge, the ERP will be simulated with a MySQL database dump attached to the email.
The web application must be developed adhering to the Material Design guidelines (https://material.io/) and using at least the following technologies:
- PHP (3 5.6, no frameworks)
- MySQL (3 5.7)
- Javascript (3 ES5)
- HTML5, CSS3 (including preprocessors, if needed) The user interface can be built using any frontend framework of choice.
- Proper use of all required technologies.
- Cleanliness of the code.
- Web application's architecture and structure.
- Web application's look, feel and usability.
- Bonus: use of additional user-interface features to improve the user experience.
- Bonus: PHP Unit Tests.