GIỚI THIỆU REACT NATIVE

GIỚI THIỆU REACT NATIVE

Authour: Phuc Vu

Giới thiệu

Picture1

React Nativelà một framework được tạo bởi Facebook, cho phép các lập trình viên sử dụng JavaScript để làm mobile apps trên cả Android và iOS với có trải nghiệm và hiệu năng như native. React Native vượt trội ở chỗ chỉ cần viết một lần là có thể build ứng dụng cho cả iOS lẫn Android.

React native cho phép xây dựng các ứng dụng trên android vs ios chỉ với một ngôn ngữ thống nhất là javascript nhưng mang lại trải nghiệm native app thực sự. Không như các framework hybrid khác(viết một lần triển khai nhiều nơi), React native tập trung vào việc một lập trình viên làm việc hiệu quả trên môi trường đa nền tảng như thế nào

Cách hoạt động

Các nguyên tắc hoạt động của React Native giống với React, nhưng thay vì nhắm mục tiêu vào trình duyệt, chúng lại nhắm mục tiêu vào các ứng dụng di động.

Vì vậy, bây giờ bạn đã có một số kiến thức cơ bản về cơ bản của React, điều này khá đơn giản: React Native cũng thao tác một số loại DOM, so sánh nó và thay đổi nó. Nó đang thay đổi UI ứng dụng di động, phải không?

Nhưng chờ đã … trong một ứng dụng di động không có dấu vết của HTML DOM. Và chúng ta cần tạo một ứng dụng di động, không phải trang web. Vì vậy, chúng tôi không thể mở trình duyệt trong ứng dụng thiết bị di động.

Có nghĩa là, React Native không thao tác DOM thông qua DOM ảo, thay vào đó, nó chạy một quy trình nền – một luồng JavaScript – để giao tiếp với nền tảng bản địa(iOS, Android) thông qua một cây cầu nối tiếp, không đồng bộ và theo đợt.

React Native không sử dụng HTML, nhưng để hiển thị các UI của từng nền tảng gốc thông qua việc gửi các messages, các liên kết cầu nối giữa phần JavaScript và code gốc iOS (C / Swift) or Android (Java).

Ứng dụng React Native cuối cùng là một ứng dụng di động gần như nguyên gốc. Giữa mã Javascript và mà IOS và Android gốc có cầu nối.

Để dễ hiểu , hãy xem hình ảnh sau:

Picture2

Trong ví dụ trên, đang tạo ra một màn hình bắt đầu trong ứng dụng di động React Native của mình. Nó cần hiển thị 2 yếu tố trên trang: logo React và nút Đăng nhập.

Đối với điều này, chúng ta viết code trong React Native bằng cách sử dụng JSX và cấu trúc mã React tương tự, nhưng thay vì sử dụng các phần tử div và HTML, chúng ta đang sử dụng các phần tử React Native View. Khi code được biên dịch, nó sẽ tạo ra một luồng JavaScript tạo ra một “cầu nối” giữa phương thức render React Native và code gốc iOS / Android thực.Sử dụng cây cầu này, React Native có thể yêu cầu code gốc cung cấp các phần tử riêng mà nó cần.

Trong trường hợp này, React Native đang gọi API render gốc để nhận các thành phần Hình ảnh và Nút và sau đó nó chỉ hiển thị chúng trong ứng dụng. Các thành phần cuối cùng được hiển thị là các thành phần UI gốc 100%. Không cần thiết phải tạo webview và hiển thị HTML trong đó.

Bên cạnh việc cung cấp quyền truy cập vào API gốc để render UI, React Native cũng hiển thị giao diện JavaScript cho các API của nền tảng gốc, do đó bạn có thể truy cập các tính năng dành riêng cho nền tảng như camera điện thoại, vị trí, v.v

Công dụng

Do bạn không cần quá nhiều kiến ​​thức về C / Swift hoặc Java để phát triển ứng dụng di động cho cả hai nền tảng di động vì vậy Việc này giúp chúng ta có thể tiết kiệm được thời gian, công sức, tiền bạc. Giúp tốc độ ra sản phẩm cũng như cập nhật ứng dụng nhanh chóng mặt. Có thể nói React Native là một cross-platform để xây dựng một ứng dụng di động hiệu quả.

Picture3

React Native giúp cho lập trình viên web có thể viết ứng dụng native để khắc phục các điểm yếu của ứng dụng web và hybrid. Chỉ với một lập trình viên thành thạo javascript, bạn có thể chiến đấu trên mọi “mặt trận” web, desktop, server và bây giờ là mobile. Điều này không những có lợi cho lập trình viên mà nó còn giúp cho các doanh nghiệp phát triển sản phẩm đầu cuối với ít nhân lực hơn.

Hướng phát triển trong tương lai

React Native hiển thị các ứng dụng native cho cả iOS và Android. React chịu trách nhiệm về view controller và tạo ra các chế độ xem native bằng cách sử dụng Javascript. Facebook, Instagram, và Airbnb đều dùng React Native để cho ra những version mobile app mới nhất của họ. Ngoài ra còn có một listdài bao gồm các app nổi tiếng cũng sử dụng React Native. húng cho ta thấy rằng là, các lập trình viên web cảm thấy thoải mái khi viết các ứng dụng cho thiết bị di động có giao diện tự nhiên, tất cả đều nhờ và thư viện Javascript.

Vì vậy với tất cả công dụng của nó cho ta thấy rằng với phương châm “Học một lần sử dụng mọi nơi”, Javascript sẽ là mảnh đất màu mỡ chờ bạn khai phá với những công nghệ thời thượng, đó là một thực tế đã và đang đúng. Vì những công dụng ở trên thì React Native sẽ là những gì lý tưởng nhất cho lập trình viên fullstack trong tương lai.