andywer / andywer/ideabox

ReactCSSDOM

Offen
#15 5 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
Vorherrschende Sprache
Keine Sprachdaten
Sterne
1
Forks
1
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

Extend `react-dom` to provide a generic, fully featured, declarative styling API that is as easy to use as inline styles, but comes with the power of CSS classes:

```jsx
import React from 'react'

const MyButton = ({ children, primary }) => {
return (
{children}
)
}
export default MyButton
```

To render your app:

```jsx
import * as ReactCSSDOM from 'react-css-dom' // instead of react-dom
import MyButton from './Button'

ReactCSSDOM.render(
Click me,
document.getElementById('demo')
)
```

Server-side rendering should also be really simple. Something like that:

```jsx
import * as ReactCSSDOM from 'react-css-dom' // instead of react-dom
import MyButton from './Button'

const stylesheet = ReactCSSDOM.createStylesheet()
const rendered = ReactCSSDOM.renderToString(Click me, stylesheet)

const html = `


${stylesheet.toStyleTag()}


${rendered}

`
```

## Benefits

- Great for component libraries, since it requires no dependencies to be added to the library
- Thus helps keeping the bundle small
- Dead-simple to set up, even for SSR
- Generic, universal styling API

Beitragsleitfaden

Für dieses Repository ist kein Beitragsleitfaden indexiert

Bewertung

Dieses Issue wurde noch nicht bewertet.

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.