Using Render Props to Share Logic Across Platforms in React
This story details a process that was created before the introduction of React hooks. Hooks and functional components greatly simplify sharing code, and that process is documented here: https://www.braingu.com/blog/share-react-component-logic
However, this process is still relevant for class components, or if you just want to learn more about using Higher-Order Components…
Simplify Your Code by Making Your WebView and React Native Components Run Each Other’s Functions
Programmers are frequently afflicted with what I call “there must be a better way” (TeMBaW) syndrome. TeMBaW frequently occurs when you successfully accomplish something new to you. However, after that initial sense of accomplishment, some nagging details start rearing their head like that tickling scratchiness in the back of your…
Creating a Expo-friendly Reusable Component by Wrapping a JS Library into a React Component with No Native Code.
Introduction
This post is a continuation and improvement of the techniques discussed in a previous post. In that article, I described a technique that combined Expo’s ease of development, Webpack’s packaging capability, Gulp’s task automation, and React Native’s WebView component in order to covert an UI oriented JavaScript library into React…
Creating a Reusable Component by Wrapping a JS Library in to a React Component with No Native Code
Introduction
This post is a continuation and improvement of the techniques discussed in a previous post. In that article, I described a technique that combined Expo’s ease of development, Webpack’s packaging capability, Gulp’s task automation, and React Native’s WebView component in order to covert an UI oriented JavaScript library into React…
Combining Tooling with Automation to Build Something that Contributes to the Community
If you’ve read my previous posts, you’ve probably gathered that I’m working on some sort of side project. Hopefully, I will get to the point that I’m ready to release my creation, but for now I’ve been content to adjust and tweak as needed. …
Combining Tooling with Automation to Build Something that Contributes to the Community
If you’ve read my previous posts, you’ve probably gathered that I’m working on some sort of side-project. Hopefully, I will get to the point that I’m ready to release my creation, but for now I’ve been content to adjust and tweak as needed. …
Breaking up Project Functionality into Separate NPM Packages
May 2018 Update
Now that I have learned more about using React Native and creating friendlier NPM packages, I’ve made some significant updates to the package detailed in this article.
The package is now called react-audio-player-recorder-no-linking. I chose this new name to emphasize that it includes separate Recorder and Player components vice just…
A Quill.js Component for React-Native Applications with no Native Code
Introduction
In the process of finding a text editor capable of creating richly styled text for one of my projects, I stumbled upon Quill.js, “… a modern rich text editor built for compatibility and extensibility”. Based on this statement, it seemed…
Building the Payment Client Using React Native and React
Background
This is the fourth and final article in a series of posts about integrating Braintree payments into a JavaScript only (no native code) React Native mobile application. The GitHub repository for this project is located here.
Additionally, this project is available as the react-native-webview-braintree npm package for you to…
Building the Payment Client Using React Native and JavaScript
Background
This article is part 3 of a series on integrating Braintree payments into a JavaScript only (no native code) React Native mobile application. The GitHub repository for this project is located here.
This article will cover building the first version of the client using React Native, JavaScript, and the version…
Reginald Johnson
Freelance software developer and 21 year military vet. I build for the web, mobile, and server with React, React Native, and AWS & node. https://www.reggie3.com
