Skip to main content

Getting Started

What follows within the Fundamentals section of this documentation is a tour of the most important aspects of React Native Header. It should cover enough for you to know how to begin building.

Compatibility​

Before using this package, please make sure that you install the correct version of this library for your project. Here is the dependency matrix:


react-native-headerreact-nativereact-native-reanimatedreact-native-safe-area-context@shopify/flash-list
0.6.x>= 0.65>= 2.11.0>= 4.1.0N/A
0.7.x>= 0.65>= 2.0.0>= 4.1.0N/A
0.8.x>= 0.65>= 2.0.0>= 4.1.0N/A
>= 0.9.x>= 0.65>= 2.0.0>= 4.1.0>= 3.2.0

Pre-requisites​

Before you can use react-native-header, you need to have the following libraries set up in your project:

If you haven't installed these libraries yet, please follow the installation instructions on their respective documentation pages.

If you intend to use the FlashListWithHeaders or MasonryFlashListWithHeaders component, please ensure that you review the Compatibilty table above and install the correct versions of each library.

Installation​

Once you have react-native-reanimated and react-native-safe-area-context set up in your project, you can install react-native-header:

expo install @codeherence/react-native-header

and that's it! You are now ready to use react-native-header in your project.