CSS in JS is all the rage, but how do you target nested components?
Automatically generate component unique test IDs for React
A build time draft state solution for markdown in gatsby.
Doing what an engineer does best, rewriting.
My personal website originally started as a blog built with ghost, the blogging platform. It was simple, easy to use, and had a web-based authoring experience. But I began to feel its limitations in terms of customizing my themes as well as adding other sections, such as projects, or books I’ve read. I switched to using jekyll and did a fresh rewrite. I chose a theme and customized it to work the…Keep Reading#react#gatsby#website
What is CodePush and is it worth integrating into your React Native App
Last week at work was hack week, so I took the time to look into getting CodePush into our React Native app. It was pretty simple to get set up but after some discussion with the team, we started to question whether or not CodePush was worth the added complexity. So what is CodePush? CodePush is a service provided by Microsoft for Cordova and React Native apps, that allows you to push out new…Keep Reading#react-native#react#codepush#git-workflow#app-release
Get a local module working with a React Native app for quick development
After building an app using React Native and using modules from NPM, you may decide that a component in your app could be used by others and you want to share it to NPM. While the typical “How to deploy a JS module to NPM” will get you most of the way there, React Native has a few caveats that need to be addressed. Let’s start by finding a component in our app that can be pulled out into it’s own…Keep Reading#react#react-native#npm#module
How to get the dimensions of a view in React Native
A common pattern in React Native is changing the layout/sizes of views based on the size of its parent view. We can use React Native’s implementation of flexbox to get us 90% of the way there. But there are just some layouts that flexbox just has a hard time with. In the app I am building at work, there are two common instances where this is the case. When an absolutely positioned view needs to…Keep Reading#react#react-native#module
Rendering large lists can quickly become very slow. Insert FlatList.
Coming from a primarily web front end and backend developer, I have learned to take some things for granted. On today’s modern hardware, I don’t spend a ton of time thinking about how something might result in slow render performance, since that usually isn’t an issue. But now that I’ve been doing a lot of mobile development with React Native, some patterns have come around to bite me primarily…Keep Reading#react#react-native#scrollview#flatlist#performance#optimization