ReactNative Best Practices & Libs 2020

Best Practices

Platform-specific styles

https://reactnative.dev/docs/platform-specific-code#platform-module

Platform-specific modules

For example, say you have the following files in your project:

BigButton.ios.js
BigButton.android.js
import BigButton from './BigButton';

Use React-Redux and for more hard cases React-Saga

Use Class Component For Stateless and Stateful Components

Functional components is not faster.

Using PureComponent for the boost

https://reactjs.org/docs/react-api.html#reactpurecomponent

Lock Dependencies, Prevent The Breaking Changes

Always use fixed dependencies:

"react-native-img-cache": "1.5.3",
"react-native-fetch-blob": "0.10.7",
"react-native-linear-gradient": "2.3.0"
"react-native-img-cache": "^1.5.3",
"react-native-fetch-blob": "^0.10.7",
"react-native-linear-gradient": "^2.3.0"

Make importing better

Many of you saw things like that:

import TextComponent from "../../../ComponentFolder/TextComponent"
{
"name":"@components"
}
import TextComponent from "@components/TextComponent"

Optimization

Components reuse in the Company

Courses

Libs

Redux VS Remx

Remx is simpler with code reuse, Redux uses more boilerplate code and linked to many libraries.

Navigation

There are two best ways:

UI libs

Libs

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Andrey Nikishaev

Andrey Nikishaev

Machine Learning and Computer Vision Researcher. Founder LearnML.Today