React to Web Component
React, everywhere.
Unleash the true potential of React with React to Web Component.
Seamlessly integrate React components anywhere you use HTML. Liberate your React component library and get the benefits of micro frontends without the overhead.
Getting Started with R2WC
1. Start with a React component
Use a component from your existing React component library (or build a new one), and we’ll do the rest! For this example, we created a component that shows off all the types we support. You can use any React component you’d like.
2. Create a web component
Call R2WC with your component and type specifiers, then define the custom element. In addition to supporting built-in types like strings, numbers, and booleans, we also support functions and complex data.
3. Use your new React web component anywhere!
It’s that simple! Now you can add your React component to any HTML page.
Seamless Integration Into Any Space
- Effortlessly integrate React components into any web project, regardless of the framework or library being used.
- Imagine the possibilities—whether it's your Angular app, Vue app, or even a vanilla JS project, React can be at the core of it all.
- Say goodbye to the limitations of framework dependencies and unlock the true potential of React's declarative UI and robust ecosystem.
Universal Component Libraries
- Take your component library to the next level. Build a multi-entry component library that empowers developers to use React components seamlessly across different projects.
- Whether it's a React app, an Angular project, or any other web application, your components will be easily accessible and reusable. Embrace the vision of React ubiquity and expand the influence of your components far and wide.
Micro Frontends without Module Federation
- Micro Frontends offer unparalleled collaboration between individual development teams. Module Federation is the defacto solution for coordinating your MFEs, but it brings a lot of complexity.
- Until now! With web components, you can achieve all the benefits of Micro Frontends using existing methods without the complexities introduced by Module Federation.
Try React to Web Component live!
React-to-Web-Component has saved us countless manhours. Before R2WC, our robust React component library was limited to projects using React. Now we can use our React components as custom elements within any HTML framework!
Christopher Baker
Director of React Consulting
