This repo contains a set of components for displaying and interacting with material science data. These components provide the building blocks for the interactive components of the Materials Project website.
First, clone the mp-react-components repo:
git clone firstname.lastname@example.org:materialsproject/mp-react-components.git
From inside the top directory, install the dependencies using:
Deploy the app using:
All the components are located in
Create a new folder for each new component and name the folder after the component.
The file structure for each component should look like the following:
To add a component to the list of components exported by this library, import and add the component to
Developing with dash-mp-components
If you have a local version of
mp-react-components, you'll probably
want to use the local version of
mp-react-components for a better development workflow.
Running those commands will tell
NPM to use your local version of
cd <DASH_MP_HOME> npm link <REACT_MP_HOME>
Deploy to npm
npm build-publish to build the project.
npm publish to push to npm
Every push triggers a build. If the build is succesfull, a snapshot is pushed to npm, as a tagged package. To use the latest snapshot, type the following command
npm install @materialsproject/mp-react-components@next
npm version minor -m "Upgrade to %s" to add a tag. Once the tag is pushed, an action will
build the components and push the package to build to npm
Deploy storybook to github pages
This will build and deploy the storybook.
Stories are defined in