3 ms·

This is great to see. I've always been a fan of Storybook but have also struggled with it a lot. Each new release has reduced the struggle. To their credit, it'

by city41 6y ago

This is great to see. I've always been a fan of Storybook but have also struggled with it a lot. Each new release has reduced the struggle. To their credit, it's hard to drop something like Storybook into a project because frontend projects have almost no rhyme or reason to how they are made up (well, React anyway, which is what I mostly work in). I am also using Storybook for my game dev. I wrote my own renderer for my engine and so the entities in my game have stories. It makes building new entities and seeing how two entities interact so much nicer and faster.

Kiro 6y ago
Do you mind explaining more about how you use Storybook for your game entities?
- city41 6y ago
  I will eventually write a blog post about it. But in the mean time this tweet give the overall gist https://twitter.com/mattegreer/status/1244012323976515584 https://twitter.com/mattegreer/status/1244012323976515584 I made it so I can create a game scene out of ASCII characters, and then I can also tweak the scene and/or entities within the scene with code if needed (but it almost never is). Then the Storybook renderer instantiates a canvas and the game engine, and populates it with the scene. Making your own renderer is pretty much totally undocumented. I took the React renderer as a basis (https://github.com/storybookjs/storybook/tree/next/app/react https://github.com/storybookjs/storybook/tree/next/app/react) and tweaked from there. I have spoken with Michael Shilman about this and there are plans to document it and make it easier to do, not sure where they are on that though. It's so undocumented and uncharted I'm not even sure if "renderer" is the right name for these things.
  - ghengeveld 6y ago
    There's documentation for creating your own framework integration now: https://storybook.js.org/docs/react/api/new-frameworks https://storybook.js.org/docs/react/api/new-frameworks
    - city41 6y ago
      Oh awesome! Thanks for adding that, I will definitely be making use.
- zol 6y ago
  Storybook is pretty flexible if your work can render in a web browser. We recently rebuilt Chromatic's CLI and as an experiment decided to write stories to record and regression test the many states the CLI can be in. We were able to use Storybook as we used a React based library to output to STDOUT. We're loving the result so far as it makes it really easy to answer questions like - "what will the user see if they have passed flag X but their workspace is in state Y and Z their build has failed to upload". You can check out the Storybook here: https://5d67dc0374b2e300209c41e7-kgfpdfjsbm.chromatic.com/?path=/story/cli-messages-errors--incompatible-options https://5d67dc0374b2e300209c41e7-kgfpdfjsbm.chromatic.com/?p... If I was building a game I'd find the component driven methodology (https://www.componentdriven.org https://www.componentdriven.org) with a component explorer like Storybook or something specific to the game dev environment ideal because of how many hard to reach key states games have that could easily break as a result of code changes somewhere else.

by city41 6y ago

Kiro 6y ago

Do you mind explaining more about how you use Storybook for your game entities?

city41 6y ago
I will eventually write a blog post about it. But in the mean time this tweet give the overall gist https://twitter.com/mattegreer/status/1244012323976515584 https://twitter.com/mattegreer/status/1244012323976515584 I made it so I can create a game scene out of ASCII characters, and then I can also tweak the scene and/or entities within the scene with code if needed (but it almost never is). Then the Storybook renderer instantiates a canvas and the game engine, and populates it with the scene. Making your own renderer is pretty much totally undocumented. I took the React renderer as a basis (https://github.com/storybookjs/storybook/tree/next/app/react https://github.com/storybookjs/storybook/tree/next/app/react) and tweaked from there. I have spoken with Michael Shilman about this and there are plans to document it and make it easier to do, not sure where they are on that though. It's so undocumented and uncharted I'm not even sure if "renderer" is the right name for these things.
- ghengeveld 6y ago
  There's documentation for creating your own framework integration now: https://storybook.js.org/docs/react/api/new-frameworks https://storybook.js.org/docs/react/api/new-frameworks
  - city41 6y ago
    Oh awesome! Thanks for adding that, I will definitely be making use.
zol 6y ago
Storybook is pretty flexible if your work can render in a web browser. We recently rebuilt Chromatic's CLI and as an experiment decided to write stories to record and regression test the many states the CLI can be in. We were able to use Storybook as we used a React based library to output to STDOUT. We're loving the result so far as it makes it really easy to answer questions like - "what will the user see if they have passed flag X but their workspace is in state Y and Z their build has failed to upload". You can check out the Storybook here: https://5d67dc0374b2e300209c41e7-kgfpdfjsbm.chromatic.com/?path=/story/cli-messages-errors--incompatible-options https://5d67dc0374b2e300209c41e7-kgfpdfjsbm.chromatic.com/?p... If I was building a game I'd find the component driven methodology (https://www.componentdriven.org https://www.componentdriven.org) with a component explorer like Storybook or something specific to the game dev environment ideal because of how many hard to reach key states games have that could easily break as a result of code changes somewhere else.