iQOO Z10 - Smartphone Tahan Lama dengan Performa Oke

 

iQOO Z10 adalah smartphone kelas menengah yang dirilis pada April 2025 oleh iQOO (sub-brand Vivo). Di India, smartphone ini membuktikan diri sebagai pilihan hemat dengan baterai besar dan performa mantap.

Berikut Spesifikasi Utama iQOO Z10 

• Rilis & Sistem Operasi: April 2025 dengan Android 15 + Funtouch OS 15
• Chipset & Memori: Snapdragon 7s Gen 3; RAM 8/12 GB + storage 128/256 GB (UFS 2.2).
• Baterai & Pengisian: 7.300 mAh, 90 W fast charging, dan mendukung reverse wired charging.
• Desain & Dimensi: Layar AMOLED 6,77″, refresh rate 120 Hz, kecerahan puncak 5000 nits, berat sekitar 199 g.
• Kamera: Kamera belakang 50 MP (dengan OIS) + 2 MP depth; kamera depan 32 MP atau 8 MP
• Fitur Tambahan: Speaker stereo, sensor sidik jari dalam layar, IP65 rating, sertifikasi MIL-STD-810H.

Keunggulan Utama

• Performa Responsif : Perpaduan Snapdragon 7s Gen 3 dan RAM besar menjadikan pengguna merasakan pengalaman yang cepat dan halus bukan sekadar mid-range biasa.
• Layar Yang Memukau : Layar AMOLED yang terang dan halus (120 Hz) mendukung detail visual yang tajam, cocok untuk gaming atau menikmati konten HDR di platform seperti Netflix dan Prime Video.
• Daya Tahan Batrai : Daya tahan baterai yang besar membuat iQOO Z10 bisa bertahan hampir dua hari penuh tanpa perlu isi ulang! Cocok untuk gaming, streaming, atau sosial media maraton.

Adapu Kelemahan 

• Kamera ultra-wide tidak tersedia, membuat fitur fotografi dengan sudut lebar kurang maksimal.
• Bagi sebagian pengguna, tidak adanya speaker stereo mungkin jadi pertimbangan minor.

Berdasarkan sejumlah sumber, berikut varian yang termasuk dalam lini iQOO Z10:

1. iQOO Z10                                                                                                                                             Untuk penyimpanan iQOO Z10 ada beberapa macem, 8GB+128GB , 8GB+256GB , 12GB+256GB, 12+512GB dengan harga yang berbeda beda
2. iQOO Z10X : 
   • RAM & Penyimpanan:
   • 6 GB + 128 GB
   • 8 GB + 128 GB
   • 8 GB + 256 GB
3. iQOO Z10 Turbo : Varian performa dengan fitur-fitur unggulan:
   Dilengkapi MediaTek Dimensity 8400, baterai 7.620 mAh, pengisian cepat 90 W, layar AMOLED 144Hz, dan fitur reverse charging.
4. iQOO Z10 Turbo Pro : Versi paling premium dengan:
   Snapdragon 8s Gen 4, RAM hingga 16 GB, baterai 7.000 mAh + 120 W fast charging, layar AMOLED 144Hz 2000-nits, dan sensor ultrawide.
5. iQOO Z10 Lite 5G : Varian ramah anggaran dengan fokus 5G dan fungsi AI:
   MediaTek Dimensity 6300 (6 nm), baterai 6.000 mAh, fitur AI Photo Enhance dan AI Erase, serta rating IP64.

Siapa yang cocok pakai iQOO Z10?

• Kamu yang butuh HP dengan daya tahan baterai luar biasa dan pengisian cepat.
• Pengguna yang ingin layar cerah & halus untuk multimedia.
• Penggemar gaming casual.

Berikut tabel harga baru (resmi dari pabrikan) dan bekas (gress) varian iQOO Z10 yang tersedia di Indonesia serta perkiraan harga untuk iQOO Z10 Turbo/Pro:

Event Handling di JSX

Berikut adalah materi lengkap tentang "Event Handling di JSX" — sangat cocok untuk pemula yang sedang belajar React dan ingin memahami cara menangani interaksi pengguna seperti klik, input, dll.

Event Handling di JSX (React)

Event Handling adalah cara untuk menangani interaksi pengguna seperti: Klik Tombol, Mengetik di input, Mengarahkan Mouse, Men-Submit-Form

Di React (dengan JSX), event ditangani menggunakan atribut yang menyerupai HTML namun dengan beberapa perbedaan penting.

Penulisan Event di JSX Sebagai berikut :

<tagHTML onEventName={fungsiHendler}></tagHTML>

• Gunakan camelCase untuk nama event seperti onClick, onChange, onSubmit, dll.
• Nilai dari event handler adalah fungsi JavaScript, bukan string.

Contoh Dasar Dari Event OnClick

Contoh Dasar Dari Event onChange

Contoh Dasar Dari Event onSubmit

Berikut List Yang Sering Ada pada JSX

Contoh Dasar Sederhana Untuk Input dan Menyimpan Serta Menmpilkan Saat Tombol Submit Di tekan

Catatan :

Menangani Event Klik, Input, dll

Menggunakan Fungsi dan Parameter

Penggunaan Kondisional dan Perulangan

 

• Render Bersyarat (Conditional Rendering)

• Render Daftar dengan map()

• Menangani Key di Setiap Elemen

Dalam materi Penggunaan Kondisional dan Perulangan dalam JSX yang cocok untuk pemula hingga menengah, React dan JSX mendukung logika JavaScript, termasuk: Kondisional menentukan apakah suatu elemen harus di tampilkan atau tidak, Perulangan menampilkan daftar elemen dari array.

A. Kondisional Dalam JSX

    1.     Ternary Operator(Kondisi ? benar : salah)

    2.     Short-circuit (&&)

    3.     Fungsi Kondisional

Berikut Contoh sederhana fungsi kondisional

B. Perulangan Dalam JSX

Perulangan dalam JSX biasa dilakukan dengan array.map(), Karena JSX tidak mendukung for secara langsung

Berikut Contoh Sederhana

Menggunakan perulangan untuk Komponen

Kasus 1: Tampilkan pesan berdasarkan status login

Deskripsi:
Jika user login, tampilkan "Halo, Andi!". Jika tidak, tampilkan tombol "Login".

Interaksi JSX dengan Komponen

 Materi ini cocok untuk pemula karna dalam react Komponen adalah blok bangunan utama. JSX digunakan untuk menulis dan menyusun komponen, serta untuk mengirim data dan event antar komponen.

JSX Memenugkinkan kita menyiapkan komponent di dalam komponent lain, mengirim data melalui props, menangani interaksi dan event

Struktur Dasar Komponen dan JSX

Komponen SelamatDatang dipanggil di dalam JSX App seperti memanggil tag HTML.

Mengirim Data Ke Komponen Dengan props

1. Komponen Anak

Berikut Contoh Komponen Anak

2. Komponen Induk

Berikut Contoh Untuk Komponen Induk

Props adalah object yang berisi data yang dikirim dari komponen induk ke anak

Interaksi : Event Hendler di Komponen

Komponen dengan Button dan Event 

Di panggil di App

JSX bisa menyisipkan funsi javascript seperti onClick ={handleClick} untuk menangani event.

Komponen Bersarang

JSX juga bisa menampilkan banyak komponen secara bersarang :

Praktik Gabungan

Berikut Contoh Sederhana

Kesimpulan

Interaksi                                                Penjelasan

Menisipkan Komponen                        Menggunakan  <NamaKomponen />

Props                                                    Mengirim data dari induk ke anak

Event Hendler   (onClick dll)              Mengirim data dari induk ke anak

JSX Bersarang                                     Menyusun UI dari banyak komponen kecil

Poin-Point 

• Membuat Komponen Sederhana

• Props dan Penggunaannya dalam JSX

• State dan Perubahannya di JSX

Struktur dan Aturan Penulisan JSX yang Benar

•  Pengertian JSX

JSX (JavaScript XML) adalah ekstensi sintaks JavaScript yang memungkinkan kita menulis kode yang mirip HTML di dalam file JavaScript, terutama digunakan dalam React. JSX memudahkan kita membangun antarmuka pengguna (UI) dengan sintaks yang lebih deklaratif dan intuitif.

• Struktur Dasar JSX

berikut contoh sederhana dari struktur JSX

bagian bagian pada JSX Tag Pembuka dan Penutup Seperti <div>....</div> sedangkan Isi atau anak element bisa berupa text, element JSX lainnya atau ekpresi javascript dalam {}

• Aturan JSX yang perlu kita ketahui

1. Harus Punya Satu Root Element

JSX hanya bisa mengembalikan satu elemen utama. Gunakan <div> atau React.Fragment (<> ... </>) jika ingin menulis lebih dari satu elemen:

    

       2. Gunakan ClassName Untuk CSS

Karena class adalah keyword di dalam javascript, maka kita gunakan ClassName di JSX 

// HTML

<div class="kotakForm"></div>

// JSX

<div className="kotakForm"></div>

         3. Atribut Menggunakan camleCase

JSX menggunakan penulisan atribut seperti onClick, htmlFor, tabIndex, bukan lowercase seperti HTML biasa.

<button onClick={handleClick}>Klik Saya</button>

<label htmlFor="email">Email</label>

         4. Gunakan {} untuk ekpresi JavaScript

Kita bisa menyisipkan JavaScript (bukan statement) dengan {}

const nama = "Andi";

<p>Halo, Saya {nama}</p>

         5. Komentar JSX

Untuk memberikan komentar pada JavaScript kita bisa mengisi seperti berikut :

{/* Ini Komentar dalam JavaScript */}

         6. Tag harus di tutup

Semua element di JSX harus di tutup, termasuk element kosong harus di tutup juga berikut contoh

// Benar

<img src="logo.png" alt="Logo" />

<br />

Contoh Lengkap:

         7. Tabel Ringkasan Aturan JSX

Berikut contoh sederhana yang menampilkan dua variabel nama dan umur

Tambahkan Materi Berikut : 

• Penanganan Atribut dan Event

• Fragment dan Elemen Pembungkus

Menyisipkan JavaScript dalam JSX

Berikut sedikit penjelasan tentang pembelajaran "Menyisipkan JavaScript dalam JSX" yang cocok untuk pemula yang sedang mempelajari React:

JSX adalah ekstensi JavaScript yang digunakan dalam React. Salah satu keunggulan JSX adalah kemampuannya untuk menyisipkan ekspresi JavaScript langsung di dalam markup (tampilan) menggunakan tanda kurung kurawal {}

Apa Itu Ekspresi JavaScript?

Ekpresi adalah bagian dari code JavaScript yang menghasilkan sebuah nilai misalnya

• Nilai langsung "Haloo" atau 123
• Variabel : nama
• Fungsi : getName
• Operasi : 2+2 atau angka * 10

Hanya ekpresi bukan statemen for if atau while

Cara Menyisipkan JavaScript di JSX

Gunakan kurung kurawel {} untuk menyisipkan JavaScript dalam JSX

const nama = "jono";

const elemen = <h1>Heloo , {nama}!</h1>

Contoh Penggunaan JavaScript di JSX

1. Variabel

const nama = "Jono";

return <p>Selamat datang, {nama}</p>;

2. Operasi Matematika

const a = 5, b = 10;
return <p>Hasil: {a + b}</p>; // Output: Hasil: 15
3. Ternary Operator (if sederhana)
const isLoggedIn = true;
return <p>{isLoggedIn ? "Selamat Datang" : "Silakan Login"}</p>;
4. Fungsi
function getWaktu() {
  return new Date().toLocaleTimeString();
}
return <p>Waktu sekarang: {getWaktu()}</p>;
4. Array dan .Map
const buah = ["Apel", "Jeruk", "Mangga"];
return (
  <ul>
    {buah.map((item, index) => (
      <li key={index}>{item}</li>
    ))}
  </ul>
);

Hal yang Tidak Boleh Dilakukan

Tidak bisa menggunakan pernyataan (statement) seperti :

// x ini tidak boleh

{ if (true) { return "Halo" } }

Gunakan ternary atau ekpresi pendek

// ✅ Gunakan ini:
{true && <p>Halo</p>}

Kesimpulan

JSX hanya menerima ekspresi di dalam {} karena JSX pada akhirnya dikompilasi ke dalam fungsi JavaScript biasa.

Link 1

Link 2

Link 3

Link 4

Link 5

Link 6

Link 7

Sintaks Dasar JSX dan HTML

 Pengertian JSX

JSX (JavaScript XML) merupakan eksistensi sintaks JavaScript yang di pergunakan di react untuk menulis element UI. JSX terlihat seperti HTML, tetapi di tulis didalam file JavaScript dan dikompilasi menjadi JavaScript murni oleh Babel.

HTML adalah bahasa markup standard yang digunakan di browser untuk menyusun halaman web

Contoh :

Mengapa Kita Menggunakan JSX?

> Membuat kode lebih mudah dibaca dan di tulis

> Mendeklarasikan element UI seperti menulis HTML

> Mendukung ekspresi JavaScript di dalam tanda kurung {}

Sintaks Dasar JSX

1. Element JSX

2. JSX Harus Satu Element Root

3. Menyisipkan JavaScript dalam JSX

Gunakan {} untuk memasukan ekpresi JavaScript

Atribut JSX

1. Gunakan className bukan class

2. Gunakan camelCase untuk nama atribut

Perbedaan Penting JSX dan HTML

> HTML : class, for, Atribut lowercase

> JSX     : className, htmlFor, camelCase(onClick, OnChange) 

For VS htmlForm

Contoh Lengkap

Contoh JSX

Contoh HTML