Styleguidist

Storybook provides a sandbox to build UIs in isolation so you can develop hard-to-reach states and edge cases. Implement components and pages without needing to fuss with data, APIs, or business logic. Render components in key states that are tricky to reproduce in an app. Save use cases as stories in plain JavaScript to revisit during development, testing, and QA. Use addons to customize your workflow, automate testing, and integrate with your favorite tools. Stories are a pragmatic, reproducible way to keep track of UI edge cases. Write stories once then reuse them to power automated tests. Whenever you write a story you get a handy test case. Quickly browse stories to make sure your UI looks right. Pinpoint UI changes down to the pixel by comparing image snapshots of stories. Reuse stories in your unit tests to confirm nuanced functionality. Stories show how UIs actually work not just how they're supposed to work. That makes gathering feedback and reproductions easy.

Remotion is a programmatic video creation framework that lets you make real MP4 and other video formats using React code by treating video as a function of frames and rendering components over time, leveraging familiar web technologies such as CSS, Canvas, SVG, and JavaScript to design, animate, and parameterize dynamic content with data, APIs, and interactivity. It includes tools like Remotion Studio for previewing and rendering, Remotion Player for embedding and reacting to data at runtime, Remotion Lambda for scalable server-side or serverless rendering, and additional components like timeline editing, recorder tools, and editor starter templates for building custom video editing applications with React and TypeScript. It supports scalable rendering locally or in the cloud, dynamic editing of props through a visual interface, and fine-grained animation via React hooks and interpolation utilities.