https://github.com/orizens/-orizens-react-be
bootstrap element primitive component with utility classes and auto-completion - a la "styled" jsx, just with readable classes
https://github.com/orizens/-orizens-react-be
bootstrap react
Last synced: 6 months ago
JSON representation
bootstrap element primitive component with utility classes and auto-completion - a la "styled" jsx, just with readable classes
- Host: GitHub
- URL: https://github.com/orizens/-orizens-react-be
- Owner: orizens
- Created: 2021-03-08T00:07:48.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2024-09-06T06:24:58.000Z (almost 2 years ago)
- Last Synced: 2025-03-21T19:01:36.090Z (over 1 year ago)
- Topics: bootstrap, react
- Language: CSS
- Homepage: https://orizens.github.io/-orizens-react-be/
- Size: 4.12 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# @orizens/react-be
> Bootstrap Element is a primitive component with typed utility classes and auto-completion - a la 'styled' jsx, just with readable classes
[](https://www.npmjs.com/package/@orizens/react-be) [](https://standardjs.com)
## Install React-BE
```bash
npm install --save @orizens/react-be
```
Make sure your project includes bootstrap.
## WHY?
Bootstrap is still popular and along with that, react-bootstrap is as well.
React-BE solves the problem of development experience and adds auto-completion for bootstrap utility functions.
## DEMO
https://orizens.github.io/-orizens-react-be/
## Usage
```tsx
import React, { Component } from 'react'
import { Be, Row, H4, Section, Flex, Div, Ol, Li } from '@orizens/react-be'
function Example() {
return (
React-BE
react-be is a time saver
- there are more elements - with FULL Typescript support
- more elements are coming soon...
)
}
```
## Support HTML-Elements powered by React-BE
these are the elements that are available with React-Be typings:
Flex, Column, Row, P, Img, Li, on, Div, Section, Ol, Ul, Span, H1, H2, H3, H4, H5, H6
more to come.
## Future Features
- [x] support these elements with typescript: img
- [x] support column size
- [ ] support responsive variations (i.e, flex-md-column, col-md-2)
- [ ] add support for mulitple values for special utilities (or all)
- [x] add built in utility-elements: Flex, Column, Row, P, Img, Li, on, Div, Section, Ol, Ul, Span, H1, H2, H3, H4, H5, H6
- [ ] add more built in utility/html-elements: b, em, nav, footer, a, etc..
## License
MIT © [orizens](https://github.com/orizens)