All activity

LUCID, an open-source Chrome Developer Tool lets you:
• visualize your React component hierarchy, and state/prop changes
• log GraphQL schema, queries, and mutations in real-time
We welcome all feedback and contributions. Try it out, let us know what you think, and drop us a Github star! And Chrome WebStore stars too!

LUCID
Visualize GraphQL dataflow, React components & state changes

Gossamer Lucid
left a comment
Underlying Technology
💻React:
Lucid parses through your React app to generate an interactive tree graph representing your React component hierarchy, with node-specific state and props data. The tree updates upon each change to the React app's state, and displays a log of state diffs on the left. This is done by creating a persistent data bridge to the user's React application via the...

LUCID
Visualize GraphQL dataflow, React components & state changes