Data

Tools

Indexes

Applications

Experiments

Open Source Science

https://github.com/exabyte-io/materials-designer

A standalone React.js/Redux based web application for the design and visualization of atomistic materials structures. Used at Mat3ra.com and can be deployed in standalone mode.

https://github.com/exabyte-io/materials-designer

Science Score: 36.0%

This score indicates how likely this project is to be science-related based on various indicators:

  • ○
    CITATION.cff file
  • ✓
    codemeta.json file
    Found codemeta.json file
  • ✓
    .zenodo.json file
    Found .zenodo.json file
  • ○
    DOI references
  • ○
    Academic publication links
  • ✓
    Committers with academic emails
    1 of 19 committers (5.3%) from academic institutions
  • ○
    Institutional organization owner
  • ○
    JOSS paper metadata
  • ○
    Scientific vocabulary similarity
    Low similarity (14.5%) to scientific vocabulary

Keywords

atomistic-models computer-aided-design materials materials-design materials-informatics materials-science modeling-tool react threejs

Keywords from Contributors

interactive projection sequences genomics observability autograding hacking shellcodes archival modular
Last synced: 5 months ago · JSON representation

Repository

A standalone React.js/Redux based web application for the design and visualization of atomistic materials structures. Used at Mat3ra.com and can be deployed in standalone mode.

Basic Info
Statistics
  • Stars: 12
  • Watchers: 8
  • Forks: 10
  • Open Issues: 20
  • Releases: 183
Topics
atomistic-models computer-aided-design materials materials-design materials-informatics materials-science modeling-tool react threejs
Created almost 7 years ago · Last pushed 6 months ago
Metadata Files
Readme License

README.md

npm version License: Apache

Materials Designer

A standalone React application for atomistic structural design. Deployed within the Mat3ra.com platform as documented here and can be used as a library in any web/Node.js application.

Try Materials Designer in action here

Materials Designer in action

1. Installation

1.1. From source

Materials Designer can be installed from the source as follows:

bash git clone git@github.com:Exabyte-io/materials-designer.git

Or use https, if no SSH authentication is set up with GitHub:

bash git clone https://github.com/Exabyte-io/materials-designer.git

then start the application using Node v20.18:

bash cd materials-designer npm install npm start

Some files might not be downloaded by git clone or git pull commands if your system doesn't have git-lfs installed. To fix this run (on OSX): brew install git-lfs git lfs pull

Open http://localhost:3001 to view the application in the browser.

1.2. Using Docker

See the Docker Files section below.

2. Functionality

2.1. Current Functionality

As documented here:

  • Input/Output Menu
    • Export materials in JSON/POSCAR formats
  • Edit Menu
    • Undo/Redo/Reset/Clone operations
  • View
    • Fullscreen mode
    • Multi-material Editor (combining multiple materials into one)
  • Advanced Menu
    • Creating supercells
    • Creating surfaces/slabs
    • Creating combinatorial sets
    • Creating interpolated sets
    • Run Python Script
    • Launch a Jupyter Lite session
  • Basis Editor
    • Adding/Removing/Modifying sites
    • Adding/Removing/Modifying atomic constraints
    • Switching Crystal/Cartesian units
  • Lattice Editor
    • Adjusting lattice units/types/parameters
  • 3D Editor
    • Visualizing materials
      • Rotation
      • Repetition/Radius
      • Toggle axes
    • Adjusting materials
      • add/remove/select atoms
      • multiple selection with drag-and-drop

2.2. TODO list

Desirable features/fixes for implementation.

General Improvements:

  • switch the color back to white when the material is back to the original after editing
  • show the total number of materials in the list and the current index
  • fix fullscreen support
  • add lattice vectors form to change lattice vectors in a 3x3 matrix with all components explicitly:
  • highlight atoms that are selected in the source editor in the 3D editor and vice versa
  • add the ability to drop files with material structural data to the materials list
    • ESSE JSON and POSCAR parsers already implemented in made.js
    • add a skeleton material with (+) button to the materials list (combines functionality of "Edit" -> "Clone" and " I/O" -> "Import...")
  • save the state of Materials Designer to share materials and exact visualization via URL link.
    • the idea is to be able to share an exact copy of the state of the application
    • materials data is stored in the redux store
    • visualization settings stored in wave.js components, via useState() hook

Specific features:

  • add logic for Interstitials and vacancy concentrations in combinatorial sets

Developer Experience:

  • add tests for all the functionality listed above. We only test advanced operations at current.
  • fix modal dialog exceptions for AdvancedGeometryDialog
  • remove the updateIndex action when the index is the same

3. Development

3.1. Run the application

Execute the following commands when running the application in development mode. Use Node v14.19

bash npm install npm start

3.2. Tests

Tests are implemented using Cypress. To launch it use Node v20 and run:

bash cd tests npm install npm test

To run a specific test feature, pass its relative path as an option:

bash sh run-tests.sh -f=menu/advanced/create-supercell.feature

3.3. Dependencies

This package depends on Made, Wave, and Cove.js among other packages. For the full list, see package.json.

3.4. CI Docker files

The first dockerfiles/app/Dockerfile builds and runs the application. The second dockerfiles/tests/Dockerfile provisions and runs the tests.

Provided docker compose is installed, it can be used like so:

```bash docker compose build materials-designer docker compose build materials-designer-test

docker compose up -d materials-designer sleep 30 # let the app actually start docker compose run materials-designer-test ```

To run tests in the container use default profile by not specifying it:

bash docker compose up -d --build

To run on MacOS, add CYPRESSBASEURL=http://host.docker.internal:3001 to the environment variables in the test container

CYRPRESS_BASE_URL=http://host.docker.internal:3001 docker compose run materials-designer-test

To run both services and execute tests:

CYPRESS_BASE_URL=http://host.docker.internal:3001 docker compose up --abort-on-container-exit --exit-code-from materials-designer-test

For debugging purposes, Materials Designer and test container can be run interactively with access via VNC:

bash docker compose --profile use-vnc up -d --build

Then connect to vnc://localhost:5920 with a VNC client. The password is 123. (Port set in .env file.) Make sure to have VNC client installed on the system, when address is typed in the Chrome browser, the VNC prompt will appear.

3.5. Using Cove.js for local development

If need to link Cove.js into the app for local development, you need

  1. Add the local path of Cove.js to package.json

bash "@exabyte-io/cove.js": "file:../../cove.js"

  1. Run the app

bash npm start

If you need to re-link it again, remove node_modules in cove.js and the app, run npm install, then run npm start again.

3.6. Running tests for JupyterLite Notebooks

To run tests for JupyterLite Notebooks, set the environment variable in .env file. And update the URL for JL dev distribution by getting the URL from the JupyterLite PR preview.

bash VITE_USE_JUPYTERLITE_DEV_URL=true VITE_JUPYTERLITE_DEVELOPMENT_URL="https://deploy-preview-56--mat3ra-jupyterlite.netlify.app"

This should source JL from the development distribution and run only notebook healthcheck tests.

4. Links

  1. Create React App, GitHub Repository
  2. Mat3ra Platform documentation for materials designer.

Owner

  • Name: Mat3ra.com
  • Login: Exabyte-io
  • Kind: organization
  • Email: info@mat3ra.com
  • Location: San Francisco, CA, USA

Materials R&D Cloud

GitHub Events

Total
  • Create event: 72
  • Commit comment event: 1
  • Release event: 34
  • Watch event: 3
  • Delete event: 29
  • Issue comment event: 38
  • Push event: 184
  • Pull request review comment event: 22
  • Pull request review event: 58
  • Pull request event: 68
Last Year
  • Create event: 72
  • Commit comment event: 1
  • Release event: 34
  • Watch event: 3
  • Delete event: 29
  • Issue comment event: 38
  • Push event: 184
  • Pull request review comment event: 22
  • Pull request review event: 58
  • Pull request event: 68

Committers

Last synced: 8 months ago

All Time
  • Total Commits: 1,785
  • Total Committers: 19
  • Avg Commits per committer: 93.947
  • Development Distribution Score (DDS): 0.441
Past Year
  • Commits: 216
  • Committers: 3
  • Avg Commits per committer: 72.0
  • Development Distribution Score (DDS): 0.301
Top Committers
Name Email Commits
VsevolodX 7****X 997
Timur Bazhirov t****r@e****o 281
Mohammad Mohammadi m****d@e****o 114
Kostiantyn Dvornik d****n@g****m 94
tjduigna t****n@g****m 80
adewyer a****r@u****u 73
Yurii Vlasiuk y****k@g****m 61
Sean Warren s****2@g****m 18
fluoxe7ine o****v@g****m 13
Pranab Das 3****s 12
Anton Slipchenko a****o@p****t 10
max m****o@g****m 10
Oleksii Husakov o****v@e****o 7
Jonathan Hanson j****n@e****o 6
Radik Fattakhov r****t@g****m 3
dependabot[bot] 4****] 2
Anton Slipchenko a****o@e****o 2
Vladislav Laktionov v****8@g****m 1
exabyte-io-bot i****o@e****o 1
Committer Domains (Top 20 + Academic)
exabyte.io: 6 plus4u.net: 1 umich.edu: 1

Issues and Pull Requests

Last synced: 6 months ago

All Time
  • Total issues: 3
  • Total pull requests: 270
  • Average time to close issues: 1 day
  • Average time to close pull requests: about 1 month
  • Total issue authors: 2
  • Total pull request authors: 21
  • Average comments per issue: 6.33
  • Average comments per pull request: 0.61
  • Merged pull requests: 192
  • Bot issues: 0
  • Bot pull requests: 22
Past Year
  • Issues: 0
  • Pull requests: 64
  • Average time to close issues: N/A
  • Average time to close pull requests: 4 days
  • Issue authors: 0
  • Pull request authors: 3
  • Average comments per issue: 0
  • Average comments per pull request: 1.11
  • Merged pull requests: 47
  • Bot issues: 0
  • Bot pull requests: 0
View more stats
Top Authors
Issue Authors
  • timurbazhirov (2)
  • blokhin (1)
Pull Request Authors
  • VsevolodX (146)
  • k0stik (37)
  • dependabot[bot] (22)
  • timurbazhirov (22)
  • tjduigna (20)
  • unsigned6 (14)
  • adewyer (13)
  • exabyte-io-bot (8)
  • pranabdas (6)
  • fluoxe7ine (5)
  • mohammadidinani (4)
  • aslipchenk (4)
  • mxs17 (3)
  • blokhin (2)
  • seankwarren (2)
Top Labels
Issue Labels
Pull Request Labels
dependencies (22) come-back-later (2) enhancement (2) milestone (2)

Packages

  • Total packages: 2
  • Total downloads:
    • npm 363 last-month
  • Total dependent packages: 1
    (may contain duplicates)
  • Total dependent repositories: 1
    (may contain duplicates)
  • Total versions: 198
  • Total maintainers: 1
npmjs.org: @exabyte-io/materials-designer

Materials Designer

  • Homepage: http://.
  • License: Apache-2.0
  • Latest release: 3.2.5
    published over 5 years ago
  • Versions: 119
  • Dependent Packages: 1
  • Dependent Repositories: 1
  • Downloads: 48 Last month
Rankings
Downloads: 4.6%
Forks count: 6.7%
Stargazers count: 9.7%
Average: 10.6%
Dependent repos count: 10.8%
Dependent packages count: 21.3%
Maintainers (1)
exabyte-io
Last synced: 6 months ago
npmjs.org: @mat3ra/materials-designer

Materials Designer

  • Homepage: http://.
  • License: Apache-2.0
  • Latest release: 2025.8.2-0
    published 7 months ago
  • Versions: 79
  • Dependent Packages: 0
  • Dependent Repositories: 0
  • Downloads: 315 Last month
Rankings
Dependent repos count: 33.2%
Average: 40.2%
Dependent packages count: 47.2%
Maintainers (1)
exabyte-io
Last synced: 6 months ago

Dependencies

package-lock.json npm
  • 1798 dependencies
package.json npm
  • babel-preset-react-app ^9.1.2 development
  • cross-env ^7.0.3 development
  • eslint 7.32.0 development
  • eslint-config-airbnb 19.0.2 development
  • eslint-config-prettier 8.3.0 development
  • eslint-plugin-import 2.25.3 development
  • eslint-plugin-jsdoc 37.1.0 development
  • eslint-plugin-jsx-a11y 6.5.1 development
  • eslint-plugin-prettier 4.0.0 development
  • eslint-plugin-react 7.27.1 development
  • eslint-plugin-simple-import-sort 7.0.0 development
  • husky 7.0.4 development
  • lint-staged 12.1.2 development
  • prettier 2.5.1 development
  • react ^16.14.0 development
  • react-dom ^16.14.0 development
  • react-error-overlay ^6.0.9 development
  • @babel/cli 7.16.0
  • @babel/core 7.16.0
  • @babel/plugin-proposal-class-properties 7.16.0
  • @babel/preset-env 7.16.4
  • @babel/preset-react 7.16.7
  • @babel/runtime 7.16.7
  • @babel/runtime-corejs2 7.16.7
  • @exabyte-io/made.js 2022.5.5-3
  • @exabyte-io/wave.js 2022.6.8-0
  • @material-ui/core ^4.12.3
  • @material-ui/icons ^4.11.2
  • @uiw/react-codemirror ^3.2.7
  • bootstrap ^3.3.7
  • classnames 2.3.1
  • codemirror ^5.47.0
  • jquery 3.6.0
  • lodash ^4.17.4
  • mathjs ^3.9.0
  • mixwith ^0.1.1
  • node-sass ^4.11.0
  • prop-types ^15.8.0
  • react-bootstrap 0.32.4
  • react-full-screen ^0.2.2
  • react-jss ^8.6.1
  • react-redux ^4.4.8
  • react-s-alert ^1.4.1
  • react-scripts ^4.0.3
  • redux ^3.6.0
  • redux-batched-subscribe ^0.1.6
  • redux-logger ^3.0.6
  • redux-undo ^1.0.0-beta9-9-7
  • sprintf-js ^1.1.2
  • underscore ^1.12.1
  • underscore.string ^3.3.4
tests/package-lock.json npm
  • 624 dependencies
tests/package.json npm
  • almost-equal ^1.1.0 development
  • array-almost-equal ^1.0.0 development
  • chimp 0.51.1 development
  • chromedriver 2.35.0 development
  • deep-equal ^1.0.1 development
  • lodash ^4.17.4 development
  • moment ^2.11.2 development
  • random-seed ^0.3.0 development
  • sleep ^3.0.0 development
  • swig ^1.4.2 development
  • underscore ^1.8.3 development
  • underscore.string ^3.3.4 development
  • urlencode ^1.1.0 development
.github/workflows/cicd.yml actions
  • ./.github/workflows/docker-build-test * composite
  • ./actions/docker/validate * composite
  • ./actions/js/publish * composite
  • ./actions/js/validate * composite
  • actions/checkout v2 composite
.github/workflows/docker-build-test/action.yml actions
  • ./actions/docker/build * composite
  • ./actions/docker/ecr * composite
docker-compose.yml docker
  • materials-designer ${IMAGE_TAG}
  • materials-designer-test ${IMAGE_TAG}
dockerfiles/app/Dockerfile docker
  • ${BASE_IMAGE} ${IMAGE_TAG} build
dockerfiles/app/test/Dockerfile docker
  • ${BASE_IMAGE} ${IMAGE_TAG} build
dockerfiles/centos/Dockerfile docker
  • centos centos7.9.2009 build
dockerfiles/test/Dockerfile docker
  • materials-designer ${BASE_TAG} build
tests-legacy/package-lock.json npm
  • 727 dependencies
tests-legacy/package.json npm
  • @babel/plugin-proposal-class-properties 7.16.0 development
  • @babel/plugin-proposal-export-default-from ^7.22.17 development
  • @babel/cli ^7.20.7
  • @babel/core ^7.20.12
  • @babel/node ^7.20.7
  • @exabyte-io/code.js 2022.6.8-0
  • chimpy npm:@exabyte-io/chimpy@^2023.7.28-0
  • chromedriver ^114.0.3
  • lodash ^4.17.4
  • moment ^2.11.2
  • random-seed ^0.3.0
  • sleep ^6.0.0
  • swig ^1.4.2
  • underscore ^1.8.3
  • underscore.string ^3.3.4