React Native — Redux

  1. Actions, merupakan payload yang berisi informasi untuk mengirimkan data dari aplikasi ke store. Bagian ini hanya berisi informasi untuk store. Ini berarti apabila terdapat state yang state yang diharuskan berubah, maka akan merubah kebutuhan, kemudian akan dikirim melalui actions
  2. Reducers, Apabila aplikasi dikirim untuk perubahan state, maka tanggung jawab reducers perlu merubah state dan mengembalikan state baru di aplikasi.
  3. Store, membantu reducers store makan dapat terbuat, yang memegang semua state diaplikasi, itu lalu akan direkomendasikan untuk menggunakan singrl store untuk semua aplikasi kemudian memiliki beberapa stores yang akan melanggar penggunaanaan redux yang hanya memiliki single store
  4. Components(UI), ni merupakan UI aplikasi
  5. Middlewares, dapat digunakan untuk bermacam-maccam, memasukan asyncronous API calls. Suara middleware lebih kompleks daripada yang terlihat.

Step 1: Create Basic React native

Step 2: Running app on your devices

Untuk cek adb apakah sudah aktif

Step 3: Add simple counter into the App.js

App.js merupakan file yang mengandung UI yang dibutuhkan untuk merender di aplikasi dengan memungkinka styling.

Step 4: Install the necessary package to connect your app with redux

Untuk yarn

Step 5: Create the necessary folders inside root

Folder yang perlu dibuat untuk kebutuhan implementasi Redux adalah:

  1. actions => counts.js
  2. constants => index.js
  3. reducers => countReducer.js
  4. components => configureStore.js

Step 6: Create Actions and Reducer function

6.1 Didalam folder constants. Buat satu file bernama index.js kemudian isikan kodingans sperti dibawah

  1. state
  2. action

Step 7: Create Redux Store.

Didalam root folder, create one folder called store and inside this folder add one file called configureStore.js add the following code.

Step 8: Pass the Store the React Native app

Inside the root folder, you will find one file called index.js and inside that file add following code.

Step 9: Connect React Native app to Reduc astore

Finally, we connect our App.js component to the Redux store. Untuk itu, kta membutuhkan connect() function from the react-redux libr.

Step 10: Test your app

sc: https://enappd.com/blog/redux-in-react-native-app/92/

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store