Working example can be found here.
For this coding challenge I chose to use React with the Context API. Redux could easily be implemented for a larger app.
Webpack and Babel configurations are courtesy of Create React App.
I have used Sass as the CSS preprocessor.
Data is persisted by utilizing the browsers local storage.
- Sample data can be loaded to give 11 examples.
- Search facility.
- Fields for Avatar and Phone Number.
Build a Single Page Application (SPA) address book using JavaScript, HTML and CSS.
- There should be one view where all contacts are listed.
- There should be another view to add, delete and edit contacts.
- The data should be persisted (on the client), and loaded again when the application starts.
- Add fitting validation to the different input fields.
- First name (input, required)
- Last name (input, required)
- Email (input[type=text], required, valid email)
- Country (dropdown, required) - use the country-list module to populate the list
- Even though this is a small project, structure and architecture should mimic a large project.
- The code should obviusly follow best practises (DRY, maintainable, testable, etc.).
- Feel free to depend on any frameworks/libraries you think is suitable using NPM/Bower.
- We want the code you submit to be written by you, so don’t use skelletons/generators.
- Make sure the application work on Node 5.x, NPM 3.x and in latest Chrome and Firefox.
When you are done, send us a link to your repository on Github/Bitbucket (preferred and much faster) through this page or e-mail it directly to our CTO (not preferred, and much slower ;-).
Note, this is where you get to shine — show us what you’ve got!