---
# System prepended metadata

title: React Native

---

# React Native

For Mobile Engineering, we follow all the norms mentioned in React on top of it there as some more practices specific to our case which are mentioned below.


* UI Components should be developed keeping in mind to make it as generic as possible to enable code reusablity. All components built for generic purpose should have a wrapper over it, so that in future it's easy to replace the implementation or add error checks depending upon necessity. For Example check component `<ImageWrapper />` in Common repository.

* Proper labelling of imports being made to any class or function.

    ![](https://i.imgur.com/RPqgDq7.png)

    

* If you are building a component which requires an icon or some kind of image predefined from design. Try to use these icons in SVG's and images in PNG's as much as possible.

* Every feature which is being built in Mobile needs to be tested on both platforms iOS & Android for both mobile & tablet devices.

* Every feature that reqiuires a change in Common submodule, needs to be tested in all the three apps.

* While creating any new feature or complete UI flows. Try to use flexbox as much as possible, follow all the guideleines provided by the design team but make sure the UI looks as per design on devices with different screen resolutions too.

* Mobile design team uses a set of predefined color pallete & fontStyle to provide UI designs for development and we have utility functions to pick these color & fontStyles. Make sure you use these when styling the components.

   ```
   import { colors } from "js/UIElements/colors";
   import { fontStyle } from "js/static";
   ```

* All the components or screens which are to be implemented in more than one app (Student / Teacher / Family) should be placed in Common repository with suitable changes in component to adapt depending on which app is using it.

* Also only such components or functions should be kept in Common which are not specific to just one app and is relevant to be used at multiple places in different apps.

* To get the feature or bug fix tested. Provide a Development or QA build, if the change is on native side of iOS or Android. Or, Codepush the change on Development / QA build, if the changes are only limited to javascript.


Also have proper understanding of basics of React Native [Components](https://reactnative.dev/docs/components-and-apis) and [API's](https://reactnative.dev/docs/accessibilityinfo).
