Walkthrough: Patient-Facing App

Introduction

This section will help you build a patient facing linked application with MeldRx. This example will be linked with Epic, however you can choose a different EHR.

Prerequisites

Before getting started, please make sure you have the following:

• An account with Epic FHIR developer portal
• A MeldRx Developer account (sign up at MeldRx)
• Dowload or update the create-meldRx-app CLI

MeldRx App Setup

Log in to Command Center at MeldRx and navigate to the apps page (Command Center > Apps) and press Register App.

Step 1

Provide app details

1. Give your app a Name.
2. Select Patient on the App User Type.
3. Set the Client Type to Public
4. For the Scopes select the following:

patient/*.read openid profile launch launch/patient

5. Set the Redirect Urls as :
   • http://localhost:3000/login-callback
   • http://localhost:3000
6. Go to the Next step.

Step 2

Connect linked apps

1. Select a Add Linked App.
2. Chose Epic as the Linked App Provider.
3. Chose to use your own credentials
4. Give your linked app a name.
5. In the Client Id paste in the Non-Production Client ID from the your Epic app.
6. Match the Scopes with the scopes from your app above:

patient/*.read openid profile launch launch/patient

7. Add the Linked App.

Step 3

Provide workspace details

1. Check the Create a workspace box
2. Give your Workspace a name.
3. Select the same FHIR API Provider as you did in the Linked app e.g. Epic, if not already selected.
4. Select the Epic Sandbox url from the dropdown.
5. Once the validation is complete press Create.

You should see a screen like this upon creation: You can follow the steps on this page to create your MeldRx app. Here you can find the commands you need to run to bootstrap your application using the create-meldrx-app CLI.

Creating the app

Now that you've set up an app and workspace that are linked with Epic, you can move on to coding the app. We will be using the Create-MeldRx-App CLI to get a quick template for a patient facing app.

Installation

npm i -g create-meldrx-app

Using the Tool

Navigate to the path where you want to create your application and run:

npx create-meldrx-app --meldrx-app-id [clientId] --workspace-url [workspaceUrl]

1. Supply the directory where you want to create your app.
2. Select the Patient option.
3. Select the Web option.
4. Select Blank Web App (NextJS).

Now change your directory to your newly created app folder and run:

npm install

You can now run the application by using:

npm run dev

Testing your app

1. Once your app is running, in your browser go to http://localhost:3000/
2. You should see a template screen, here press the Launch with MeldRx button.
3. On the Epic MyChart screen login as a patient. You can find a list of test patients here.
4. Navigate through the MyChart and MeldRx consent screens by pressing Allow Access
5. You should see on a page with a Patient Resource JSON of the patient that you loged in as.