Writing
Articles from 2024
Reviewed English translations of articles originally published in Japanese on Zenn and note.
December 2024
- From Zenn
@angular-eslint Can Leave package.json — Migrate to ESLint v9-Ready angular-eslint
ESLint v8 reached EOL in October 2024. This guide walks through Flat Config migration with @eslint/migrate-config and switching from @angular-eslint to angular-eslint via ng add.
- From Zenn
Printing Only Selected Elements in Ionic — DOM-to-Image and Print Stylesheets
How I print food-label layouts from an Ionic app: convert preview HTML to images with dom-to-image-more, tile them for multi-up printing, and use @media print CSS to hide everything else.
- From Zenn
Use Stripe on Mobile Too — Capacitor Stripe Plugin Updates in 2024
A 2024 recap of the Capacitor Stripe plugins I maintain: Capacitor v6, Stripe Terminal RC, Swift Package Manager support, and a full Kotlin migration on Android.
- From Zenn
Why Capacitor Stripe Plugins Pin Minor SDK Versions Instead of Up to Next Major
Stripe SDK SemVer looks safe on paper, but minor releases often break plugin users. I explain why I pin to minor versions and how to override Android SDK versions in variables.gradle.
- From Zenn
Match Ionic iOS List Design to iOS 18 with CSS — Inset Lists, Icons, and Group Styling
Use ion-list inset, ion-item-group, and scoped CSS to recreate iOS Settings-style lists with colored icons, headers, notes, and rounded group backgrounds.
- From Zenn
Capacitor Plugins I Use in Production — A List by App
Capacitor and Cordova plugins I rely on across tipsys, winecode, Food Label Printing, and an ODSS business app—beyond the awesome-capacitorjs catalog.
November 2024
- From Zenn
Capacitor Configuration Options — A capacitor.config.ts Reference
A walkthrough of CapacitorConfig settings in capacitor.config.ts: app identity, WebView behavior, Android and iOS overrides, server and Cordova options, and plugin configuration.
- From Zenn
A Fresh Look at Ionic Global Configuration — IonicConfig Options Explained
How to pass IonicConfig through provideIonicAngular, setupIonicReact, or IonicVue—and what each global option controls for animation, platform mode, navigation, and security.
- From Zenn
What LINE's Chat List Taught Me About Virtual Scroll Design
How LINE keeps chat-list row height fixed despite variable preview text, and why that choice pays off for virtual scroll performance.
- From Zenn
The CSS Property Behind LINE-Style Chat UI: flex-direction: column-reverse
Use flex-direction: column-reverse to anchor chat UIs at the bottom, append new messages without scroll jumps, and load older messages above.
- From Zenn
Implement Scroll-Hiding Headers Easily in Ionic Angular
A library for scroll-hiding headers in Ionic Angular, with support for ion-content scrolling and Angular CDK virtual scroll.
- From Zenn
Implement a Photo Slider Modal Easily in Ionic Angular
Use @rdlabo/ionic-angular-photo-editor to open a full-screen photo viewer modal from any Ionic Angular app without duplicating slider code.
- From Zenn
Implement Photo Editing Easily in Ionic Angular
Wrap TUI Image Editor for Ionic Angular with @rdlabo/ionic-angular-photo-editor for crop, rotate, filters, and brightness in a modal.
- From Zenn
Using AAR Files in Capacitor Android Plugins
Add an AAR distributed outside Maven as a local Gradle module in a Capacitor Android project so users can install it after accepting the license.
- From Zenn
Comparing Plugin Code in Capacitor, Flutter, and React Native
Side-by-side Kotlin echo plugins for Capacitor, React Native, and Flutter show how each framework registers methods and bridges to JavaScript.
- From Zenn
Review Theme Colors and Dark Mode Settings Changed in Ionic 8
Ionic 8 empties the default variables.scss in favor of WCAG AA contrast colors in core styles, updates the color generator, and moves dark mode to :root.ion-palette-dark with CSS imports.
- From Zenn
Five Steps to Migrate a Capacitor Plugin to SPM Support
Rename plugin entry files, run capacitor-plugin-converter, scaffold a fresh plugin template, replace the ios folder and podspec paths, then mirror CocoaPods dependencies in Package.swift.
- From Zenn
How to Tell Whether a Capacitor Plugin Supports SPM
Capacitor plugins usually ship both a .podspec for CocoaPods and Package.swift for Swift Package Manager — here is how to check each and what to expect as SPM adoption grows.
- From Zenn
How to Adopt Swift Package Manager in Capacitor iOS
Capacitor v6 adds experimental SPM support via `npx cap add ios --packagemanager SPM`, replaces the Podfile with CapApp-SPM, and removes the need for manual pod update.
- From Zenn
Ionic Is a UI Framework Specialized for Mobile UI
From 2018 book definitions to Ionic 8 in 2024 — Ionic is an open-source mobile UI toolkit built on web standards, not just a hybrid-app framework tied to Angular.
- From Zenn
Two Snags When Updating a Static Prerender Site to Angular 19
While upgrading Angular prerender sites to v19, I hit a TS2315 Http2ServerResponse generic error fixed by reinstalling node_modules and Sass @import deprecation warnings addressed with sass-migrator.
October 2024
July 2024
- From Zenn
Building an OSS for Variable-Size and Reverse Virtual Scroll with Angular CDK
Why I created @rdlabo/ngx-cdk-scroll-strategies for per-item virtual scroll sizes and LINE-style reverse scrolling on CdkVirtualScrollViewport.
- From Zenn
Four Things to Watch When Implementing Stripe Identity
Lessons from running Stripe Identity in production in Japan—document types, My Number card cases, lighting, and how to handle verification failures.
- From Zenn
Angular Signal Effects Are Clearer with IIFEs
Why effects skip async and conditional signal reads, and two patterns—IIFE and first-line assignment—to register dependencies reliably.
January 2024
- From Zenn
[Ionic Angular] ionic-angular-collect-icons — Simplifying addIcons
Auto-collect ion-icon name attributes and generate addIcons registrations for Ionic Angular standalone apps, with dev and production workflows.
- From Zenn
Checking the Latest Ionic Angular Setup as of January 2024
A January 2024 checklist for Ionic Angular: New Form Syntax, Angular and Ionic standalone migration, and built-in control flow.