https://github.com/ahnafyy/string-2-react
Turn your valid HTML strings into React components with ease!
https://github.com/ahnafyy/string-2-react
html javascript parser react
Last synced: 2 months ago
JSON representation
Turn your valid HTML strings into React components with ease!
- Host: GitHub
- URL: https://github.com/ahnafyy/string-2-react
- Owner: ahnafyy
- License: mit
- Created: 2023-03-24T16:26:30.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2023-08-21T17:17:55.000Z (almost 3 years ago)
- Last Synced: 2025-10-07T20:18:34.186Z (9 months ago)
- Topics: html, javascript, parser, react
- Language: JavaScript
- Homepage:
- Size: 627 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 6
-
Metadata Files:
- Readme: Readme.MD
- License: License.MD
Awesome Lists containing this project
README
# string-2-react 🧵 ⚛️
Turn your valid HTML strings into React components with ease!
## Installation
You can install the package using `npm` or `yarn`:
```bash
npm install string-2-react
```
```bash
yarn add string-2-react
```
## Usage
```javascript
`const { stringToReactComponent } = require('string-2-react');
const htmlString = '
Hello World
Welcome to my awesome website!
';
const reactComponent = stringToReactComponent(htmlString);
console.log(reactComponent);
// Output:
Hello World
Welcome to my awesome website!
`
```
## API
### `stringToReactComponent(html: string): string`
Transforms the given HTML string into a React component string.
#### Arguments
- `html` (string): The HTML string to convert.
#### Returns
- The React component.
This is a package that converts your valid HTML strings into React components, making it easier to integrate them into your React applications.
## Advantages
- `string-2-react` is a lightweight package that can be easily integrated into your React project.
- It efficiently converts your HTML strings into React components.
- The package is easy to use, and you can get started with just a few lines of code.
- It handles different types of HTML elements, including self-closing tags, start tags, and end tags, as well as `` tags.
## Limitations
- `string-2-react` is not meant to handle complex HTML strings that include other types of non-HTML content besides `<script>` tags.
- Does not sanitize the html
- Does not do validation
- Does not provide support against XSS
## Conclusion
If you find any bugs or want to contribute to the project, feel free to open an issue or submit a pull request on GitHub.