Contacts Archive - Ionic3

About the app

A simple fully functional personal contacts manager mobile application written in Ionic 3 and Angular 4.

You can save you personal contacts by filling out a simple form. Add details as name, email, phone, date of birth, a short description, and one or more addresses. The only mandatory fields, that also validate, are the “”, "", and “”. You can assign an image to a contact by using the camera or selecting an existing image from the gallery.

There is an example of how to build a custom directive. The example directive is used to generate an avatar for a contact that has no image associated with it.

There is an example of how to create custom pipes. The example is used to transform to HTML break tag the new lines from the saved text area in the contact form.

Each contact from the list of contacts on the all contacts page is slideable and you can call or email the contact, provided the contact has a phone number and/or email address associated with it. These methods are also available on the contact details page.

Also, the contact addresses once tapped will be displayed on a map using the GoogleMaps API.

On the contact details page, the contact date of birth is clickable. Once clicked it can create a Google Calendar yearly repeatable event with the contact's birth date.

The app is built using Ionic v3 and Angular4 and it can be used as both an Android or an iOs app.

Starting and running the app

After downloading and unpacking the files, simply navigate to the app's folder and "npm install" to get all dependencies. Don't forget to add your desired platform using the "ionic platform add <platform>" command.

Extending the app

The application is fully functional and stores the saved contacts to the device's local storage. If you would like to sync the app to a cloud DB, this can be done in a snap. I recommend using the IBM cloudant service. An example of how to integrate cloudant can be found in the how-to file.

Happy coding :)