React Native Indonesia Hello World – 2#

hello world react native

React Native Indonesia

Setelah melakukan beberapa installasi  pada tahap pertama dan akhirnya bisa menjalankan react native pada komputer Anda, mari masuk ke materi React native yang ke dua, untuk kali ini kita akan melakukan hal yang sederhana terlebih dahulu, bagaimana caranya mencetak, sebuah tulisan hello world. Setelah membuat project dengan menulis "react-native init 'namaproject' " nama project dapat di ganti dengan nama project anda, misalkan: "react-native init belajar" artinya anda membuat project folder react-native dengan nama belajar. Selesai membuat project silahkan masuk ke folder project tersebut menggunakan text editor kesayangan Anda. Anda akan menemukan file bernama app.js react native app.js indonesia Hapus semua isi di dalam app.js, dan coba kembali ke terminal dan run simulator anda "react-native run-ios" atau "react-native run-android" anda akan menemukan simulator anda kosong dan tidak ada lagi materi atau tulisan "welcome to React" seperti pertama kali Pertama - tama yang harus anda lakukan adalah melakukan: import React from 'react';  Import react artinya kurang lebih memanggil unsur react dari library dan di masukan pada aplikasi kita, karena kita membutuhkannya, setelah itu import { View, Text } from 'react-native' Karena nantinya kita membutuhkan Tag Text untuk mencetak tulisan dan View untuk membungkus tulisan tersebut kita harus memanggil dua unsur tersebut pula dari library. buat const bernama app dengan syntax sebagai berikut: react native indonesia Dalam react-native setiap ingin menampilkan atau menulis suatu component anda harus membungkusnya dengan component view, component view di sini seperti sebuah wadah, jadi bila anda mempunyai component text, component image, dan tidak berada dalam sebuah wadah hasil dari component anda tidak bisa akan jatuh analogi nya, karena tidak berwadah atau error, maka untuk itu anda harus menyiapkan wadah nya dahulu untuk component anda dengan component bernama View, SafeAreaView juga wadah yang automatis akan membawa konten anda di bawah notch atau status bar pada hp-hp zaman sekarang Click di sini untuk melihat dokumentasi component react native Tearkhir jangan lupa untuk melakukan export pada const tersebut yang isi nya ingin kita tampilkan menggunakan 'export default' save dan coba kembali jalankan pada simulator anda. tada berhasil~ Materi 2 React Native Indonesia sudah selesai.

Leave a Reply

Your email address will not be published. Required fields are marked *