This is a repository for practicing React. Create React components and check them with Storybook or write tests. It only deals with content that is closed to React. It does not handle Next.js, etc. For Next.js, see https://github.com/kitsuyui/nextjs-playground/ . For TypeScript, see https://github.com/kitsuyui/ts-playground/ .
If you know how to use raw HTML, you know how to use it, so wrap it as it is as much as possible.
Basically, do not specify the style as much as possible. The style specification should be specified by the user of the component.
As an exception, packages/style-{name}
contains a CSS framework with specific styles.
If there is a size specification, display it with that size. If there is no size specification, it is interpreted as width: auto, height: auto
The size is determined by the font size specification.
- npm package of components
- Snapshot test of components
- Storybook of components
- Test coverage
- Separation method that maintains the extensibility of styles
-
@kitsuyui/react-components
-
@kitsuyui/react-clock
... Clock -
@kitsuyui/react-timer
... Pomodoro timer -
@kitsuyui/react-stopwatch
... Stopwatch -
@kitsuyui/react-dekamoji
... Display big text whole screen -
@kitsuyui/react-wavebox
... Variable size box (for debug) -
@kitsuyui/react-treemap
... Put the box in the box like as marimekko chart -
@kitsuyui/react-measure
... Display size of the box (for debug) -
@kitsuyui/react-textfield
... Text field with IME support -
@kitsuyui/react-editablelabel
... Editable label with IME support - Alarm
- Dice
-
-
@kitsuyui/react-style-bulma
... Bulma CSS framework with@kitsuyui/react-components
MIT