precision-medicine-portal-frontend

React project for the frontend of the Precision Medicine Portal by DC Data Science Node

• Introduction
• Development
  • Step 1: Clone the repository
  • Step 2: Create a branch and develop
  • Step 3: Make a pull request

Introduction

The Data Driven Life Science (DDLS) initiative has appointed four Data Science Nodes (DSNs) to serve as database, data and bioinformatics support for data driven research in life science. This repository contains the code for the frontend of a Precision Medicine Portal by the Precision Medicine DSN, which is hosted at Karolinska Institutet and SciLifeLab.

The short term aim of this portal is to host content related to precision medicine as a starting point for the project.

Step 1: Clone the Repository

Git setup

Clone the repository to your machine:

git clone https://github.com/ScilifelabDataCentre/precision-medicine-portal-frontend.git

Fetch changes at any time from this remote:

git pull upstream dev

The project is set up using npm. If you want to run the project locally, install npm and use it to run the available scripts:

Available Scripts

Note that you need to be in the "react-app" directory. In this directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

npm test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

npm run eject

Note: this is a one-way operation. Once you eject, you can’t go back!

If you aren’t satisfied with the build tool and configuration choices, you can eject at any time. This command will remove the single build dependency from your project.

Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except eject will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.

You don’t have to ever use eject. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.

You will see that a local development server starts running. You can access the web page by opening a web browser and visiting the URI "localhost:5000". To stop the server press CTRL+C in the terminal.

Docker

You can use the provided Dockerfile to build and run a container.

Step 2: Create a branch and develop

Note that commits need to be signed as per SciLifeLab policy. There are many different ways to sign github commits and how to set it up may vary based on your operating system. An example of how to set it up for MacOS can be seen here:

https://gist.github.com/troyfontaine/18c9146295168ee9ca2b30c00bd1b41e

To create a new branch and start developing in it:

git branch my_branch
git checkout my_branch

After doing this you can make any changes you want. You must then either add all changed files or specific changed files to your commit:

git add -A

or

git add my_changed_file

You can then commit and push to your branch:

(NOTE: DO NOT FORGET TO SIGN YOUR COMMITS, by policy only signed commits can be merged into the main branches.)

git commit -S -m "My commit"
git push origin my_branch

The code is now in my_branch in the repository, but you it does not get merged into the main branches without being reviewed as a pull request.

Step 3: Make a pull request

Once you're finished with your edits and they are committed and pushed to your branch, it's time to open a pull request.

You can find full documentation on the GitHub help website, however in short:

• Visit the dev repository: https://github.com/ScilifelabDataCentre/precision-medicine-portal-frontend
• Find the branch my_branch that you created and pushed to
• Click the button that reads "New Pull Request"
• Add/change title as well as a description of what you've done
• Add reviewers from the organization to review your pull request
• Click Create Pull Request

Once created, a member of the website team will review your changes. Once approved, they will be merged and deployed.

How to get help

If in doubt, you can ask for help by emailing [email protected].

Credits

The portal was built by the DDLS Precision Medicine Data Science Node with colleagues at SciLifeLab.