|
| 1 | +# Overview |
| 2 | +This tutorial will introduce you to creating SMART on FHIR apps that can be registered and launched from a number of different SMART Sandboxes, as well as SMART on FHIR-supporting EHRs. |
| 3 | + |
| 4 | +*Our tutorial is based on [this tutorial](https://engineering.cerner.com/smart-on-fhir-tutorial/#introduction) from the Cerner engineering team].* |
| 5 | +*If you work with Cerner EHRs, feel free to check out their tutorial as well!* |
| 6 | + |
| 7 | +# Table of Contents |
| 8 | + |
| 9 | +# Prereqs |
| 10 | +- Create a public GitHub account if you do not have one. |
| 11 | +- Install a text editor for viewing and editing code. Some options: |
| 12 | + * [VS Code](https://code.visualstudio.com/) |
| 13 | + * [Sublime](https://www.sublimetext.com/) |
| 14 | + * [Atom](https://atom.io/) |
| 15 | +- Install Git if you don't have it. Check out the [Git book install guide](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) and the [download page](https://git-scm.com/downloads) |
| 16 | + |
| 17 | +## Testing your setup |
| 18 | + |
| 19 | +## Note: if you're unfamiliar with git or Github, check these out: |
| 20 | +- [Github Guides - Hello World](https://guides.github.com/activities/hello-world/) |
| 21 | +- [Github Bootcamp](https://help.github.com/categories/bootcamp/) |
| 22 | +- [Getting Started - Git Book](https://git-scm.com/book/en/v2/Getting-Started-About-Version-Control) |
| 23 | + |
| 24 | +# Learning Objectives |
| 25 | + |
| 26 | +## Main |
| 27 | +- **Create** and **Register** a SMART on FHIR App in the HSPC sandbox. |
| 28 | +- **Launch** app as a patient *and* as a provider from the HSPC sandbox using the [SMART on FHIR Javascript Client](https://github.com/smart-on-fhir/client-js). |
| 29 | + |
| 30 | +## Extra Credit |
| 31 | +- Demonstrate interoperability by launch app from **SMART on FHIR** sandbox. |
| 32 | +- Set up a standalone patient access app |
| 33 | + |
| 34 | +# First Steps |
| 35 | +1. Fork the SMART on FHIR app from Github. |
| 36 | + - [ ] Create an account on Github if you have not already. |
| 37 | + - [ ] Login to your [Github account](https://github.com/login) |
| 38 | + - [ ] Navigate to https://github.com/uw-fhir/smart-on-fhir-tutorial.git |
| 39 | + - [ ] Click on the `Fork` button in the top right corner of the page. |
| 40 | + - [ ] Wait a few seconds, and you should see a copy of the repo in your github account. |
| 41 | + |
| 42 | +2. Clone your project to your computer |
| 43 | + - [ ] Open a terminal or Git Bash |
| 44 | + - [ ] Navigate to a folder where you want to keep your project. For example: |
| 45 | + ``` |
| 46 | + cd C:/Users/Piotr/code |
| 47 | + ``` |
| 48 | + - [ ] Find the project url by clicking the `Clone or download` green button on your Github project page and copying it to your clipboard. |
| 49 | + - [ ] Run the following command in the terminal to clone this project into the chosen folder: `git clone https://github.com/pmanko/smart-on-fhir-tutorial.git` |
| 50 | + - [ ] When you open your chosen folder, you should see the project files in a directory called `smart-on-fhir-tutorial`. |
| 51 | +3. Open your project folder in your text editor for this tutorial to be able to view and change the files. We'll be using VS Code; so if you're also using that editor, go to `File/Open Folder...` to accomplish this. |
| 52 | + |
| 53 | +# Explore the Project Folder |
| 54 | +- `example-smart-app`: This is a simple client-side web application. |
| 55 | + * `lib/js/fhir-client.js`: The app uses uses the library to (1) communicate with our Sandbox using the FHIR API and (2) handle the SMART on FHIR authorization workflows. Check out more information about this client here: https://github.com/smart-on-fhir/client-js |
| 56 | + * `launch-hspc.html`: this webpage is the initial entry point into the SMART on FHIR application, called the `launch_url` in the SMART documentation. This page will be called by the HSPC sandbox when we launch our app. We'll cover the different launch patterns later in the tutorial. |
| 57 | + * `launch-smart-sandbox.html`: this page is similar to the previous launch, but will be used when we launch from the SMART on FHIR sandbox. |
| 58 | + * `launch-standalone.html`: this page is similar to the previous launch, but will demonstrate launching a stand-alone application - in this case from a patient context. |
| 59 | + * `index.html`: this is the main web page for our application, and will be redirected to after Authorization succeeds. |
| 60 | + |
| 61 | +# Setup Github Pages |
| 62 | +1. Edit `example-smart-app/index.html` |
| 63 | + - [ ] Open the target file in your text editor. |
| 64 | + - [ ] In the `<head>` section, find the `<title>` tag and replace the text inside with something like: `<title>[Your Name]'s SMART App</title>`. |
| 65 | + |
| 66 | +2. Commit and Push your change |
| 67 | + - [ ] Open your terminal or Github Bash window |
| 68 | + - [ ] Navigate to the project folder: `cd [path-to-project-folder]` |
| 69 | + - [ ] Stage all of your changes: `git add .` |
| 70 | + - [ ] Commit your changes and write a commit message describing your work: `git commit -m |
| 71 | + |
| 72 | +# Next Steps |
| 73 | + |
| 74 | +# Resources |
0 commit comments