React Native Fundamentals

Core Components

• 'Core' Components are built into React Native and provide a 'translation' to native UI elements.

  This allows developers to create custom UI components by combining the core components with other built-in components, resulting in a reusable and efficient way to build mobile applications.

• They can be combined with other built-in components to create custom UI components.

  This flexibility enables developers to tailor their application's user interface to meet specific requirements, making it easier to build a cohesive and visually appealing user experience.

Styling React Native Apps

• There is no CSS in React Native.

  This means that developers must use alternative styling methods, such as in-line styles and stylesheet objects, written in JavaScript.

• In-line Styles and Stylesheet Objects are used for styling, written in JavaScript.

  These styling methods provide a high degree of control over the appearance of React Native components, allowing developers to customize the layout, colors, and typography of their application.

• In-line Styles are based on CSS syntax but only support a subset of properties and features.

  This subset of properties and features provides a subset of the functionality available in traditional CSS, making it easier for developers familiar with CSS to adapt to the React Native styling system.

Building Your First React Native App

• The export default function App() defines the main component of the application.

  This component serves as the entry point for the app, providing a clear starting point for building the application's user interface.

• The App component is a functional component and the entry point for the app.

  This functional component is responsible for defining the app's initial state and rendering the UI components, making it a critical part of the React Native application structure.

• The View component is the top-level container that wraps all other components.

  This component serves as the primary container for the app's user interface, providing a flexible and reusable way to organize and layout the application's UI.

• The Text component is a child of the View component and contains the text "Hello World".

  This component is used to display text on the screen, supports nesting, styling, and touch handling, making it a versatile and useful component for building the app's user interface.

• The StatusBar component is also a child of the View component and manages the status bar of the application.

  This component provides a way to customize the appearance and behavior of the app's status bar, allowing developers to tailor the application's UI to meet specific design requirements.

React Native Core Components

• Text component is used to display text on the screen, supporting nesting, styling, and touch handling.

  This component is a fundamental part of the React Native UI, providing a way to display text-based content to the user.

• Image component is used to display different types of images, including network images, static resources, temporary local images, and images from local disk.

  This component enables developers to incorporate images into their application's UI, making it a powerful tool for building visually appealing and engaging user interfaces.

• TextInput component is used for inputting text into the app via a keyboard, with props for configurability.

  This component provides a way to input text into the app, allowing users to interact with the application and providing a flexible way to customize the input experience.

• Button component represents a clickable button element in the app's user interface, allowing users to trigger an action or perform a specific task when pressed.

  This component is a fundamental part