GithubHelp home page GithubHelp logo

jckw / bonfhir Goto Github PK

View Code? Open in Web Editor NEW

This project forked from bonfhir/bonfhir

0.0 0.0 0.0 49.87 MB

A collection of projects and libraries to help implement FHIR-based products and solutions.

Home Page: https://bonfhir.dev

License: Apache License 2.0

JavaScript 0.09% TypeScript 99.86% HTML 0.01% EJS 0.05%

bonfhir's Introduction

Bonfhir

A collection of projects and libraries to help implement FHIR-based products and solutions.

Documentation: https://bonfhir.dev

BonFHIR Quickstart

Prerequisites

Create a starter app from one of the templates

$ npm create bonfhir

The current starter templates are the following:

  • playground: A simple playground to get started playing with bonFHIR core.
  • vite: A Vite SPA project with BonFHIR UI and React-Router.
  • lambda: An AWS Lambda serverless application connected to a FHIR Server.
  • next: A Next.js app with BonFHIR UI & Subscription API, with NextAuth integration.
  • monorepo: A Monorepo with a Web app (SPA), an AWS Lambda API, and supporting packages. This for more advanced projects.

Run a sample FHIR server

Once you have an application up and running the next step is connecting to some data. Provided is a docker image you can run locally with some test data.

From within your new bonFHIR application
Start the FHIR backend
$ npm run start-fhir-server

Ensure the backend is running at localhost:8100

Authenticate with credentials [email protected] / medplum_admin

Load some test data
npm run add-sample-data

Note: The following error occurs if using a version of Node prior to 18

ReferenceError: fetch is not defined

Start building!

Using the provided bonFHIR utilities and components start building! Here is a simple React example to get you started

import { useFhirSearch } from "@bonfhir/query/r4b";
import { FhirTable, FhirValue } from "@bonfhir/react/r4b";
import { Paper} from "@mantine/core";

export default function Home() {
  const patientQuery = useFhirSearch('Patient')

  return (
    <Paper>
      <FhirTable
        {...patientQuery}
        columns={[
          {
            key: "name",
            title: "Name",
            render(patient) {
              return <FhirValue type='HumanName' value={(patient.name)} />
            }
          }
        ]}
      />
    </Paper>
  );
}

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.