Month: March 2019

React Native Error Fix: Error: Unable to resolve module `./index` from `\node_modules\react-native\scripts/.`

Last Updated on March 29, 2019. I just created a new React Native project with the latest React Native version 0.59. Unfortunately, I stuck on a new react native error when I try to run the project using the command react-native run-android. Here’s the React native error fix for Error: Unable to resolve module ./index …

React Native Error Fix: Error: Unable to resolve module `./index` from `\node_modules\react-native\scripts/.` Read More »

How to Change App icons and Notification Icons in React Native (Android)

Want to change the default app icon and notification icon of your React Native app in Android? Then you are at the right place. It would have been a tough task if there’s no Android Asset Studio. Android Asset studio helps to create launcher icons as well as notification icons in proper formats. For app …

How to Change App icons and Notification Icons in React Native (Android) Read More »

How to Add Pull Down to Refresh Feature in React Native

Pull down to refresh is a cool feature we usually see in Android apps. It helps users to refresh a list or collection of data. In react native, you can use RefreshControl component to implement pull down to refresh feature. RefreshControl works as a prop for components such as ScrollView, ListView and Flatlist. See the …

How to Add Pull Down to Refresh Feature in React Native Read More »

How to Add Bottom Tab Navigator in React Native

If there were no libraries such as react-navigation, navigation in react native would have been an uphill task. In this blog post, you can learn how to create a bottom tab navigator in your react native project. First of all, add react-navigation in your project with command npm install –save react-navigation . After that add …

How to Add Bottom Tab Navigator in React Native Read More »

How to Add Shadows for Text Component in React Native

Last Updated on December 12, 2020. Text component in React Native appears to be simple but it has a lot of props for customization and usability. Sometimes, we want to make Text component more stylish by having shadows with vibrant colors. In such cases, you don’t need to rely on any third party component libraries- …

How to Add Shadows for Text Component in React Native Read More »

How to add Custom Font in React Native (Android)

React Native supports only few fonts out of the box for Android platform. Hence, you may always want to add custom fonts in your React Native project to make the app more stylish. Adding custom fonts in React Native for Android platform is very simple. Just navigate to YourProject>android>app>src>main and create a folder named assets. …

How to add Custom Font in React Native (Android) Read More »

How to Make Flatlist Rerender without changing the Data

Last Updated on March 19, 2019. Flatlist is one of the most used components in React Native. It is super easy to implement and performs better than components like Listview. Flatlist is fully cross platform and it has cool features such as header, footer, scroll to index, pull to refresh etc. Sometimes, you might need …

How to Make Flatlist Rerender without changing the Data Read More »

10 React Native Libraries you can use in your Next Project

Last Updated on March 17, 2019. Even though React Native has a lot of components and apis itself, sometimes we feel some items missing especially when we want to increase the pace of development. Fortunately, React Native has a wonderful community behind to develop third party libraries to reduce the ‘missing’ components gap. In this …

10 React Native Libraries you can use in your Next Project Read More »

How to Change the Placeholder Text Color of TextInput Component in React Native

Last Updated on March 17, 2019. We use TextInput component in almost all React Native applications. Because of that, we usually try to customize or stylize textinput at maximum extent. In this blog post, I will tell you how to change the color of the hint text in TextInput. All you need is to use …

How to Change the Placeholder Text Color of TextInput Component in React Native Read More »

How to Create Gradient Background Color in React Native

We expect react native to support Gradient color upright but unfortunately, it is not. You have to make some native changes for this- that’s why I use react native linear gradient library. The react native gradient library is pretty straight forward as you can setup it using the following commands: npm install react-native-linear-gradient –save react-native …

How to Create Gradient Background Color in React Native Read More »

How to Disable TouchableOpacity Component in React Native

TouchableOpacity is one of the most using components in React Native projects. Reason is simple, TouchableOpacity is much more flexible and highly customisable than components such as Button. As I mentioned in the title, you can either disable or enable TouchableOpacity according to your requirement. All you need to use is disabled prop of Touchable …

How to Disable TouchableOpacity Component in React Native Read More »