@LWilsonDev

Typescript: Create a React Component with conditional props for each variant

Aug 7, 2023 · 2 min read · You have a lovely component that takes some props. interface PropsA { pear: string; apple: string; } const ComponentA: FC<PropsA> = (props) => { return ///; }; We then realise that we have another component which looks the same but has a diff...

1

Monitoring and measuring React Native performance

Jun 9, 2023 · 5 min read · Improving performance in a React Native app can sometimes feel like a thankless task - you might spend hours refactoring and optimising, but how can you tell if it's helping? When developing for the web there are a lot of tools that can help with per...

AAaric commented

React Native text input styled using just Tailwind - scaling up for accessibility

Jun 3, 2023 · 3 min read · Creating nice styled text inputs in React Native is now easier than ever thanks to Tailwind, meaning we don't need to turn to large UI component libraries like Material any more. However, when ditching the libraries we must now consider all the acces...

Animated bar chart on load - React Native

Apr 13, 2023 · 3 min read · See the finished example Aim Animate a bar chart on the initial load, and when the data changes. The bars should grow in height. Attempt 1 Reanimated provides layout animations out of the box, such as SlideInUp and FadeIn. These are easy to use and r...

Simple animated tab bar in React Native

Feb 4, 2023 · 4 min read · I was looking to build this form designed by pixelz-studio where a user can select to log in either by email or phone number by selecting a button, styled like a tab. I liked the idea of animating the tab selection so that the tab would appear to sli...