The web application for viewing, exploring, and annotating 1D and 2D genomic data.
URL: http://higlass.io
Note: This is the source code for the web application only! You might want to check out the following repositories as well:
- HiGlass viewer: https://github.com/hms-dbmi/higlass
- HiGlass server: https://github.com/hms-dbmi/higlass-server
- HiGlass docker: https://github.com/hms-dbmi/higlass-docker
$ git clone --recursive https://github.com/hms-dbmi/higlass-app && higlass-app
$ npm install
Note: If you forgot to add --recursive
do the following to pull the submodules
$ git submodule update --init --recursive --remote
In order to update the wiki run:
$ git submodule update --recursive --remote
Developmental server: npm start
Production build: npm run build
Run tests: npm test
Update wiki: npm run update-wiki
HiGlass App can be configured at build time using config.json
.
config.json
contains the default configuration. To adjust it copy it to config.dev.json
, config.prod.json
, or config.local.json
. dev
is used in developmental mode, prod
is picked up in production, and local
can be used for local testing. The config is overwritten in the following order: default, dev, prod, local.
HiGlass App is based on react-create-app and implements the following folder structure:
-
/build
[Do not edit.]Contains the build files.
-
Contains the build configs for webpack and converting Markdown into JSX. Except the JSX, the files are derived from react-create-app.
-
/node_modules
[Do not edit.]Contains thrid party libraries.
-
Contains the public index files of HiGlassApp.
-
Contains node scripts for webpack and converting Markdown into JSX. Except the JSX, the files are derived from react-create-app.
-
Entry point for the application source.
-
Flat folder containing Redux actions. All actions should be exported in the
index.js
. -
Flat folder containing presentational components. See Dan's article for a comparison between presentational and container components.
-
Flat folder containing config files. Configs should host all constant variables.
-
Flat folder containing container components. See Dan's article for a comparison between presentational and container components.
-
Flat folder containing images.
-
Flat folder containing Redux reducers.
-
Flat folder containing services. (A service is considered to be an object or function with a app-wide state, not managed by the Redux store. E.g., the Redux store itself is a service to provide convinient helper functions for undo etc.)
-
Flat folder containing generic style components. Note: this is kind of arbitrary but I like to separate reusable CSS classes from
index.scss
such that I can quickly drop them into other apps. -
Flat folder containing utility functions. (Utility function must be pure and should not have any state.)
-
Flat folder containing all view components. (View components are just like presentational components with the only difference that they are associated to a specific URL. This separation is again arbitrary but I like having all views separated as I consider them uncomposable. Only
Main
should import views.)
-