Flutter’da birinchi mobil ilovangizni yaratish (bosqichma-bosqich)

Flutter — bu Google tomonidan ishlab chiqilgan mobil ilovalar yaratish frameworkidir. U yordamida siz bitta kod bazasidan Android va iOS uchun ilovalarni yaratishingiz mumkin. Flutter tezkor ishlashi, chiroyli interfeyslari va boy kutubxonalari bilan butun dunyoda mashhur. Ushbu maqolada biz Flutter’da ilk mobil ilovamizni qanday yaratishni bosqichma-bosqich o‘rganamiz.

1. Flutter nima?

Flutter — bu Dart dasturlash tilida yozilgan framework bo‘lib, foydalanuvchi interfeysi (UI) yaratishni juda osonlashtiradi. U native (ya’ni haqiqiy) Android/iOS ilova yaratadi, shuning uchun tezligi ham, sifati ham yuqori bo‘ladi.

2. Kerakli dasturlarni o‘rnatish

Flutter bilan ishlash uchun sizga quyidagi vositalar kerak bo‘ladi:

• Flutter SDK
• Android Studio
• VS Code (yoki Android Studio IDE)

O‘rnatilgandan so‘ng, terminalda quyidagi buyruqni yozib tekshirib ko‘ring:

flutter doctor

U sizga barcha komponentlar to‘g‘ri o‘rnatilganmi yoki yo‘qmi, shuni ko‘rsatadi.

3. Yangi loyiha yaratish

Yangi Flutter loyihasini yaratish uchun terminalda quyidagini yozing:

flutter create salom_dunyo

Keyin loyihaga kiring:

cd salom_dunyo

Endi sizda asosiy fayl — lib/main.dart mavjud.

4. Kodni tahrirlash

lib/main.dart faylini oching va quyidagi kodni yozing:

import 'package:flutter/material.dart'; void main() { runApp(SalomDunyo()); } class SalomDunyo extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text('Salom, Flutter!'), backgroundColor: Colors.blueAccent, ), body: Center( child: Text( 'Assalomu alaykum, dunyo!', style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold), ), ), ), ); } }

Bu kod ekranda “Assalomu alaykum, dunyo!” yozuvini ko‘rsatadigan oddiy ilovani yaratadi.

5. Ilovani ishga tushirish

Endi ilovamizni ishga tushiramiz. Terminalda quyidagini yozing:

flutter run

Agar Android emulyatori yoki haqiqiy qurilma ulangan bo‘lsa, sizning birinchi Flutter ilovangiz ishga tushadi 🎉

6. Flutter widgetlari haqida qisqacha

Flutter’da har bir element widget deb ataladi. Masalan:

• Text() — matn chiqaradi
• Column() — elementlarni ustma-ust joylashtiradi
• Row() — yonma-yon joylashtiradi
• Container() — fon, bo‘shliq va o‘lcham berish uchun

Har bir widget — bu mustaqil blok bo‘lib, ularni birlashtirib kuchli UI yaratish mumkin.

7. “Hot Reload” funksiyasi

Flutter’ning eng zo‘r xususiyati — Hot Reload. U yordamida siz kodda o‘zgarish kiritasiz va ilova deyarli darhol yangilanadi, qayta ishga tushirish shart emas. Bu ishlab chiqish jarayonini 3–5 barobar tezlashtiradi.

8. Flutter bilan nimalar qilish mumkin?

Flutter yordamida nafaqat mobil ilovalar, balki:

• 🖥️ Veb ilovalar
• 💻 Desktop ilovalar (Windows, macOS, Linux)
• 📱 Android va iOS ilovalar

ya’ni — bitta kod bazasidan butun platformalar uchun ishlaydigan ilovalar yaratish mumkin.

9. Flutter kutubxonalari va paketlar

Ilovalaringizni yanada kuchliroq qilish uchun Flutter’da minglab kutubxonalar mavjud:

• http — API bilan ishlash uchun
• provider — state management uchun
• google_fonts — maxsus shriftlar uchun
• shared_preferences — lokal ma’lumot saqlash uchun

Bularni pubspec.yaml faylga qo‘shish orqali foydalanish mumkin.

10. Xulosa

Flutter — bu tezkor, samarali va chiroyli ilovalar yaratish uchun eng yaxshi tanlovlardan biridir. Agar siz mobil dasturlashni endi boshlayotgan bo‘lsangiz, Flutter yordamida bir haftada ishga tushadigan prototip yaratish imkoniga egasiz. Amaliy tajriba orqali siz o‘rganishni tezlashtirasiz va bir necha oy ichida to‘liq funksional ilovalar yarata olasiz.