Skip to main content

Dash UI core component suite

Project description

# Dash Components Core

This package provides the core React component suite for [Dash2][].

## Development

### Demo server

You can start up a demo development server to see a demo of the rendered
components:

```sh
$ builder run demo
$ open http://localhost:9000
```

You have to maintain the list of components in `demo/Demo.react.js`.

### Code quality and tests

#### To run lint and unit tests:

```sh
$ npm test
```

#### To run unit tests and watch for changes:

```sh
$ npm run test-watch
```

#### To debug unit tests in a browser (Chrome):

```sh
$ npm run test-debug
```

1. Wait until Chrome launches.
2. Click the "DEBUG" button in the top right corner.
3. Open up Chrome Devtools (`Cmd+opt+i`).
4. Click the "Sources" tab.
5. Find source files
- Navigate to `webpack:// -> . -> spec/components` to find your test source files.
- Navigate to `webpack:// -> [your/repo/path]] -> dash-core-components -> src` to find your component source files.
6. Now you can set breakpoints and reload the page to hit them.
7. The test output is available in the "Console" tab, or in any tab by pressing "Esc".

#### To run a specific test

In your test, append `.only` to a `describe` or `it` statement:

```javascript
describe.only('Foo component', () => {
// ...
})l
```

### Testing your components in Dash

1. Build development bundle to `lib/` and watch for changes

# Once this is started, you can just leave it running.
$ npm start

2. Install module locally (after every change)

# Generate metadata, and build the JavaScript bundle
$ npm run install-local

# Now you're done. For subsequent changes, if you've got `npm start`
# running in a separate process, it's enough to just do:
$ python setup.py install

3. Run the dash layout you want to test

# Import dash_core_components to your layout, then run it:
$ python my_dash_layout.py

## Installing python package locally

Before publishing to PyPi, you can test installing the module locally:

```sh
# Install in `site-packages` on your machine
$ npm run install-local
```

## Uninstalling python package locally

```sh
$ npm run uninstall-local
```

## Publishing

For now, multiple steps are necessary for publishing to NPM and PyPi,
respectively. TODO:
[#5](https://github.com/plotly/dash-components-archetype/issues/5) will roll up
publishing steps into one workflow.

Ask @chriddyp to get NPM / PyPi package publishing accesss.

1. Preparing to publish to NPM

# Bump the package version
$ npm version major|minor|patch

# Push branch and tags to repo
$ git push --follow-tags

2. Preparing to publish to PyPi

# Bump the PyPi package to the same version
$ vi setup.py

# Commit to github
$ git add setup.py
$ git commit -m "Bump pypi package version to vx.x.x"

3. Publish to npm and PyPi

$ npm run publish-all


## Builder / Archetype

We use [Builder][] to centrally manage build configuration, dependencies, and
scripts.

To see all `builder` scripts available:

```sh
$ builder help
```

See the [dash-components-archetype][] repo for more information.

[Builder]: https://github.com/FormidableLabs/builder
[Dash2]: https://github.com/plotly/dash2
[NPM package authors]: https://www.npmjs.com/package/dash-core-components/access
[PyPi]: https://pypi.python.org/pypi

Project details


Release history Release notifications | RSS feed

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

dash_core_components-0.2.8.tar.gz (835.7 kB view hashes)

Uploaded Source

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page