Sign in Subscribe

reactnative

Just published my first React Native package to NPM

Just published my first React Native package to NPM

For a few weeks now I'm working on a small React Native app. After trying to find a package that will work for me and failed, I decided to create a custom component. If you have an iOS device, you most certainly know the Segmented Control view (UISegmentedControl): Publishing this

The useState() Hook: Practical Guide

The useState() Hook: Practical Guide

Do you know what is the difference between a class component and a function component in React? In this practical guide I will try to explain how the component's state is managed in both components after the second got on steroids! Stateful and Stateless components In the previous example, we

Dynamic switching of themes in React Native App: The funky way with hooks! 👌

Dynamic switching of themes in React Native App: The funky way with hooks! 👌

In February I posted an article with example of how to switch React Native Paper themes dynamically via the recently introduced Context API. Today, I will try to rewrite the example with the latest big thing in React world - React Hooks! I'm so excited about this addition since writing

React Hooks: Gentle Introduction! 🚀

React Hooks: Gentle Introduction! 🚀

In this article I'll try to explain in a simple way what are the React Hooks and why it's good to use them when developing your React/React Native apps. Since React 16.8.0, there is a new way of calling async code in a really elegant way as

🖊️ Let's add custom fonts to a React Native App!

🖊️ Let's add custom fonts to a React Native App!

It's fairy simple... :) STEP 1: Create a new file in your RN project's root dir with name react-native.config.js and content: module.exports = { project: { ios: {}, android: {}, }, assets: ['./assets/fonts'] }; STEP 2: Now, if you're exporting for Android, go to: $PROJECT_ROOT/android/app/src/main/assets/fonts and

Unrecognized font family 'FontAwesome'

Unrecognized font family 'FontAwesome'

Just encontered this issue after installing the react-native-vector-icons package and run the app on an iOS simulator. If you're wondering what is happening even though that the library is correctly linked with the iOS project, here is the solution: Check the info.plist In my case the problem was that

How to add a StatusBar in your React Native application

How to add a StatusBar in your React Native application

I'm sure that at some point you stumbled upon the problem with the status bar. By default the React Native draws the container view from the top left corner of the screen without taking in case the status bar. To resolve this issue, we give the container view top margin