How to Share Your Components Online (Fast)
summary
A set of independent UI blocks is extracted from a monolithic React + TypeScript app by moving block-specific state and functions into the block, exposing external hooks and data via props, and using the React Context API for local child access; wrappers handle global store integration. Blocks are published as a single package to an internal npm registry (built, transpiled, CSS minified, run with npm build and publish) and are already used on several JetBrains pages, cutting integration from days to hours.
AI-written summary · about
chapters (7)
- 0:00Introduction
- 0:23About WebHelp
- 1:16Style guide
- 2:03Complex components aka blocks
- 8:04Sharing blocks
- 11:01Usage examples
- 13:47Conclusion
related talks
27mUp and Running with Universal Components
43mHow to build your reusable UI component library like a pro
46mBuilding Reusable Components ... That Are Actually Reusable
25mBreaking Down Your Web App
30mReusability: Sharing Components
23mBest Practices for reusable UI components
21mBuilding Cross-Platform Component Libraries for Web and Native with React
20mTaking Component Driven One Step Further