Setting up the Folder Structure

Let's initialize a React Native project using React Native's CLI. The project will be named messagingApp and will be available for iOS and Android devices:

react-native init --version="0.45.1" messagingApp

We will be using MobX to manage state in our app, so we will need a folder for our stores. The rest of the folder structure is standard to most React apps.

We need five screens (Chats, Chat, Login, Profile, and Search), a component (ListItem) and two stores (chats and users), which will be available through the stores/index.js file. There are also two helpers that we will be using to support our app:

• notifications.js: All the logic related to push notifications will be stored in this file

• firebase.js: This includes the configuration and initialization of Firebase SDK

Since we will be using MobX and several other dependencies, let's take a look at our package.json file to understand what packages we will be using:

/*** package.json ***/

{
        “name": “messagingApp...