Введение в React Native

Опубликовано: 14 Июля, 2021

Если вы хотите создавать мобильные приложения как для Android, так и для iOS. Чему нужно учиться? Индивидуальные родные языки для каждого приложения, например, Java для Android и Swift / Objective-C для iOS? На самом деле НЕТ. Собственная разработка для Android и iOS совершенно различается и может быть дорогостоящей - во-первых, сам язык совсем другой, а во-вторых, все базовые API разные - другой способ использования GPS, другой способ создания анимации, другой способ совершения сетевых звонков отличается.

Мы всегда стремимся к более коротким циклам разработки, более быстрому развертыванию и повышению производительности приложений. И существует множество гибридных мобильных фреймворков, таких как NativeScript, React Native, Ionic, Xamarin, PhoneGap и т. Д.

React Native: это платформа, разработанная Facebook для создания приложений в собственном стиле для iOS и Android на одном общем языке, JavaScript. Изначально Facebook разработал React Native только для поддержки iOS. Однако благодаря недавней поддержке операционной системы Android библиотека теперь может отображать мобильные пользовательские интерфейсы для обеих платформ.

Предпосылка:

Базовые знания HTML, CSS и JS.
Базовые знания ReactJS.
В вашей системе должен быть установлен NodeJs.

Сборка с помощью React Native чрезвычайно эффективна и вызывает привыкание, но начать работу может быть немного сложно. React Native использует Node.js, среду выполнения JavaScript, для создания вашего кода JavaScript. Если у вас еще нет установленного Node.js, пора его установить!

Установка: здесь мы будем использовать версию Expo CLI, которая будет намного более плавной для запуска ваших приложений React Native. Выполните следующие шаги один за другим, чтобы настроить собственную среду React.

Шаг 1: Откройте свой терминал и выполните следующую команду.
```
 npm install -g expo-cli
```
Шаг 2: Теперь expo-cli установлен глобально, поэтому вы можете создать папку проекта, выполнив следующую команду.
```
 expo init "имя проекта"
```
Шаг 3: Теперь перейдите в созданную папку и запустите сервер, используя следующую команду.
```
 cd "projectName"
npm начать веб
```

Структура проекта:

Пример:

App.js

 import React from 'react' ;
 import { Text, View, StyleSheet } from 'react-native' ;
 import Constants from 'expo-constants' ;
 
const Home=()=>{
  return (
      <Text style={{
                    marginTop:300,
                    marginLeft:10}}>
          Geeksforgeeks
      </Text>
  )
 }
 
 
export function default App() {
  return (
    <View>
          <Home/>
    </View>
  );
 }

Выход:

Преимущества по сравнению с другими фреймворками и языками: всякий раз, когда появляется обновление для приложений, написанных на Swift / Objective-C или Java, все приложение необходимо перекомпилировать, а новую версию необходимо снова распространить в App Store. Все это может занять несколько недель в зависимости от процесса проверки в App Store.

Чтобы избежать этой проблемы, приложения React Native работают по-другому: собственное приложение может находить определенный код JavaScript, который позже загружается и компилируется при запуске приложения на реальном устройстве. Таким образом, обновление приложения может быть выполнено мгновенно, без необходимости снова и снова отправлять новую версию в App Store.

Знать, как работает React Native? вы можете посетить эту статью.

JavaScript JavaScript-Misc

Введение в React Native

App.js

РЕКОМЕНДУЕМЫЕ СТАТЬИ