{ React Native } How Does React Native Work

How Does React Native Work

Cross-Platform with React Native

• React JS works with Browser DOM.
• React Native does NOT work with Browser DOM, is a translater (interface) with IOS and Android.
• E.g. React Native will send a message to IOS or Android like saying “Please make a button”.

Just receiving and sending messages between JS and Native (OS).

1. We are waiting for an event. Let’s say it is where user will press a button on the screen.
2. This event will be recorded by Native side (Android and IOS); Detect all information about the event.
3. Bridge will send a JSON message.
4. JS receives that message.
5. Process the event, send it back to the native OS.
6. Serialized batched response (일괄 처리된 응답) 이 전달.
7. Process commands (e.g.배경색을 빨간색으로 해라).
8. Update UI.

Creating the app with expo

• What is expo?

  • Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React.

• Commands on Windows terminal

  • expo init firstReactApp
  • cd firstReactApp
  • npm start

• 윈도우에서 expo init 할때, CategoryInfo Security 오류 날 시,

1. Run as administrator
2. Set-ExecutionPolicy -ExecutionPolicy Unrestricted => A (YES ALL)
3. expo init fileName

Rapidly changing environment

• Components are built-in components for you to use in your app.
• You can use JavaScript to access your platform’s API and we have use behaviors of UI using react components.
• Many Components and APIs have disappeared as it was hard to maintain all components and APIs.
• So, we have to rely on the community to create and maintain other Components.
• We must find and use 3rd party component; e.g. There are Statusbar made from React Native Team or from Expo Team.

Rules

1. We cannot use <div>, we must use .
2. Normally, people separate StyleSheet and code.