blog
2026
2024
- Should I Commit package-lock.json or yarn.lock?Yes — always commit your package-lock.json and yarn.lock. Here's why lock files matter for reproducible builds, CI stability, and team consistency.
- Avoid Nested Declared React ComponentsWhy declaring React components inside other components causes re-mounts, state loss, and performance issues — and what to do instead.
2021
- React Component Patterns: A Practical GuideA guide to React component patterns — compound components, render props, HOCs, hooks, and more. Trade-offs, use cases, and practical examples for building reusable React code.
- Accessibility Lessons Learned: Common a11y Issues Developers MissA practical list of common and non-obvious accessibility (a11y) issues for web developers — catch them early during coding, PR reviews, or QA testing.
- File Naming Convention: A Consistent Pattern for ProjectsHow to choose a file naming convention for your project — kebab-case, camelCase, PascalCase, and when to use each for components, utilities, and config files.
2020
- How to Optimize SVGs in ReactStep-by-step guide to optimizing SVGs in React — use SVGOMG to shrink file size by 40–60%, then convert to accessible, performant React components.
- SVG for Web Performance: Why Scalable Vector Graphics WinWhy SVG is ideal for responsive web design — small file sizes, lossless scaling, CSS styling, and accessibility. A practical guide to using SVG on the modern web.
- Adding ESLint to Webpack with React and TypeScriptStep-by-step guide to configuring ESLint in a Webpack project with React and TypeScript — enforce consistent code style and catch errors before they ship.