https://github.com/ivan-kleshnin/react-safe
Safe JSX: syntactic sugar over dangerouslySetInnerHTML
https://github.com/ivan-kleshnin/react-safe
Last synced: 3 months ago
JSON representation
Safe JSX: syntactic sugar over dangerouslySetInnerHTML
- Host: GitHub
- URL: https://github.com/ivan-kleshnin/react-safe
- Owner: ivan-kleshnin
- License: mit
- Created: 2017-08-28T13:59:44.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2019-03-25T06:57:09.000Z (over 6 years ago)
- Last Synced: 2025-03-28T15:11:12.552Z (7 months ago)
- Language: JavaScript
- Size: 44.9 KB
- Stars: 14
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React Safe
This package provides a syntactic sugar over the raw `dangerousSetInnerHTML`.
## Motivation
In real projects, at least in my experience, the usage of `dangerousSetInnerHTML` is extensive.
Which brings two problems:
1. It's too long and ugly for its frequency. Also JSX does not look like HTML anymore as tag contents
are passed via attributes. Which kinda defeats the usage point of JSX.
2. The term "dangerous" is misleading. It represents something a programmer considers safe(!)
instead. So it kinda spams the vision with irrelevant signals of *false danger* decreasing the
capability to notice real threats.
## Examples
#### React (vanilla)
```jsx
```
#### React Safe
```jsx
{page.title}
{renderMD(page.body)}
```
## Warning
React-Safe is a thin wrapper over [dangerouslySetInnerHTML](https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml)
so all the usual concerns about XSS attacks and security in general apply. Check the above link for
more information.
## License
MIT