Kyle Shevlin is a software engineer based in Portland, Oregon, who cares deeply about quality in code, writing, and craftsmanship. He focuses on continually improving his skills and helping other developers do the same, while balancing his professional life with competitive golf, gaming, and community-driven learning.
128 articles from this blog
Explores the AsyncData functor for modeling asynchronous state in programming, contrasting it with manual state management and discriminated unions.
Explores simplifying code by using a default 'identity' function to handle missing transformations, inspired by Sandi Metz's talk 'Nothing is Something'.
Using data-* attributes to expose internal state for stable, declarative testing of web components, avoiding brittle shadow DOM selectors.
Argues for using CSS Flex/Grid gaps over margins for spacing elements, promoting a parent-controlled layout strategy for cleaner, more maintainable code.
The article explains the true meaning of 'refactoring' in software development and argues for its proper use to avoid client misunderstandings.
A walkthrough of solving the 'Pyramid Slide Down' coding problem using dynamic programming, starting from the bottom up.
A technical guide explaining the Sliding Window algorithm for solving the 'longest substring without repeating characters' LeetCode problem.
A developer explains how to build a React-based mini-game called 'Test Your Focus' using event-driven state management with useReducer.
Advocates using explicit mapping objects over complex ternaries for state transitions in TypeScript/React, using a theme toggle as an example.
A developer shares a specialized git workflow for separating refactoring from feature work to improve code review efficiency and clarity.
Explains why calling new Date() inside React components creates flaky tests and offers a solution using props for testable, pure components.
A tutorial on building a composable FadeIn animation component using Astro, JavaScript, and CSS for subtle UI flourishes.
A quick tip for developers to alphabetize object keys in code to improve readability and efficiency when order isn't important.
A technical article discussing responsive design challenges and proposing better CSS composition strategies for complex layout changes across breakpoints.
A developer reflects on lessons learned from building a cross-platform React/React Native design system, focusing on consistency, velocity, and avoiding tight coupling.
Argues for naming code components with noun-adjective order (e.g., StreamCreated) instead of adjective-noun for better alphabetical grouping and searchability.
Argues for using multiple React component compositions over inline conditionals for better code maintainability and understandability.
Explains the key difference between `align-items: center` and `text-align: center` in Flexbox columns, especially for cross-platform React development.
A tutorial on creating a custom curved bottom tab bar in React Native using handwritten SVG paths and parametric design principles.
A quick guide to creating a 'minimum full height' layout using Tailwind CSS, explaining the key classes and markup structure.
