Build a Hospital Rounds App using the Patient Lists API

Welcome, student!

This codelab is intended to teach you about the 2020 Argonaut initiative for Patient Lists by walking you through a coding exercise that uses the new API.

Prerequisites

This guide assumes you are already familiar with javascript and are comfortable with web programming concepts. It also helps to know the basics of git, but there will be example commands throughout for convenience. The provided initial codebase uses javascript, node, nvm, npm, and express - so some prior experience with those tools will be helpful, but not required. JavaScript in the browser and in Node.js, and the express Web framework for Node.js

Contributing

As always, you are free to re-write entire portions of the code in whatever framework you like (and please feel free to share your work with us)!

The codelab has a wiki which should help you decide how to best contribute:
https://github.com/microsoft-healthcare-madison/demo-patient-lists/wiki

Also, take notice of the Report a mistake link that appears in the lower left corner of each page!

Major Milestones

You will start with an already-implemented app that displays an empty table of patients that will be visited by a doctor who is walking rounds in a hospital.

v1: Read patient data from either a FHIR server or from flat files, displaying the list of patients.
v2: Include other patient details in the displayed table, fetching it from related resources using several parallel queries.
v3: Implement filters, restricting the patient list to meet specified criteria.

Patient Lists API

Provider-facing apps often need to know things like:

Who are the patients I'm seeing today?
Who are the patients I'm responsible for in the hospital right now?
Who are the patients in this ward?

The FHIR Patient Lists will define a few key "list types" and ensure that FHIR-based apps can interact with lists as needed. The initial focus is read-only access to lists.

EXERCISE: Open the Docs

The table below shows one example list of patient data that might be displayed in an Hourly Rounding app.

Patient	Age	Gender	Location	Last Visited	Admit	Chief Complaint	PCP	Attending
Johnson, Adam	76	M	704	2020-07-03 6:14:00	2020-07-02 12:34:56	Chest Pain	Waterhouse, Ben	James, Craig
Thomson, Jeffer	79	M	705	2020-07-03 6:22:00	2020-07-01 21:09:54	Low Back Pain	Rush, Benjamin	James, Craig

Instructions

Begin by cloning the repository that contains the skeletal app and installing it locally on your machine.

mkdir -p ~/code/msft-fhir
cd $_
git clone git@github.com:microsoft-healthcare-madison/demo-patient-lists.git
cd demo-patient-lists
npm ci

The demo app is now ready to be started using this command:

npm run demo

EXERCISE: View the App

Server Compliance Test

If you would like to test your server for Patient List API compliance, visit this link:

Required Server Capabilities

In summary, the required server capabilities are:

Group resource support.

EXERCISE: Configure the Source Data

The remainder of this codelab assumes you have a common source of data. You may either configure the app to use your own server or to read from provided files.

OPTION 1: Genuine Server

If you intend to bring your own server for this exercise, please update index.html to use your server URL:

<script>
  var SERVER = "http://localhost:2019"  // TODO: update this with your own URL
</script>

OPTION 2: Mock Server

Launch the local server which will provide canned output on http://localhost:2019.

npm start server

The Patient Lists API takes advantage of the Group resource to represent a collection of patients with something in common, as opposed to a List, which is a manually curated collection.

EXERCISE: Fetch all the Groups

Begin by adding code to fetch the groups from your source data.

    <table id="patients" border=1>
        <tr>
            <th>Patient</th>
            <th>Age</th>
            <th>Gender</th>
            <th>Location</th>
            <th>Last Visited</th>
            <th>Admit</th>
            <th>Chief Complaint</th>
            <th>PCP</th>
            <th>Attending</th>
        </tr>
    </table>
    <script>
        fetch(SERVER + '/Group')
            .then(function (response) {
                return response.json();
            })
            .then(function (bundle) {
                unbundle(bundle);
            })
            .catch(function (err) {
                console.log('error: ' + err);
            });

        function unbundle(bundle) {
            var patients = document.getElementById("patients");
            for (var i = 0; i < bundle.entry.length; i++) {
                var tr = document.createElement("tr");
                var td = document.createElement("td");
                tr.appendChild(td);
                td.innerHTML = "Lastname, Firstname";
                // TODO: add the other elements.
                patients.appendChild(tr);
            }
            // TODO: also handle paging of results in the bundle.
        }
    </script>

  0/ - This section details the plan for this codelab and is subject to change!
 <Y
 / \

Administrative

Move this repo over to the microsoft-healthcare-madison team page (and update all links).
Convert this section into github issues for work tracking and assignment (if anyone else is interested in helping)

Supporting materials

I need to write a dumb local ‘fhir' server which will serve up canned / static files on port 2019.

Remaining sections / exercises

Populate Location
Populate Admit date
Populate Last Visited timestamp.
Populate PCP and Attending providers.
Populate Chief Complaint.
App Filters

Bonus

Finally, once the mechanics are better understood, the option of having a Questionnaire and response suggested in the Group extensions should be explored in the codelab.