https://github.com/abdallahabusedo/learn-react-native

https://github.com/abdallahabusedo/learn-react-native

Last synced: 14 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/abdallahabusedo/learn-react-native
• Owner: abdallahabusedo
• Created: 2020-07-25T09:49:30.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2022-12-06T23:06:20.000Z (almost 2 years ago)
• Last Synced: 2024-10-11T06:06:44.501Z (27 days ago)
• Language: JavaScript
• Size: 1.44 MB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 12
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


# Learn React Native

- react native is built on top of react but instead of targeting the browser it target mobile platforms.

## What is react Native

a framework for building native apps using javascript.

## What is EXPO

EXPO is a set of tools and a framework that sits on top react native and hides a lot of complexity from us.

## How to set Up the development environment

1. open VS code.

2. Installing Expo CLI globally, you can do this by running the following command:

   `npm install -g expo-cli`.

3. instal EXPO client app in your phone.

4. From the Extensions instal.

   1. react native tool.

   2. React-Native/React/Redux snippets.

5. after installing EXPO write this command in the terminal `expo init My_App`.

to run it `npm start`

## SafeAreaView

`` The purpose of SafeAreaView is to render content within the safe area boundaries of a device.

## Text

`` A React component for displaying text.

## Images

`` we use this tag to put images in our app.

to put a local image we use `require`

``

to put a online image we must use an object and we must write the width and hight to this image

```

```

## StatusBar

`StatusBar` Component to control the app status bar.

example :

```

//in the style sheet

paddingTop : Platform.OS === "android" ? StatusBar.currentHeight : 0,

```