Storybook Addon Material UI
Addon for storybook wich wrap material-ui components into MuiThemeProvider. :page_with_curl: This helps and simplifies development of material-ui based components.
Overview:
The Codacy Badgenpm versionLive demoStorybook Addon Material-UI is a development environment that helps in creating Material-UI components. It is an addon for React Storybook that wraps components into MuiThemeProvider, accelerating and simplifying the development process for Material-UI based applications. The project also provides a demo page where users can discover Material-UI Theme Settings for any component and create custom themes online. Running the project locally in the work environment allows users to take full advantage of its features.
Features:
- Wrapped in the theme provider: The development environment is wrapped in the MuiThemeProvider, allowing developers to start developing with the base light theme.
- Injected TapEvent Plugin: The project has the TapEvent Plugin injected, making it easy to test on mobile devices.
- Switching themes: Users can easily switch between different themes to see how it looks with their components.
- Creating custom themes: Users can create custom themes either by code or using the visual editor.
- Dynamic visual themes editing: The project allows for dynamic editing of themes, providing users with all available theme properties.
- Google material color palette picker: Users can pick colors from the Google material color palette.
- Save made changes and download in JSON file: The project allows users to save the changes they made to themes and download them in a JSON file.
- Part of React Theming: The project is part of React Theming and enables the creation of themable React Components.
- Works with Storybook 3.0: The project is compatible with Storybook 3.0, enabling the use of its features.
- 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
- Material UI
material-ui adds classes to Tailwind CSS for all common UI components. Classes like btn, card, etc. This allows us to focus on important things instead of making basic elements for every project.
- Templates & Themes
A template or theme refers to a pre-designed layout or structure that provides a basic framework for building a specific type of application or website. It typically includes good design, placeholder content and functional features, allowing developers to customize and fill in the details according to their specific needs.
- Eslint
ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.
- GitHub Pages
Gridsome is a Vue.js-based static site generator that makes it easy to build fast and flexible websites and applications by leveraging modern web technologies like GraphQL, Webpack, and hot reloading
- Storybook
Storybook is a tool for developing and testing UI components in isolation. It provides a sandbox environment where you can experiment with different props and states to see how your component responds.
