Screens

A Screen is a conceptual grouping for React Native Components used in navigation. Technically a screen is a component but in order to standardize how we work with react we want you to think of screen as its own thing. Screens are not to be imported by other Screens, Components or Layouts.

A Screen needs to be added to the Navigator before it can be used within a mobile application.

Usage

frontier mobile add screen <screen-name>

Example

frontier mobile add screen login

Technical

Each generated Screen is contained within it's own sub-folder within the app directory. The directory contains the following files which each carry out a specific role in developing a Screen:

• [screen].tsx: This is similar to a Component but this is generally where we make API calls to fetch data to populate the views and import other components. Screens are also used within navigation.
• [screen].styles.tsx: All Stylesheet files are the same as the stylesheet shown in Component.