Apa yang akan Anda pelajari
- Buat aplikasi asli dunia nyata menggunakan React Native
- Buat komponen yang benar-benar dapat digunakan kembali
- Memahami terminologi dan konsep Redux
- Prototipe dan sebarkan aplikasi Anda sendiri ke Apple dan Google Play Store
- Dapatkan kecepatan dengan prinsip dan metodologi desain
- Temukan pola desain ponsel yang digunakan oleh para insinyur berpengalaman
Persyaratan
- Yang Anda butuhkan hanyalah pemahaman dasar tentang Javascript
Deskripsi
Kursus ini akan membuat Anda bangun dan berjalan dengan React Native dengan cepat, dan mengajarkan Anda pengetahuan inti yang Anda butuhkan untuk memahami dan membangun komponen untuk perangkat seluler.
React Native adalah solusi yang sangat baik untuk mengembangkan aplikasi di ponsel dalam waktu yang sangat singkat untuk membuat aplikasi iOS atau Swift yang setara. Anda akan senang melihat perubahan Anda langsung muncul di perangkat Anda sendiri, daripada menunggu kode Swift / Java untuk dikompilasi ulang! Putaran umpan balik cepat ini, bersama dengan dukungan lintas platform yang sangat baik, adalah apa yang telah melontarkan React Native ke atas keterampilan yang harus dimiliki oleh para insinyur Javascript.
Untuk siapa kursus ini:
- Kursus ini untuk siapa saja yang ingin membuat aplikasi asli dengan React Native
Silabus Kursus :
-
Apa itu React Native?
-
Bagaimana React Native Bekerja
-
Expo vs React Native CLI
-
Unduh Node.js
-
Membuat Aplikasi Asli React Pertama Kami
-
Aplikasi Asli React Adalah Kerja Keras!
-
Penyegaran Persyaratan Kursus
-
Menjalankan Aplikasi di Emulator Android
-
Menjalankan Aplikasi di Simulator iOS
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Bagaimana bekerja dengan React Native Components
-
Menyiapkan Proyek Baru
-
Merencanakan Aplikasi
-
Bekerja dengan Komponen Inti
-
Memulai dengan Gaya
-
Flexbox & Tata Letak (Pengantar)
-
React Native Flexbox Deep Dive
-
Gaya Sebaris & Objek StyleSheet
-
Komponen, Gaya, Tata Letak
-
Bekerja dengan State & Event
-
Mengeluarkan Daftar Item
-
Item Daftar Gaya
-
Membuatnya Dapat Digulir dengan ScrollView!
-
Daftar yang Lebih Baik: FlatList
-
Lebih Banyak Komponen & Daftar
-
Memisahkan Aplikasi Menjadi Komponen
-
Melewati Data Antar Komponen
-
Bekerja dengan Komponen yang Dapat Disentuh
-
Menghapus Item
-
Menambahkan Hamparan Modal
-
Lebih Banyak Gaya Flexbox
-
Menutup Modal & Kliring Input
-
Menyelesaikan Modal Styling
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Apa yang Harus Di-debug & Bagaimana Cara Debug?
-
Menjalankan Aplikasi di Perangkat Nyata & Debugging
-
Menangani Pesan Kesalahan
-
Memahami Alur Kode dengan console.log()
-
Menggunakan Debugger & Breakpoint Jarak Jauh
-
Bekerja dengan Hamparan Perangkat DevTools
-
Men-debug UI & Menggunakan React Native Debugger
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Pengaturan & Perencanaan Aplikasi
-
Menambahkan Komponen Header Kustom
-
Menambahkan Komponen Layar
-
Bekerja di Tata Letak
-
Menata Tampilan sebagai Wadah “Kartu” (dengan Drop Shadows & Sudut Bulat)
-
React Native Styling vs CSS Styling
-
Mengekstrak Komponen Kartu (Komponen Presentasi)
-
Komponen & Gaya
-
Bertema Warna dengan Konstanta
-
Mengonfigurasi & Menata Gaya Input Teks
-
Membersihkan Input Pengguna & Mengontrol Soft Keyboard
-
Menyetel Ulang & Mengonfirmasi Masukan Pengguna
-
Mengkonfigurasi Komponen
-
Menampilkan Peringatan
-
Saatnya Menyelesaikan “Kotak Konfirmasi”
-
Menambahkan Pembuatan Angka Acak
-
Beralih Antara Beberapa “Layar”
-
Menambahkan Fitur Game: Petunjuk & Validasi
-
Memeriksa Kondisi “Menang” dengan useEffect()
-
Menyelesaikan Logika Game
-
Menambahkan Pemuatan Aplikasi
-
Menambahkan Font Kustom
-
Menginstal expo-font
-
“Cascade” Gaya Sintetis: Komponen Pembungkus Kustom & Gaya Global
-
Menambahkan Gambar Lokal
-
Gambar Penataan
-
Bekerja dengan Gambar Jaringan (Web)
-
Melihat Lebih Dekat pada Komponen “Teks” (dan apa yang dapat Anda lakukan dengannya)
-
<View> vs <Text> – Ringkasan
-
Membangun Komponen Tombol Kustom
-
Menambahkan Ikon
-
Menjelajahi Perpustakaan UI
-
Mengelola Tebakan Sebelumnya sebagai Daftar
-
Daftar Item & Daftar Styling
-
ScrollView & Flexbox (Ya, itu berhasil!)
-
Menggunakan FlatList Alih-alih ScrollView
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Menemukan Peluang Peningkatan
-
Bekerja dengan Aturan Penataan Gaya yang Lebih Fleksibel
-
Memperkenalkan Dimensi API
-
Menggunakan Dimensi dalam Pemeriksaan “jika”
-
Menghitung Ukuran Secara Dinamis
-
Masalah dengan Orientasi Perangkat Berbeda
-
Mengontrol Orientasi & Menggunakan KeyboardAvoidingView
-
Mendengarkan Perubahan Orientasi
-
Membuat Tata Letak Berbeda
-
Memperbaiki Layar GameOver
-
Memperbarui Semua Kode untuk Memperbarui Secara Dinamis
-
Dimensi API & UI Responsif
-
API Orientasi Layar Expo
-
Memperkenalkan Platform API
-
Bekerja dengan Platform.select() dan Platform di Cek “jika”
-
Menggunakan File Kode Khusus Platform
-
Platform API
-
Menggunakan SafeAreaView
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Merencanakan Aplikasi
-
Menambahkan Layar
-
Menambahkan Pemuatan Aplikasi
-
Menambahkan Font
-
React Dokumen Navigasi
-
Memasang Navigasi React & Menambahkan Navigasi ke Aplikasi
-
Memasang Navigator yang Berbeda
-
Membuat StackNavigator
-
React Navigasi & Lampiran Kode
-
Menavigasi Antar Layar
-
Sintaks Navigasi Alternatif
-
Dasar-dasar Navigasi
-
Navigasi ke Layar “Rincian Makanan”
-
Mendorong, Meletakkan & Mengganti
-
Mengeluarkan Kotak Kategori
-
Mengonfigurasi Header dengan Opsi Navigasi
-
Melewati & Membaca Params Saat Navigasi
-
Mengatur Opsi Navigasi Dinamis
-
Opsi & Konfigurasi Navigasi Default
-
Parameter & Konfigurasi Navigasi
-
Styling Grid & Beberapa Refactoring
-
Menambahkan Model & Data Makanan
-
Memuat Makanan untuk Kategori
-
Membuat Daftar Makanan
-
Melewati Data ke Layar Detail Makanan
-
Tombol Header: Menggunakan Versi yang Benar
-
Menambahkan Tombol Tajuk
-
Memperbaiki Bayangan
-
Menambahkan Navigasi Berbasis Tab
-
Mengatur Ikon dan Mengkonfigurasi Tab
-
Pilihan navigasi di dalam Navigator
-
Menambahkan MaterialBottomTabs
-
Menambahkan Tumpukan Favorit
-
Menambahkan Tombol Menu & Navigasi Laci
-
Mengkonfigurasi Laci
-
Lebih Banyak Konfigurasi & Gaya Navigasi
-
Menambahkan Komponen DefaultText
-
Menambahkan Konten Layar MealDetail
-
Saatnya untuk Konten Layar “Filter”!
-
Melewati Data Antara Komponen & Opsi Navigasi (Header)
-
[React Refresher] useEffect() & useCallback()
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Apa itu State & Apa itu Redux?
-
Redux & Penyiapan Toko
-
Memilih Irisan State
-
Redux Data & Opsi Navigasi
-
Tindakan Pengiriman & Logika Peredam
-
Mengganti Ikon Favorit
-
Merender Teks Pengganti
-
Menambahkan Logika Penyaringan
-
Mengirim Tindakan Filter
-
Men-debug Redux di React Native Apps
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Merencanakan Aplikasi
-
Membuat Pengaturan Proyek Dasar
-
Layar Ikhtisar Produk
-
Menyiapkan Navigator
-
Menata Produk Produk
-
Menambahkan Komponen yang Dapat Disentuh
-
Bekerja di Layar Detail Produk
-
Menggunakan Font Kustom
-
Menambahkan Item ke Keranjang
-
Menerapkan Tombol Tajuk
-
Mengeluarkan Item Keranjang
-
Menambahkan Logika untuk Menghapus Item
-
Menambahkan Logika Redux untuk Pesanan
-
Laci Samping & Layar Pesanan
-
Membersihkan Keranjang
-
Styling Item Pesanan
-
Membuat Tombol “Tampilkan Detail” Berfungsi
-
Membangun Layar “Produk Pengguna”
-
Menata Ulang Komponen ProductItem
-
Menghapus Item
-
Menambahkan Logika Pengeditan & Navigasi Dasar
-
Menangani Masukan Pengguna
-
Menggunakan Params untuk Mengirim Input Pengguna
-
Mengirim Tindakan untuk Membuat & Memperbarui
-
Saatnya Meningkatkan Aplikasi!
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Mengonfigurasi Input Teks
-
Menambahkan Validasi Dasar
-
Memulai dengan useReducer()
-
Menyelesaikan Formulir Penggabungan & Manajemen Input
-
Memindahkan Logika Input Menjadi Komponen Terpisah
-
Menghubungkan Komponen & Formulir Input
-
Mengubah Gaya & Menangani Soft Keyboard
-
Alternatif & Penutup
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Setup & Cara Mengirim Permintaan
-
Menginstal Redux Thunk
-
Menyimpan Produk di Server
-
Mengambil Produk dari Server
-
Menampilkan Loading Spinner & Penanganan Kesalahan
-
Menyiapkan Pendengar Navigasi
-
Memperbarui & Menghapus Produk
-
Menangani Kesalahan Tambahan
-
Menyimpan Pesanan
-
Menampilkan Indikator Aktivitas
-
Mengambil Pesanan Tersimpan
-
Menambahkan “Tarik untuk Menyegarkan”
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Cara Kerja Otentikasi
-
Menerapkan Layar Masuk Dasar
-
Menambahkan Pendaftaran Pengguna
-
Masuk Pengguna
-
Mengelola Status & Kesalahan Pemuatan
-
Menggunakan Token
-
Memetakan Pesanan ke Pengguna
-
Pemetaan yang Ditingkatkan (Pelingkupan)
-
Menggunakan AsyncStorage
-
Menerapkan “Login Otomatis”
-
Menambahkan Logout
-
Menerapkan “Logout Otomatis”
-
Auto-Logout & Android (Peringatan)
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Merencanakan Aplikasi
-
Pengaturan Navigasi di Kuliah Berikutnya
-
Pengaturan Layar & Navigasi
-
Memulai dengan Formulir
-
Redux & Menambahkan Tempat
-
Mengeluarkan Daftar Tempat
-
Mengakses Kamera Perangkat
-
Mengonfigurasi Akses Kamera
-
Menggunakan Gambar yang Dipilih
-
Menyimpan Gambar di Sistem File
-
Impor SQLite yang diubah
-
Menyelam ke SQLite untuk Penyimpanan Data Permanen
-
Menyimpan Data di Database Lokal
-
Mengambil Data dari Database Lokal
-
Mendapatkan Lokasi Pengguna
-
Menampilkan Pratinjau Peta Lokasi
-
Lebih lanjut tentang Variabel Lingkungan
-
Menampilkan Peta Interaktif
-
Menambahkan Penanda
-
Membuat Lokasi yang Dipilih “Dapat Disimpan”
-
Menyimpan Tempat Pilihan
-
Memperbarui Layar Lokasi Saat Lokasi Berubah
-
Menyimpan Alamat
-
Menampilkan Layar “Rincian”
-
Menyelesaikan Layar “Peta”
-
Menjalankan Aplikasi di iOS
-
Menjalankan Aplikasi di Android
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Alternatif untuk Expo
-
Membangun Aplikasi hanya dengan React Native CLI
-
Muat Ulang Langsung dan Aplikasi RN CLI
-
Penting: Menggunakan React Native Image Picker
-
Menambahkan Modul Asli ke Aplikasi Non-Expo
-
Memahami “Alur Kerja Telanjang” Expo
-
Keluar dari “Alur Kerja Terkelola” Expo
-
Kapan Menggunakan Yang Mana?
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Langkah-langkah Penerapan
-
Mengonfigurasi Aplikasi & Penerbitan
-
Mengkonfigurasi Ikon & Layar Splash
-
Bekerja dengan Kumpulan Aset Offline
-
Menggunakan “Pembaruan Melalui Udara” (Pembaruan OTA)
-
Membangun Aplikasi untuk Penerapan (iOS & Android)
-
Menerbitkan Aplikasi iOS tanpa Expo
-
Menerbitkan Aplikasi Android tanpa Expo
-
Mengonfigurasi Aplikasi Android
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Apa yang berubah?
-
Mempersiapkan Proyek
-
Informasi Lebih Lanjut & Memperbarui Dependensi Proyek
-
Berpindah dari “Seperti Registri” ke Konfigurasi Navigasi “Berbasis Komponen”
-
Langkah Migrasi Pertama
-
Mengonversi Lebih Banyak Stack Navigator ke Konfigurasi Baru
-
Memigrasikan Navigasi Laci
-
Mengganti Navigator & Alur Otentikasi “Beralih”
-
Logout & Perbaikan/Penyesuaian Lebih Lanjut
-
Mengekstrak Param Layar
-
Mengatur Opsi Layar Secara Dinamis
-
Langkah Migrasi & Roundup yang Tersisa
-
Ringkasan Semua Perubahan Penting
-
Sumber & Tautan Berguna
-
Pengenalan Modul
-
Memahami Notifikasi
-
Mengirim Pemberitahuan Lokal
-
Mendapatkan Izin
-
Mengontrol Bagaimana Notifikasi Ditampilkan
-
Bereaksi terhadap Pemberitahuan Latar Depan
-
Bereaksi terhadap Pemberitahuan Latar Belakang
-
Cara Kerja Notifikasi Push
-
Expo & Pemberitahuan Dorong
-
Mendapatkan Token Dorong
-
Mengirim Pemberitahuan Push
-
Menggunakan Server Dorong Expo
-
Lebih lanjut tentang Token Dorong
-
Menambahkan Pemberitahuan Push ke Aplikasi Toko (1/3)
-
Menambahkan Pemberitahuan Push ke Aplikasi Toko (2/3)
-
Menambahkan Pemberitahuan Push ke Aplikasi Toko (3/3)
-
Pemberitahuan Dorong di Aplikasi Terkelola non-Expo
-
Sumber Daya Modul
-
Roundup & Langkah Selanjutnya
-
Pengenalan Modul
-
JavaScript – Ringkasan
-
Pengaturan Proyek
-
Penyegaran Sintaks Inti
-
Fungsi Panah
-
Objek: Properti & Metode
-
Array & Metode Array
-
Array, Objek & Jenis Referensi
-
Operator Spread & Parameter
-
Destrukturisasi
-
Kode & Async
-
Sumber Daya Modul
-
Pengenalan Modul
-
Apa itu React.js?
-
Proyek Awal
-
Memahami BEJ
-
Memahami Komponen
-
Bekerja dengan Banyak Komponen
-
Bekerja dengan Props
-
Rendering Daftar Data
-
Menangani Acara
-
Komunikasi Orang Tua-Anak
-
Mengelola State
-
Lebih lanjut tentang State
-
Masukan Pengguna & Pengikatan Dua Arah
-
Sumber Daya Modul
- SELESAI
