Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Storybook: Try to integrate the playground into Storybook #18191

Merged
merged 11 commits into from
Nov 12, 2019
Merged

Storybook: Try to integrate the playground into Storybook #18191

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
e9dcc34
Storybook: Try to integrate the playground into Storybook
gziolo Oct 30, 2019
6c3b742
Load Noto font in storybook via preview-head.html
Oct 30, 2019
185065c
Add scss support for Storybook!
Oct 30, 2019
5187d04
Remove unused parcel-bundler
Oct 30, 2019
4437070
Update mentions of the playground with Storybook
gziolo Oct 31, 2019
c4466cd
Fix issues found during self-review
gziolo Oct 31, 2019
854d0fe
Add back playground:* aliasing storybook:* for the time being
gziolo Oct 31, 2019
73681d5
Add help info for old commands
gziolo Oct 31, 2019
ab0d635
Ensure that source for the playground can be presented in Storybook
gziolo Oct 31, 2019
63b48a1
Move and update the README document added for Storybook
gziolo Nov 4, 2019
74148c6
Resolve all issues raised in the review
gziolo Nov 12, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions .travis.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -203,8 +203,7 @@ jobs:
install:
- npm ci
before_deploy:
- npm run playground:build -- --public-url '/gutenberg'
- npm run design-system:build
- npm run storybook:build
deploy:
provider: pages
skip_cleanup: true
Expand Down
12 changes: 8 additions & 4 deletions docs/contributors/getting-started.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,10 +61,14 @@ You can also type `npm run package-plugin` which will run the two commands above
[npm]: https://www.npmjs.com/
[nvm]: https://github.com/creationix/nvm

## Playground
## Storybook

The Gutenberg repository also includes a static Gutenberg playground that allows testing and developing in a WordPress-agnostic context. This is very helpful for developing reusable components and trying generic JavaScript modules without any backend dependency.
> Storybook is an open source tool for developing UI components in isolation for React, React Native and more. It makes building stunning UIs organized and efficient.

You can launch the playground by running `npm run playground:dev` locally. The playground should be available on [http://localhost:1234](http://localhost:1234).
The Gutenberg repository also includes [Storybook] integration that allows testing and developing in a WordPress-agnostic context. This is very helpful for developing reusable components and trying generic JavaScript modules without any backend dependency.

You can also test the playground version of the current master branch on GitHub Pages: [https://wordpress.github.io/gutenberg/](https://wordpress.github.io/gutenberg/)
You can launch Storybook by running `npm run storybook:dev` locally. It will open in your browser automatically.

You can also test Storybook for the current `master` branch on GitHub Pages: [https://wordpress.github.io/gutenberg/](https://wordpress.github.io/gutenberg/)

[Storybook]: https://storybook.js.org/
Loading