From aeea93c842b4dba544078748f301ec8d2c74a078 Mon Sep 17 00:00:00 2001 From: Kari Lavikka Date: Thu, 7 Nov 2024 13:56:43 +0200 Subject: [PATCH] describe static web site and library options in README --- README.md | 34 ++++++++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) diff --git a/README.md b/README.md index d19ff50..6801fac 100644 --- a/README.md +++ b/README.md @@ -73,6 +73,8 @@ If you are an R user, you may want to use the generate Jellyfish plots in RStudio, R Markdown, Shiny apps, or plain R. Otherwise, continue reading. +### Running with the Development Server + Jellyfish is a web application written in TypeScript. You need to have [Node.js](https://nodejs.org/) installed to run the tool. @@ -86,6 +88,38 @@ Once the development server is running, open your browser and navigate to http://localhost:5173/. You should see the user interface, which allows you to render Jellyfish plots based on your data. +### Building and Deploying as a Static Web Site + +If you want to share the interactive Jellyfish plots with others, you can build +the project as an application and deploy it as a static web site on any web +server. An example of such a web site is available at +[https://hautaniemilab.github.io/jellyfish/](https://hautaniemilab.github.io/jellyfish/). + +Steps: + +1. Perform steps 1-3 from the previous section. +2. `npm run build:app` (builds the project) +3. `cp -R data dist/app/` (copies the example data to the build directory) +4. `cd dist/app` +5. `python3 -m http.server` (starts a local web server for testing) +6. Open your browser and navigate to http://localhost:8000/. You should see the + user interface. +7. To deploy the site to a web server, copy the contents of the `dist/app` + directory to the server. + +### Building a Jellyfish library + +Jellyfish can be used as a library in other JavaScript applications, such as the +[Jellyfisher](https://github.com/HautaniemiLab/jellyfisher) R package. For an +example of how to use the library, see Jellyfisher's [source +code](https://github.com/HautaniemiLab/jellyfisher/blob/main/inst/htmlwidgets/). + +Steps: + +1. Perform steps 1-3 from the first section. +2. `npm run build:lib` (builds the library) +3. The compiled library is available in the `dist/lib` directory. + ## Input Data Jellyfish reads data as tab-separated files from the `data/` directory. Below is