~/VibeHandbook
PDF Gratis

Aplikasi / Mobile

reactnative.dev

React Native

Apa itu ini

React Native adalah kerangka kerja () sumber terbuka, dibuat di Meta, untuk membangun aplikasi mobile native menggunakan React dan JavaScript (atau TypeScript). Anda menulis komponen dengan cara yang sama seperti untuk web, tetapi komponen tersebut dirender menjadi widget UI (User Interface — bagian tampilan aplikasi yang terlihat di layar) native iOS dan Android yang sesungguhnya, bukan ke tampilan web (web view). Sebagian besar kode dibagikan di kedua platform, sementara Anda tetap bisa turun ke kode native khusus platform saat memang dibutuhkan.

Kelebihan

  • Satu basis kode, dua platform — berbagi sebagian besar logika dan UI antara iOS dan Android.
  • Menggunakan React, sehingga developer web bisa langsung produktif dan ekosistemnya sangat besar.
  • Merender komponen native sungguhan, bukan tampilan web, sehingga terasa benar-benar native.
  • Fast Refresh memberikan umpan balik hampir instan saat mengedit.
  • Ada jalur keluar (escape hatch): tulis modul native dalam Swift/Kotlin ketika Anda menemui batasan.

Kompromi (trade-off)

  • Bayangkan seorang penerjemah yang menyampaikan pesan antara dua orang yang berbicara bahasa berbeda: selalu ada sedikit jeda di setiap serah terima. React Native memiliki "jembatan" serupa antara JavaScript dan kode native, dan ini bisa mempersulit pekerjaan yang sangat bergantung pada performa atau animasi berat.
  • Dependensi native dan alat build (build tooling) bisa rapuh dan sensitif terhadap versi.
  • Anda tetap memerlukan pengetahuan platform (dan komputer Mac untuk build iOS) untuk bagian-bagian yang sulit.
  • Beberapa fitur OS (Operating System — perangkat lunak inti perangkat, seperti iOS atau Android) yang lebih baru baru bisa dipakai belakangan, sampai komunitas atau Anda sendiri membungkusnya (wrap).

Kapan menggunakannya

Gunakan React Native ketika Anda ingin satu tim dan satu basis kode mengirimkan aplikasi native di iOS dan Android sekaligus, terutama jika tim Anda sudah menguasai React. Ini cocok untuk aplikasi berbasis konten, e-commerce, dan aplikasi bertipe CRUD (Create, Read, Update, Delete).

Kecocokan dengan vibe coding

React Native ramah untuk coding berbantuan AI karena pada dasarnya ini hanyalah React — asisten AI sangat fasih dengan komponen, hooks, dan props. Minta model untuk menggunakan TypeScript, menjaga komponen tetap kecil dan tanpa status (stateless) sebisa mungkin, dan memadukannya dengan Expo untuk proses build serta modul native yang mudah. Sebutkan target platform dan kemampuan native yang dibutuhkan di awal, supaya kode yang dihasilkan menggunakan pustaka (library) yang tepat.

import { Text, Button, View } from "react-native";
import { useState } from "react";

export default function Counter() {
  const [count, setCount] = useState(0);
  return (
    <View>
      <Text>Count: {count}</Text>
      <Button title="Add" onPress={() => setCount(count + 1)} />
    </View>
  );
}