Scaling Components Across Multiple Frameworks β Adam Bradley, React Summit Remote Edition 2021
Find the latest React.js talks & workshops at https://portal.gitnation.org Β Β π React Summit Remote Edition 2021 #ReactSummit Website β https://remote.reactsummit.com/ Watch the full version of all the conference talks including QnA sessions on GitNation Video platform, follow the link β http://bit.ly/rsre2021-yt-talks-qna Talk: Scaling Components Across Multiple Frameworks React provides a great ecosystem for React developers, but challenges often arise for multi-team organizations who get to pick the technology of their choice. As teams and projects scale, and technologies change over time, being able to provide a universal component library as a design system for an entire organization proves to be difficult. Stencil was created to help address this issue, most notably for Ionic, which is a UI library for mobile app development using web-technologies. In this talk weβll walk through how Ionic is able to create an Ionic React library, using custom elements (web components) as the lowest level. Using the Stencil compiler, the Ionic team is able to generate various bindings for each of the frameworks, such as React, Angular, and Vue. The benefit of this allows the design team to focus on maintaining one codebase, while the Stencil compiler does the heavy lifting to generate the various output targets. Additionally, end-users of each framework binding get to interact with their traditional component model theyβre familiar with. React developers use @ionic/react no differently than any other React component, and the same goes for Angular and Vue. This event would not take place without the support of sponsors: π Platinum Sponsors Focus Reactive β https://focusreactive.com/ Nx β https://nx.dev/ AWS Amplify β https://docs.amplify.aws/ WP Engine β https://wpengine.com/ Shopify β https://shopify.engineering/ Rangle β https://rangle.io/ π₯ Gold Sponsors Rollbar β https://rollbar.com/product/ MUX β https://mux.com/ JetBrains β https://www.jetbrains.com/ Microsoft β https://aka.ms/devopsjsfm Storyblok β https://www.storyblok.com/ Cloudinary β https://cloudinary.com/ Cleo β https://www.meetcleo.com/ Prismic β https://prismic.io/ G2i β https://www.g2i.co/ Netlify β https://www.netlify.com/ DataDog β https://www.datadoghq.com/ π₯ Silver Sponsors StackHawk β https://www.stackhawk.com/ Kontent β https://kontent.ai/ Magic β https://magic.link/ Aldeia β https://aldeia.world/ Nacelle β https://nacelle.com/ Influxdata β https://www.influxdata.com/ Progress KendoReact β https://www.telerik.com/ Neo4jβhttps://neo4j.com/ Tara β https://tara.ai/