

Let’s install the libraries: npm install -save react-native-router-flux redux redux-thunk react-redux lodashįunctions will be stored in the actions folder.

and android.js files are the app’s entry points. There you will find native files for each platform, respectively. So far, we have created two folders - iOS and Android - in the project’s root file. Then, create the project: react-native init AwesomeProject Let’s start building our step counter application by installing react-native with npm. These are several basic facts, but you can always find more info about it on the Web. The state may be modified by the addition of event handlers, including display rendering. What do we need to know about Redux? It is a simple library that stores an application’s state. I decided to use react-native-router-flux because it supports Redux off the shelf. To manipulate the app’s data, we will use Flux and Redux.

Project’s Structureįirst off, let’s build our project’s structure. To test the app, we will use an iPhone and an Android smartphone with Lollipop. With Android, several options are available, such as Linux, OS X, Windows. We need OS X with Xcode for iOS development. I will showcase the code and its main features. In the following article, I’d like to share my experience on how to develop a simple step counter application. It is clear how it’s done in the browser - components are transformed into DOM elements - but what about mobile apps? The answer is simple: React components are transformed into native components. According to Facebook, the use of components allows developers to build the interface just once and then display it on all devices and platforms. They are quite similar to browser DOM elements but created with JavaScript, not HTML. Nowadays, basically, every developer knows about React, an open-source JavaScript library from Facebook.Ĭomponents are the main constituent elements of React.
