Dynamic Scale
A react component library that dynamically renders a Piano scale given the appropriate input parameters. It is highly customizable
Overview
The Dynamic Scale is a React component that generates a piano scale with customizable parameters. It can be used to display a piano scale with varying features and styling options. The component is bundled into an NPM package using rollup and can be customized on the website provided.
Features
- Customizable Scale: The component allows for the customization of various parameters to generate the desired piano scale.
- White Key Labels: Option to display key labels on the white keys.
- Scale Type: Option to choose between a standard seven white key scale or a scale with 7 + 3 white keys.
- Starting Key: Set the starting key of the scale to any white key.
- Highlighted Keys: Ability to highlight specific keys in the scale by providing an array of positions.
- Custom Colors: Set custom colors for pressed black and white keys.
- Adjustable Width: Set the width of the rendered component.
Summary
The Dynamic Scale is a highly customizable React component that generates a piano scale. It provides options to customize key labels, scale type, starting key, highlighted keys, colors, and width. The component can be easily installed as an npm package and integrated into your React projects.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Rollup
RollupJS is a popular and efficient JavaScript module bundler that takes the code from multiple modules and packages them into a single optimized file, minimizing the overall size of the application and improving its performance.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.