# How to deploy in development

### **MobileApp**

**Step 1: Get the Expo command line tool**

The expo command line tool help you publish your project, but also provides all the necessary tools to test and debug your application on iOS and android simulators / emulators as well as on your hand-held device.

Open your command-line tool and enter the following command:

```
npm install expo-cli --global
```

**Step 2: Install packages**

For this step I will assume you have already cloned/downloaded the project to your local machine. If this is not the case, go back to 'How to deploy in development' **Step 3**.

Clone/download the repo into your local disk. You can name it whichever name you like. Then, go over to the *MobileApp* project folder and enter the install command to install the project dependencies:

```
$ cd MobileApp

$ yarn install
```

**Step 3: Add your own global constants**

The app contains a number of global configs that control the overall app experience. These configs can be accessed from the project's `/src/config/constants.js` file.&#x20;

While most configs have been already set up correctly for the demo project experience, there are a few constants that need to be modified for your setup. These are your app and company information:

```
// APP & COMPANY INFO
// THESE ARE APPLIED IN THE 'SIGNUP_STEP_3' SCREEN
export const APP_NAME = 'React Native Share Backend App';
export const COMPANY_NAME = 'Knowlephant';
export const CONTACT_EMAIL = 'info@knowlephant.com';
```

...and your API server location url:

```
// APISERVER URLS
// THESE CONNECT THE CLIENT SIDE WITH THE API SERVER
const DEVELOPMENT_API_HOST = 'http://localhost:4000';
```

{% hint style="warning" %}
**Note:** do make sure to set the port number to your actual local machine port number which get logged in the terminal when starting up your ApiServer project.
{% endhint %}

**Step 4: Enable on development mode**&#x20;

This step will make sure that you test the app by connecting to the server that should be running on your local machine (See: 'How to deploy in development').

{% hint style="warning" %}
If you like to connect the app directly to the remote server setup on your Heroku server, then you can skip this step (but make sure that the `development` variable mentioned below is set to `false`).
{% endhint %}

To connect to your local machine setup, open the MobileApp project inside your code editor and open the `/src/config/constants.js` file. Look for the *development* variable somewhere at the start of the file, and make sure it is set to:

```
const development = true;
```

**Step 5: Add Firebase Cloud Messaging (for Android)**

Created a Firebase project for your app, do so by clicking on **Add project** in the [Firebase Console](https://console.firebase.google.com/).

In your new project console, click **Add Firebase to your Android app** and follow the setup steps. **Make sure that the Android package name you enter is the same as the value of `android.package` in your app.json.**

Now, download the `google-services.json` file and place it in your *MobileApp* root directory.

<figure><img src="https://1546084265-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDo9SGV4WureLHZmE6W%2Fuploads%2FqPWVqug2GQ1eSKro7LCB%2FScreenshot%202022-08-27%20at%2011.31.20.png?alt=media&#x26;token=b4b8f50a-6ecc-40d2-827d-e62eb0be2d73" alt=""><figcaption></figcaption></figure>

In your app.json, make sure an `android.googleServicesFile` field exists with the relative path to the `google-services.json` file you just downloaded. The reference should already be there but it's good to double-check:

```
{
  ...
  "android": {
    "googleServicesFile": "./google-services.json",
    ...
  }
}
```

{% hint style="warning" %}
**Note:** Firebase will create an API key in the Google Cloud Platform console with a name like `Android key (auto created by Firebase)`. **This is not always the same key as the one found in `google-services.json`. Always confirm your key if you don't receive any push notifications!**
{% endhint %}

**Step 6: Run the application**

All that's left is to start expo-cli and open up and test the application on your iOS simulato&#x72;**:**

```
$ yarn run ios
```

...or on your Android emulator:

```
$ yarn run android
```

{% hint style="warning" %}
**Test on iOS Simulator or Android emulator**

To be able to test your app on the iOS simulator, then follow the instructions on how to set up iOS simulator laid out in [this link](https://docs.expo.io/workflow/ios-simulator/).

To test on Android emulator, follow the instructions on how to set up Android emulator laid out in [this link](https://docs.expo.io/workflow/android-studio-emulator/).
{% endhint %}

And that's it. The app is now ready for testing!
