Texno Karvon

Yakuniy loyiha · Capstone

Web Admin Panel
(Next.js)

Modul 7 · Dars 7.3

Shu darsdan nima olasiz

Dars tugagach siz nima qila olasiz?

Next.js App Router’da admin panel qurasiz: jadval, filtr, holat boshqaruvi
Frontend’da ham o‘sha intizomni saqlaysiz: reja → generatsiya → review
Oddiy login va rol chegarasini qo‘shasiz

Va’da: bu — kursdagi eng tez dars.

Nega? Hamma qurollar allaqachon qo‘lda.

Kontrakt tayyor · shared tiplar tayyor · CLAUDE.md tayyor · tsikl o‘rganilgan

Ro‘yxat sahifasi

Kontrakt bor joyda jadval tez quriladi

Plan Mode: login, arizalar ro‘yxati, tafsilot — App Router joylashuvi
Jadval ustunlari: raqam, ism, holat (rangli badge), to‘lov, sana
Sahifalash API’ning page/limit’i bilan — kontrakt ishlayapti
Ma’lumot to‘g‘ridan-to‘g‘ri real API’dan keladi

Funksiyalar

Operatorga aslida nima kerak?

Holat bo‘yicha filtr + ism bo‘yicha qidiruv — server tomonda
Ariza tafsiloti sahifasi + to‘lov tarixi
PATCH bilan holat o‘zgartirish — faqat ruxsat etilgan o‘tishlar
Edge case: holatni client’da emas, server javobidan keyin yangilang

Login

Oddiy auth ham intizom bilan yoziladi

Avval test: "login’siz sahifa ochilmasin"
Middleware bilan himoya; parol env’da hash ko‘rinishida
Halol eslatma: production’da tayyor auth yechimi (OAuth) ma’qulroq

To‘liq oqim

Tizim qanday aylanadi?

Telegram’da ariza → to‘lov → admin panelda paydo bo‘ladi
Operator holatni o‘zgartiradi → bot foydalanuvchiga xabar beradi
Uch app ham bitta API kontraktiga tayanadi

Nazorat ro‘yxati

Admin panel tayyor deb qachon aytasiz?

Login’siz birorta sahifa ochilmaydi
Jadval, sahifalash, filtr va qidiruv real API bilan ishlaydi
Faqat ruxsat etilgan holat tugmalari ko‘rinadi
Holat server javobidan keyin yangilanadi, undan oldin emas

Esda qoling

Shu darsdan uch gap

Kontrakt va shared tiplar bor joyda frontend uchib quriladi.
Frontend’da ham edge case bor: server javobini kutish shart.
Auth’ni sodda qiling, lekin testsiz qoldirmang.

Hozir qiling

Videodan keyingi birinchi qadam

Admin panelni quring va to‘liq oqimni brauzerda sinang
Spec’da yo‘q bitta funksiya qo‘shing: arizalarni CSV’ga eksport
To‘liq tsikl bilan: reja → test (eksport formati) → kod → review

Keyingi — yakuniy dars

Mobil klient, CI/CD va
halol raqamlar

Dars 7.4