# U React kutubxonasiga asoslangan bo‘lib, Web uchun emas, balki haqiqiy (Native) mobil komponentlardan foydalanadi. Shu sababli React Native'da yozilgan ilovalar oddiy WebView emas, balki Android va iOS ning o‘zining UI komponentlari yordamida ishlaydi. --- # React Native nega yaratilgan? Ilgari mobil dastur yaratishda quyidagicha holat mavjud edi. Android uchun: - Java - Kotlin iOS uchun: - Objective-C - Swift Har ikkala platforma uchun alohida dasturchi va alohida kod bazasi kerak bo'lardi. Masalan: ``` Android ├── Login ├── Home ├── Profile └── Settings iOS ├── Login ├── Home ├── Profile └── Settings ``` Bu esa: - vaqtni ko‘paytiradi - xarajatni oshiradi - kodni ikki marta yozishga majbur qiladi - buglarni ikki joyda tuzatishga olib keladi Meta bu muammoni hal qilish uchun React Native'ni ishlab chiqdi. --- # React Native qanday ishlaydi? React Native JavaScript kodini Native UI komponentlariga bog‘laydi. Oddiy ko‘rinishi: ``` React Components │ ▼ JavaScript Runtime │ ▼ React Native │ ┌──────┴───────┐ ▼ ▼ Android UI iOS UI ``` Masalan siz quyidagi kodni yozasiz. ```tsx Hello World ``` Android'da bu ``` TextView ``` ga aylanadi. iOS'da esa ``` UILabel ``` ga aylanadi. Demak React Native HTML yaratmaydi. WebView ishlatmaydi. Haqiqiy Native komponentlardan foydalanadi. --- # React Native'da yozilgan mashhur ilovalar Ko‘plab yirik kompaniyalar React Native'dan foydalanadi. - Facebook - Instagram - Discord - Shopify - Coinbase - Wix - Bloomberg - Microsoft Office - Tesla (ba'zi qismlari) Bu React Native katta hajmdagi loyihalar uchun ham mos ekanligini ko‘rsatadi. --- # React Native ning asosiy afzalliklari ## 1. Bitta kod bazasi Bir marta yozilgan kod Android va iOS da ishlaydi. ``` App.tsx ↓ Android ✅ iOS ✅ ``` Ko‘pincha kodning 90–98% qismi umumiy bo‘ladi. --- ## 2. Tez ishlab chiqish Oldin: ``` Android → 3 oy iOS → 3 oy Jami → 6 oy ``` React Native bilan: ``` Android + iOS ↓ 3–4 oy ``` Natijada ishlab chiqish tezlashadi. --- ## 3. Hot Reload Kodni saqlashingiz bilan natija darhol telefon yoki emulatorga tushadi. Masalan: ```tsx Salom ``` ↓ Saqlaysiz ↓ Telefon avtomatik yangilanadi. Ilovani qayta o‘rnatish shart emas. --- ## 4. Katta ekotizim React Native uchun minglab kutubxonalar mavjud. Masalan: Navigation ```bash expo-router react-navigation ``` State Management ```bash zustand redux jotai mobx ``` Animation ```bash react-native-reanimated moti ``` Networking ```bash axios react-query ``` Forms ```bash react-hook-form ``` Validation ```bash zod ``` Storage ```bash MMKV AsyncStorage SecureStore ``` --- # React Native qanday tillardan foydalanadi? Asosan: - JavaScript - TypeScript Misol: ```tsx function App() { return ( Hello React Native ); } ``` Professional loyihalarda esa deyarli har doim TypeScript ishlatiladi. ```tsx interface User { id:number; name:string; } const user:User={ id:1, name:"Ulugbek" } ``` --- # React Native komponentlari Web'da ```html

📱 React Native nima? To‘liq qo‘llanma (2026)

📱 React Native nima? To‘liq qo‘llanma (2026)