Dash Responsive Grid Layout
This repository contains the minimal set of code required to create your own custom Dash component.
- Install the dependencies:
npm run start
Write your component code in
src/lib/components. There is a sample component called
ExampleComponent.react.jsthat you can use for inspiration. The demo app is in
src/demoand you will import your example component code into your demo app.
Test your code in a Python environment:
- Build your code
npm run build:js-dev npm run build:py
- Run and modify the
usage.pysample dash app:
Create a production build and publish:
- Build your code:
npm run build:js npm run build:py
- Create a Python tarball
python setup.py sdist
This distribution tarball will get generated in the
- Test your tarball by copying it into a new environment and installing it locally:
pip install dash_responsive_grid_layout-0.0.1.tar.gz
- If it works, then you can publish the component to NPM and PyPI:
twine upload dist/dash_responsive_grid_layout-0.0.1.tar.gz
- Include CSS files in your distribution folder (
dash_responsive_grid_layout) and reference them in
testsfolder contains a sample integration test. This will run a sample Dash app in a browser. Run this with:
The Dash team uses these types of integration tests extensively. Browse the Dash component code on GitHub for more examples of testing (e.g. https://github.com/plotly/dash-core-components)
python -m tests.test_render
True. We will eventually make
serve_locally=Truethe default, follow our progress in this issue.
- Watch the component boilerplate repository to stay informed of changes to our components.
- Learn more about Dash: https://dash.plot.ly
- View the original component boilerplate: https://github.com/plotly/dash-component-boilerplate