Applications development concepts in React

React is a framework that gives the developer a set of components such as containers, texts, images or lists with a graphical interface which, if nested together, constitute the different facades of an application.The working principles of React Native are virtually identical to React except that React Native does not manipulate the DOM via the Virtual DOM. It runs in a background process (which interprets the JavaScript written by the developers) directly on the end-device and communicates with the native platform via serialized data over an asynchronous and batched bridge.

Some advantages

We identify:

The specificity of the components: In Android development, you write views in Kotlin or Java; in iOS development, you use Swift or Objective-C. With React Native, you can invoke these views with JavaScript using React components. At runtime, React Native creates the corresponding Android and iOS views for those components. Because React Native components are backed by the same views as Android and iOS, React Native apps look, feel, and perform like any other apps.

Fast refresh mechanism to immediately see the changes made by the developer. See your changes as soon as you save

Optimized Code Generation: using the Metro Bundler, React Native speeds up the development process by generating optimized code.

Improved Batching and Caching Behaviours: React Native helps to improve the performance of an app by improving the way batching and caching behaviour is done.

Dynamic Delivery System

When the challenge gets harder

If we need to develop applications with a dynamic import or with different independent services such as real-time chat, payment systems or access to the calendar, re-pack comes to our support. Re.pack is toolkit using Webpack 5 which allows the creation of advanced structure applications such as dynamic import, micro frontend and superapp.

Re.pack

React Native environment and Browser environment have differences. React Native needs to run additional JS setup/init code so that it's usable at all. There's a great discrepancy between available APIs. In React Native we also have platform-specific files — e.g.: .ios.js, .android.js and so on. Putting all the above together makes Webpack unable to produce bundle at all due to build errors and then the bundle produced by Webpack is unusable by default. Therefore, we need to make changes to Webpack configuration and change how and what Webpack puts into the final bundle. All these necessary changes are encapsulated inside Re.Pack in form of Webpack plugins.

Link to documentation of Re.pack