Measuring Coverage of React Design System

React Advanced

React Advanced 2023

Karan Kiri

React Summit US

React Summit US 2023

How to Improve Your Web Application's Security Using Mozilla Observatory

React Day Berlin

React Day Berlin 2023

In today's digital landscape, web application security is of paramount importance to protect sensitive user data and maintain user trust. The Mozilla Observatory is a powerful tool that can help developers assess the security posture of their web applications. In this talk we'll learn how to improve the security of web applications using the Mozilla Observatory.

Design systems are becoming increasingly popular in modern front-end development. However, measuring the usage and coverage of these design systems is often challenging. In this lightning talk, I'll discuss about a tool that we're working on which uses react-scanner and Abstract Syntax Tree (AST) with custom scripts to generate component usage data for a React design system. The talk will cover how we generate this data and how it is rendered in a dashboard to provide valuable insights on the coverage of the design system. - Introduction to react-scanner - Measuring Component Usage - Identifying Native HTML elements and Styled Components - Showing Tree structure of Page in terms of Components - Highlighting Anti Patterns - Benefits / Use Cases for this tool

Design systems are becoming increasingly popular in modern front-end development. However, measuring the usage and coverage of these design systems is often challenging. In this lightning talk, I'll discuss about a tool that we're working on which uses react-scanner and Abstract Syntax Tree (AST) with custom scripts to generate component usage data for a React design system.  The talk will cover how we generate this data and how it is rendered in a dashboard to provide valuable insights on the coverage of the design system. - Introduction to  react-scanner- Measuring Component Usage- Identifying Native HTML elements and Styled Components- Showing Tree structure of Page in terms of Components- Highlighting Anti Patterns- Benefits / Use Cases for this tool