Native Hire Take-home Project

This is an incomplete app that can be used as a starting point for the take-home portion of Native Team interviews.

This app is built with several open source technologies, including but not limited to the following:

• Ionic Framework (ionicframework.com)
• Capacitor (capacitor.ionicframework.com)
• React (reactjs.org)
• TypeScript (typescriptlang.org)

Prerequisites

• Node.js environment with npm
• Android Studio
• Xcode

Install

To get started, clone the repo and install the dependencies:

git clone https://github.com/ionic-team/native-hire-project.git
cd ./native-hire-project
npm install

Next, build the web app so that it can be run on devices:

npm run build

Finally, sync your web app with your native projects using Capacitor:

npx cap sync

Getting Started

This app has two React components: Home (the root component) and ContactListItem. Contact data is loaded from native in contacts.ts. You are free to modify the React app however you like, but for this project we are more interested in evaluating your competency with iOS and Android.

Capacitor (now installed in the project) is the tool that powers this app on iOS and Android. It consists of a CLI, a set of Native APIs, and a Web View runtime. For this project, we are interested in using the Capacitor bridge to invoke native functions from the web app.

The shells of these functions are already defined in their respective native projects. See the getAll method of the contacts plugin in Contacts.java for Android and Contacts.swift for iOS. These functions currently return mocked data.

Instructions

• Part 1: Add the functionality to retrieve all the contacts from the device on both iOS and Android. Feel free to refactor or modify the project as you see fit.

  The minimum data that comprise a contact are: first name, last name, phone number(s), and email address(es). You are, however, welcome to return more fields.

• Part 2: Add a method to the contacts plugin that allows for querying contacts on the device. We are purposefully leaving this open-ended to put you in the mindset of a plugin developer.

• Part 3: Think about how you might further extend this API with the idea that the contacts plugin code in this app could be open-sourced and reused in many apps. As a maintainer, what functionality might you add? What would you focus on? What would be most important to get right?

  Write down your thoughts and be prepared to share with us.

Commands

Most of these commands use npx cap, which runs the Capacitor CLI. See the docs for more details.

• npm run build - Rebuilds the web app.
• npx cap sync - Copy web app into native projects, install native dependencies, etc.
• npx cap open ios - Open the iOS project in Xcode.
• npx cap open android - Open the Android project in Android Studio.

Capacitor encourages you to use Xcode & Android Studio to deploy your app to iOS and Android devices. Just make sure to rebuild the web app and re-sync if you change web assets.