React Native

How to fix Error: While trying to resolve module @apollo/client React Native

Error: While trying to resolve module @apollo/client

React Native

Best React Native UI Libraries in 2022

React Native allows you to create user interfaces with built-in declarative components like Picker, Button, Slider, Switch, etc. But with core components, we need to write our UI  components according to design. But no need to reinvent the wheel most of the time, we can use components libraries in our

React Native

How to center content when using ScrollView with KeyboardAvoidingView

One of the pain points of React Native is  TextInputs when the keyboard pops up. There are a lot of improvements over the years. Android and iOS work differently. Recently I had a problem with ScrollView inside KeyboardAvoidingView. I need to center content inside ScrollView. As you can see TextInput

React Native

How to hide Tab Bar from the screen in React Navigation 6

In this tutorial, we’ll show how to hide Tab bar from the screen in React Navigation 6. If you are using the default Tab provided by React Navigation hiding the tab bar is so easy. we can use setOptions a method like this way const hideTabBar = () => { navigation.setOptions(

React Native

React Native Pulse( Tinder inspired) Animation with Reanimated 2

Create Pulse animation with Reanimated 2

React Native

React Native Trigger Deep Links

Deep links are very important to improve the user's experience. You can send users specific pages in the app. When you configured deep links in your app. We have to test it like everything else The first option is you can do it this way. https://reactnavigation.org/

Android

Debug your Android App over Wi-Fi

If you are developing apps for Android applications you can use an emulator or device to debug and test your applications. Especially if you have a slow computer, you probably run your app on an Android device to get the best performance. I want to be comfortable as a software

React Native

How to create ribbon in React Native

Create corner ribbons in React Native

React Native

How to find out FlatList scroll direction

FlatList scroll direction with Reanimated 2

React Native

How to create spinner in React Native with Renanimated 2

Creating spinner animation with reanimated. it shows how to use withRepeat and withTiming

React Native

How to find potential unnecessary re-renders in React

If you are a React developer. you should know React does UI updates when the component's state and props change. But some renders could be unnecessary. Let's take one simple example to show unnecessary re-render. if you run the code below, you will notice console log

React Native

What’s new in React Navigation 6

Recently I give a try React Navigation 6 and loved it. React Navigation 5 also was great, but it had some problems. They resolved a couple of pain points and performance problems and added great features to it. In this guide, I will give you a peek at what’s

JavaScript

Numeric Separators in JavaScript

In this post, we are going to learn about Numeric Separators in JavaScript and why it is useful.

Kotlin

Kotlin Data Types

Kotlin is a statically typed language which means a type of a variable is known at compile time.

Kotlin

Kotlin Variables

Kotlin has two different ways to declare variables: val (immutable variable) and var (mutable variable). The main between them is mutability.If you are planning to reassign value to variable usevar,  otherwise use val If you try to reassign the constant variable which is val, in the Intellij IDE, you

Kotlin

Kotlin - Hello World

In this article, you will learn to write Hello World program in Kotlin

React Native

How to clean React Native project

React Native evolving fast and everyday developer experiences going better but still have some problems.

Kotlin

Introduction to the Kotlin programming language

The Kotlin programming language was created by JetBrains in 2010 and released the first version in 2011, it's a cross-platform, statically typed, general-purpose programming language with type inference.

Android

Android Development with Kotlin — Linear Layout

In this tutorial, we are going to learn how to create Linear Layout in our applications.

React Native

Absolute imports in React Native

When we have a large React Native project, we are facing to have long relative imports in the project like this: import MyHeader from '../../../../../MyHeader' it can be confusing when you have too many folders and imports. Furthermore code looks messy. Luckily we have the solution for that

Android

Android Development with Kotlin — Structure of Application

Android Project Structure

React Native

Disable React Native console.log in Release Mode

Developers frequently log messages to the Console to make sure their code is working as expected. Of course, it is helpful to make our lives easier. but it can be dangerous in a production application. Main reasons to disable console.log Speed: Console will reduce your application's performance

Android

Android Development with Kotlin — Making Your First App

In this tutorial, We are going to how to learn to create our first Android app. 1- Let's Open Android Studio First, open Android Studio. you will this window. Click "Create New Project". it will redirect you to select a project template page. 2. Select a

Android

Android Development with Kotlin — Installing Android Studio

In this tutorial series, We are going to learn about Android development with Kotlin [https://kotlinlang.org/] language. Before diving into App development, We need to install Android Studio which is an official development environment for Android. Go to the Android Studio website [https://developer.android.com/studio/]and download

React Native

Handling App Clips URL in React Native

In this post, We are going to explain the App Clips invocation URL in React Native. Firstly, I wrote this article when App Clips was introduced. it was just an experimental, then I decided to explore more about App Clips' experiences. If you checked Apple documentation about App Clips.