Halo sobat KonsepKoding pada tutorial kali ini kita akan belajar cara nya setting atau config untuk Reactotron di React Native dengan Expo, kita tahu sendiri di Offiicial website React Native, sekarang mereka menganjurkan untuk menggunakan Expo ketimbang CLI dan untuk debugger expo memiliki kekuranga ketika menggunakan debugger bawaan seperti tidak bisa copy as CURL dan sering lost connection maka dari itu di tutorial ini saya akn setup Expo React Native dengan Reactotron untuk debugger.

Tutorial Setup Reactotron di Expo React Native


1. Pertama install Reactotron sebagai  dependency dev

yarn -D reactotron-react-native   or  npm install reactotron-react-native --save-dev


2. Kemudian buat file ReactotronConfig.js di root project kemudian isi dengan kode ini

import Reactotron from "reactotron-react-native"

Reactotron

  .configure() // controls connection & communication settings

  .useReactNative() // add all built-in react native plugins

  .connect() // let's connect!


3. Lalu kemudian di Stack root tambahkan ini untuk expo rootnya biasanya ada  di import {Stack} from 'expo-router'; atau di App.ts atau App.tsx

if (__DEV__) {

  // @ts-ignore

  import("../../ReactotronConfig")

}

 4. Lalu install Reactotron Desktop di https://github.com/infinitered/reactotron/releases?q=reactotron-app&expanded=true sesuaikan dengan operating sistem mu


5. Jalankan expo app mu kemudian press R dan reactotron sudah connect mungkin kamu bisa menggunakan console.log("test reactotron")
Maka hasilnya akan seperti ini :



Tutorial Setup Reactotron di Expo React Native

Sekian semoga artikel ini dapat bermanfaat dan membantu kamu yang sedang mempelajari React Native

Baca Tutorial React Native KonsepKoding Lainnya :
#32 Tutorial Kalkulasi Latitude Longitude Dua Jarak React Native
#33 Tutorial React Native Handle OnSwipe Pada iOS
#34 Tutorial View Aspect Ratio Square React Native