Asosiy kontentga o'tish

Birinchi ilovangizni quring

Bu qo'llanmada noldan vazifa menejeri quramiz. Oxirida telefoningizda bir necha ekranli, ma'lumotlarni saqlaydigan va dizaynini chat orqali o'zingiz shakllantirgan ishlaydigan ilova bo'ladi.

Nima quramiz​

Oddiy, lekin to'liq vazifa menejeri:

  • Vazifalar toifalar bo'yicha guruhlangan bosh ekran
  • Vazifa qo'shish ekrani va vazifa tafsilotlari ekrani
  • Bajarilganlarni ustidan chizib belgilash
  • Toza, minimalistik dizayn

Boshlashdan oldin​

  • Kamida 30 krediti bor AppX hisobi (birinchi build'ni boshlash uchun shuncha kerak)
  • Kamerali telefon (iPhone yoki Android)

1-qadam — Ilovani tasvirlang​

appx.uz saytiga kiring. Boshqaruv panelida ilova tavsifini maydonga yozing va strelkani (Build app) bosing. AppX loyihaga so'rovingiz asosida nom beradi; uni keyinroq sozlamalarda o'zgartirishingiz mumkin.

Ushbu so'rovni joylashtiring:

Create a task manager app with these screens:

1. Home screen - a list of tasks grouped by category (Work, Personal,
   Shopping). Each task shows a title, a category badge, and a checkbox.
   Completed tasks have strikethrough. A floating + button opens the
   add-task screen.

2. Add Task screen - a form with: task title, category picker
   (Work / Personal / Shopping), an optional notes field, and a Save button.

3. Task Detail screen - full task info with edit and delete options.

Use a clean white design with blue as the accent color.
Store tasks locally so they persist between sessions.
maslahat

So'rov qancha aniq bo'lsa, birinchi natija shuncha yaqin chiqadi. Ekranlarni, ma'lumotlarni va ko'rinishni ayting — xuddi jamoadoshingizga vazifa tushuntirgandek.

2-qadam — Rejani ko'ring va build'ni boshlang​

Rejalashtirilgan ekranlar va "About N credits" (taxminan N kredit) yozilgan reja kartasi paydo bo'ladi. Boshlash uchun Build first milestone tugmasini bosing, reja sizga to'g'ri kelmasa — Stop.

So'ngra AppX kodni yozadi va tekshiradi. Build ekranlar soniga emas, bajarilgan ish hajmiga qarab hisoblanadi, muvaffaqiyatsiz bo'lsa esa sizdan hech narsa yechilmaydi. Build vaqti ekranlar va ularning murakkabligiga bog'liq.

3-qadam — Telefoningizda oching​

Yuqori paneldagi Telefonda ochish tugmasini bosing. QR kodni telefoningiz kamerasi bilan skanerlang, so'ng Ilovani ochish tugmasini bosing; ilova telefon brauzerida ochiladi. Android'da uning o'rniga Expo Go'da ochish tugmasini bosishingiz mumkin; buning uchun qaysi Expo Go build'i kerakligi Qurilmada sinash sahifasida.

Vazifa menejeringiz ochiladi. Sinab ko'ring:

  • Vazifa qo'shish uchun + ni bosing
  • Vazifani bajarilgan deb belgilang
  • Tafsilotlarini ko'rish uchun vazifani bosing

4-qadam — Dizaynni takomillashtiring​

Keling, bosh ekranni jilolaylik. Xabaringizda ekran nomini ayting:

On the Home screen I'd like:
- A greeting at the top like "Good morning 👋"
- A count of completed vs. total tasks for today
- A subtle shadow on the task cards
- Slightly larger task titles

AppX joriy kodingizni o'qiydi va tahrirni qo'llaydi, ko'rinish esa yangilanadi. Telefoningizda o'zgarishni ko'rish uchun sahifani brauzerda qayta yuklang (Android'dagi Expo Go'da: telefonni silkiting → Reload); u birinchi ekrandan ochiladi.

Tahrirlar ish hajmiga qarab hisoblanadi, har bir navbat uchun kamida 1 kredit. Kutganingizdek chiqmadimi? Navbat kartasidagi Undo tugmasini bosing yoki qaytadan so'rang.

5-qadam — Funksiya qo'shing​

Endi muddatlarni qo'shamiz:

On the Add Task screen, add a due-date picker shown as a tappable field
that opens a date picker. On the Home screen, show the selected date
next to each task title, and show overdue dates in red.

Bu kattaroq o'zgarish — u sana tanlagichga, sana mantig'iga va ikkala ekrandagi uslublarga tegadi.

6-qadam — Biror narsani tuzating​

Telefoningizda muammo ko'rdingizmi? Uni shunchaki tasvirlang:

The + button is hidden behind the bottom of the screen on my iPhone.
Move it up so it's fully visible above the safe area.

Xatoni oddiy so'zlar bilan tasvirlash ko'pincha uni o'zingiz qidirishdan tezroq.

7-qadam — Kodni ko'ring va tahrirlang​

Loyihangizni ko'rish uchun loyihaning yon panelidagi Kod bo'limini oching. Haqiqiy Expo loyihasini ko'rasiz — ekranlar app/ ichida, qayta ishlatiladigan qismlar components/ ichida, ranglar kabi umumiy qiymatlar constants/ ichida.

Bularning barchasi haqiqiy, o'qib ko'rish mumkin bo'lgan React Native. Istalgan faylni o'qishingiz va to'g'ridan-to'g'ri tahrirlashingiz mumkin. Chat yetmay qolganda, kod doim yoningizda.

8-qadam — Chiqaring​

Ilovadan mamnun bo'lganingizda:

  • Havola ulashing — Ulashish tugmasi ishlayotgan ilovani brauzerda ochadigan havola beradi
  • Kodni yuklab oling — butun loyiha ZIP holida, har bir tarifda; xohlasangiz GitHub'ga joylang
  • Do'konlarga chiqaring — loyihangizdan do'konga chiqarish so'rovini yuboring va AppX'dagi odam ilovani siz bilan birga chiqaradi. Qarang: Do'konlarga chiqarish.

Nimalarni o'rgandingiz​

  • Birinchi urinishdayoq yaqin natija beradigan generatsiya so'rovini yozish
  • Dizayn va funksiyalarni chat orqali takomillashtirish
  • Muammolarni oddiy so'zlar bilan tasvirlab tuzatish
  • Ilovangiz ortidagi haqiqiy kodni ko'rish va unga egalik qilish

Keyingi qadamlar​

Chat orqali tahrirlash

Tezroq ishlash uchun ilg'or tahrirlash usullari.

Prompting bo'yicha maslahatlar

Har bir so'rovdan yaxshiroq natija oling.

Kodni GitHub'ga joylash

ZIP'ni yuklab oling va o'z repozitoriyingizga yuboring.

Do'konlarga chiqarish

Ilovangizni siz bilan birga do'konlarga qanday chiqaramiz.