Firebasega uslubidagi, offalyn, mahalliy ma'lumotlar bazasi.
MahalliyBaza sizga Firebase uslubidagi sodda, kuchli, foydalanuvchi brauzerida saqlanadigan,IndexedDB ma'lumotlar bazasida ishlashni osonlashtiradigan offlayn ma'lumotlar bazasini taqdim etadi.
Siz xohlagancha ma'lumot bazalarini yaratishingiz mumkin.
Ma'lumot bazalari Collectionlar(to'plam) va Documentlar(hujjatlar)ga birlashtirilgan (xuddi Firebase Cloud Firestore kabi).
- Ma'lumotlar bazalarida collectionlar mavjud (misol:
foydalanuvchilar
) - Collectionlarda documentlar mavjud (misol:
{ id: 1, ism: 'Otabek', yosh: 19 }
MahalliyBaza LocalForage yordamida tuzilgan.
Atamalar... Quyida ishlatilish mumkin bo'lgan ma'nolarda keltirildi.
- Metod -
- Order -
- OrderBy -
- Ascending -
- Descending -
- Key(s) -
- Limit -
- Field - maydon. O'zgaruvchi kaliti va qiymati.
- Document - hujjat yoki ma'lumot.
- Collection - documentlar to'plami.
- Databaza yoki database - ma'lumotlar bazasi. Collectionlar saqlanadigan joy.
- Add - qo'shish. Get - olish.
- Update - yangilash.
- Set - Bu yerda qayta yozish orqali yangilash, o'rnatish ma'nosida.
- Delete - o'chirish.
- Overwrite - ustiga yozish / qayta yozish.
- Promise(s) -
- Async/await -
- Console -
- Log -
- Error -
- Then -
- Playground -
- Ishni Boshlash
- Video Darslik
- Qisqa Kirish
- Ma'lumot Qo'shish
- Ma'lumotni olish
- Ma'lumotni o'chirish
- Kalitlardan yuqori darajada foydalanish
- Promiselar bilan ishlash
- Documentni qo'shib, keyin biron ish bajarish
- Documentni yangilab, keyin biron bir ishni bajarish
- Documentni o'rnatib (ustiga yozib), keyin biron ish bajarish
- Documentni o'chirib tashlab, keyin biron ish bajarish
- Collectionni o'chirib tashlab, keyin biron ish bajarish
- Ma'lumotlar bazasini o'chirib tashlab, keyin biron ish bajarish
- Async / Await
- Sozlash
- Playground
Ishlab chiqish (development) varianti. Ushbu variant siz proyekt ustida ishlayotgan paytingizda tekshirish uchun ancha qulayliklar yaratib beradi. Misol ucun: yangi qo'shilagan, o'zgartirilgan, o'chirilgan va hkz ma'lumotlar to'grisida sizga browseringiz dev-tools(F12 yoki CTRL+SHIFT+I) oynasining console bo'limida rang bilan ajratilgan habarlar yozish imkonini beradi.
<script src="https://unpkg.com/mahalliybaza/dist/mahalliybaza.dev.js"></script>
<script>
let db = new MahalliyBaza('db')
</script>
# Yoki
<script src="./mahalliybaza.dev.js"></script>
<script>
let db = new MahalliyBaza('db')
</script>
Yoki, hajmi kichiklashtirilgan, ishlab chiqarish (production) variantidan foydlaning. Bu variantni siz proyektni tamomlaganingizdan keyin foydalanuvchilarga taqdim etganingizda ishlatishingiz mumkin. Bunda, qo'shilgan, yangilangan, o'chirilgan va hkz ma'lumotlar haqida browser dev-tools console bo'limida habarlar ko'rsatilmaydi. Va ishlab chiqish variantiga qaraganda fayl hajmi kamroq bo'ladi.
<script src="https://unpkg.com/mahalliybaza/dist/mahalliybaza.min.js"></script>
<script>
let db = new MahalliyBaza('db')
</script>
# Yoki
<script src="./mahalliybaza.min.js"></script>
<script>
let db = new MahalliyBaza('db')
</script>
npm install mahalliybaza --save
import MahalliyBaza from 'mahalliybaza'
let db = new MahalliyBaza('db')
npm install mahalliybaza
// plugins/mahalliybaza.js
import MahalliyBaza from 'mahalliybaza'
let db = new MahalliyBaza('db')
export default (context,inject) => {
inject('db', db)
}
// nuxt.config.js
export default {
...
plugins: [
{ src: "~/plugins/MahalliyBaza", mode: "client" }
],
...
}
<!-- pages/index.vue -->
<script>
export default {
head: {
title: 'Nuxt - bosh sahifa'
},
mounted() {
this.$db.collection('foydalanuvchilar').add({
id: 1,
ism: 'Otabek',
yosh: 19
})
}
}
</script>
Tez kunda... Videodarslik tayyorlanmoqda.
To'plamga(endilikda collection) hujjat/ma'lumot(endilikda document) qo'shish bilan boshlang. Collection
metodida to'plam nomini kiriting (to'plam avtomatik ravishda yaratiladi), keyin add
usuli bilan qo'shmoqchi bo'lgan documentni (ma'lumotni) kiriting:
db.collection('foydalanuvchilar').add({
id: 1,
ism: 'Otabek',
yosh: 19
})
Juda ham oddiy!
Collectionga ba'zi ma'lumotlarni qo'shgandan so'ng, siz get
metodi bilan butun collectionni olishingiz mumkin:
db.collection('foydalanuvchilar').get().then(foydalanuvchilar => {
console.log(foydalanuvchilar)
})
// [
// { id: 1, ism: 'Otabek', yosh: 19 },
// { id: 2, ism: 'Abdulaziz', yosh: 34 }
// ]
Misol uchun:
db.collection('foydalanuvchilar').add({
id: 1,
ism: 'Otabek',
yosh: 19
})
Mavjud documentni(qisman yok butunlay) yangilash mumkin. Buning uchun update
metodidan foydalaning. Documentga mos kelish uchun faqat maydon va qiymat (odatda id) bo'lgan obyektni kiriting.
Diqqat! agar faqat aynan qaysidir maydonlarning o'zi yangilashi kerak bo'lsa o'sha maydonlarni o'zinigina update metodi ichiga kiriting.
db.collection('foydalanuvchilar').doc({ id: 1 }).update({
ism: 'Abdulaziz'
})
// [
// { id: 1, ism: 'Abdulaziz', yosh: 19 },
// { id: 2, ism: 'Abdulaziz', yosh: 34 }
// ]
Diqqat: Agar siz bergan mezon bo'yicha bittadan ko'p documentlar topilsa, misol: .doc({ ism: 'Otabek' })
bo'yicha, unday holatda barcha mos tushgan (topilgan) documentlar yangilanadi.
Mavjud documentni set() metodi orqali yangilash.
Bunda set() metodi ichida barcha yangilanishi kerak bo'lgan document maydonlari taqdim etilishi kerak. Chunki set() metodi databazadagi collection ichidagi documentga kiritilayotgan yangi maydonlarning o'zini saqlab, eski saqlangan maydonlarni o'chirib yuboradi. Va update() metodi kabi berilgan maydonlarning o'zinigina yangilab, yangisini kiritib, qolganlarini o'z holatida qoldirmaydi. Yani update metodiga o'xshamagan holda, documentni to'liq qayta yozadi. Shuning uchun barcha kerakli maydonlarni set
metodi ichida berish kerak.
db.collection('foydalanuvchilar').doc({ id: 2 }).set({
id: 4,
ism: 'Jakhongir',
yosh: 27
})
// [
// { id: 1, ism: 'Otabek', yosh: 19 },
// { id: 4, ism: 'Jakhongir', yosh: 27 }
// ]
Diqqat: Agar siz bergan mezon bo'yicha bittadan ko'p documentlar topilsa, misol: .doc({ ism: 'Otabek' })
bo'yicha, unday holatda barcha mos tushgan (topilgan) documentlar o'rnatiladi (qayta yoziladi).
Documentlarning to'plami bo'lgan butun collection o'rnatish
metodi bilan qayta yozish orqali yangilanadi.
db.collection('foydalanuvchilar')
.set([
{
id: 1,
ism: 'Abdulakhad',
yosh: 20
},
{
id: 2,
ism: 'Abdurahmon',
yosh: 14
}
])
// [
// { id: 1, ism: 'Abdulakhad', yosh: 20 },
// { id: 2, ism: 'Abdurahmon', yosh: 14 }
// ]
Collectiondan barcha narsalarni olish. Collection arrayda qaytariladi.
db.collection('foydalanuvchilar').get().then(foydalanuvchilar => {
console.log(foydalanuvchilar)
})
// [
// { id: 1, ism: 'Ahrorxo'ja', yosh: 17 },
// { id: 2, ism: 'Ulugbek', yosh: 18 }
// ]
Collectionni olish va uni ma'lum bir maydon bo'yicha tartiblash (ascending).
orderBy metodi ikkita argument qabul qiladi. Birinchisi, qarab tartiblanishi kerak bo'lgan maydon. Ikkinchisi, tartiblanish uslubi. Tartiblanish uslubi ikki hil: 1. asc (ascending yani yuqoriga) va desc (descending pastga) qarab tartiblash.
db.collection('foydalanuvchilar').orderBy('yosh').get().then(foydalanuvchilar => {
console.log('foydalanuvchilar: ', foydalanuvchilar)
})
// [
// { id: 2, ism: 'Otabek', yosh: 19 },
// { id: 1, ism: 'Abdulaziz', yosh: 47 }
// ]
Collectionni olish va ma'lum bir maydon bo'yicha tartiblash (descending).
db.collection('foydalanuvchilar').orderBy('ism', 'desc').get().then(foydalanuvchilar => {
console.log('foydalanuvchilar: ', foydalanuvchilar)
})
// [
// { id: 2, ism: 'Ulugbek', yosh: 18 },
// { id: 1, ism: 'Ahrorxo'ja', yosh: 17 }
// ]
Collection tartiblash va uni ma'lum miqdordagi documentlar bilan checklash.
db.collection('foydalanuvchilar').orderBy('ism', 'desc').limit(1).get().then(foydalanuvchilar => {
console.log('foydalanuvchilar: ', foydalanuvchilar)
})
// [
// { id: 2, ism: 'Ulugbek', yosh: 18 }
// ]
Collectiondan individual documentni olish
db.collection('foydalanuvchilar').doc({ id: 1 }).get().then(document => {
console.log(document)
})
// { id: 1, ism: 'Abdurahmon', yosh: 14 }
Collectiondan documentni o'chirish.
db.collection('foydalanuvchilar').doc({ id: 1 }).delete()
// [
// { id: 2, ism: 'Abdulaziz', yosh: 34 }
// ]
Diqqat: Agar siz bergan mezon bo'yicha bittadan ko'p documentlar topilsa, misol: .doc({ ism: 'Otabek' })
bo'yicha, unday holatda barcha mos tushgan (topilgan) documentlar o'chiriladi.
Collectionni va undagi barcha documentlarni o'chirib tashlash.
db.collection('foydalanuvchilar').delete()
Ma'lumotlar bazasi va undagi barcha documentlarni o'chirib tashlash.
db.delete()
Sizning documentlaringiz IndexedDB storeda key
bilan saqlanadi:
Odatda, MahalliyBaza bu keylar uchun tasodifiy, tartiblangan, yagona IDlarni yaratadi.
Ammo siz ushbu keylarning (kalitlarning) nomini boshqarishni(o'zgartirishni) xohlashingiz mumkin. Masalan siz:
- Document qo'shganda o'z keyingizni ko'rsatishingiz.
- Uni documentlarni tanlash (olayotganda, yangilayotganda, o'rnatayotganda yoki o'chirayotganda) ishlatishingiz
- Va collectionni olayotganingizda barcha keylarni document maydonlari sifatida qaytarishingiz mumkin. Masalan quyidagidek.
[
{
key: 'kalit-2',
data: {
{ id: 2, ism: 'Abdulaziz', yosh: 34 }
}
},
{
key: 'kalit-1',
data: {
{ id: 1, ism: 'Adxamboy', yosh: 21 }
}
}
]
Siz bularning barchasini MahalliyBaza orqali qilishingiz mumkin:
Document ma'lumotlarini kiritgandan so'ng, ikkinchi parametr sifatida (IndexedDB store tomonidan foydalaniladigan) keyni kiriting kiriting:
db.collection('foydalanuvchilar').add({
id: 1,
ism: 'Otabek',
yosh: 19
}, 'kalit-1')
Yoki, siz shunchaki set
metodini ishlatishingiz mumkin:
db.collection('foydalanuvchilar').doc('kalit-1').set({
id: 1,
ism: 'Abdulakhad',
yosh: 20
})
IndexedDB da quyidagicha ko'rinadi:
To'liq collectionni documentlar arrayi bilan (qayta yozish orqali) o'rnating va har bir document uchun keyni kiriting. `{keys: true}" parametri kiritganingizga ishonch hosil qiling. Bu tanlangan collectionni to'liq qayta yozadi.
db.collection('foydalanuvchilar')
.set([
{
id: 1,
ism: 'Otabek',
yosh: 19,
_key: 'kalit-1'
},
{
id: 2,
ism: 'Ulugbek',
yosh: 18,
_key: 'kalit-2'
}
], { keys: true })
Documentni kalit bilan olish, yangilash, o'rnatish (qayta yozish) yoki o'chirish (document mezonlari o'rniga)
Documentni doc
" metodi bilan tanlayotganda, maydon nomi va qiymati ko'rsatilgan obyekt kiritish o'rniga, shunchaki key bilan string (yoki number) kiriting:
// kalit bilan docuementni olish
db.collection('foydalanuvchilar').doc('kalit-1').get().then(document => {
console.log(document)
})
// documentni key bilan yangilash
db.collection('foydalanuvchilar').doc('kalit-1').update({
ism: 'Abdurahmon'
})
// documentni key bilan o'rnatish
db.collection('foydalanuvchilar').doc('kalit-2').set({
id: 4,
ism: 'Adxamboy',
yosh: 21
})
// documentni key bilan o'chirish
db.collection('foydalanuvchilar').doc('kalit-1').delete()
Collectionni olayotganda, shunchaki { keys: true }
ni get
metodi ichida yozib qo'ying:
db.collection('foydalanuvchilar').orderBy('ism', 'desc').get({ keys: true }).then(foydalanuvchilar => {
console.log('foydalanuvchilar: ', foydalanuvchilar)
})
// [
// {
// key: 'kalit-2',
// data: {
// { id: 1, ism: 'Abdulaziz', yosh: 34 }
// }
// },
// {
// key: 'kalit-1',
// data: {
// { id: 2, ism: 'Otabek', yosh: 19}
// }
// }
// ]
Amallar muvaffaqiyatli bo'lganida yoki xato yuz berganda, barcha operatsiyalarga promise(va'dalar)ni qo'shishingiz va biror narsa bajarishingiz mumkin.
Misol uchun databazaga yangi collection qo'shilganda, u qo'shilganligi haqida browser dev-tools console bo'limida habar chiqarishingiz mumkin.
db.collection('foydalanuvchilar')
.add({
id: 1,
ism: 'Otabek',
yosh: 47
}, 'kalit-1')
.then(response => {
console.log("Qo'shish muavvafaqiyatli amalga oshdi.")
})
.catch(error => {
console.log("Xatolik yuz berdi, qaytadan harakat qilib ko'ring.")
})
// Siz xatoni add() metodi ichida object o'rniga
// string, number yoki boolean yozish bilan
// tekshirib ko'rishingiz mumkin.
db.collection('foydalanuvchilar')
.doc({ id: 1 })
.update({
ism: 'Abdurahmon'
})
.then(response => {
console.log('Yangilash muvaffaqiyatli amalga oshdi.')
})
.catch(error => {
console.log("Xatolik yuz berdi, qaytadan harakat qilib ko'ring.")
})
// Siz xatolikni update() metodi ichiga hech narsa
// yozmaslik orqali tekshirib ko'rishingiz mumkin.
db.collection('foydalanuvchilar')
.doc({ id: 1 })
.set({
id: 1,
ism: 'Ulugbek',
yosh: 27
})
.then(response => {
console.log("O\'rnatish muvaffaqiyatli amalga oshdi.")
})
.catch(error => {
console.log("Xatolik yuz berdi, qaytadan harakat qilib ko'ring.")
})
// Siz xatolikni set() metodi ichiga hech narsa
// yozmaslik orqali tekshirib ko'rishingiz mumkin.
db.collection('foydalanuvchilar')
.doc({ id: 1 })
.delete()
.then(response => {
console.log("O'chirish muvaffaqiyatli amalga oshdi.")
})
.catch(error => {
console.log("Xatolik yuz berdi, qaytadan harakat qilib ko'ring.")
})
// Siz xatolikni doc() metodi ichiga hech narsa
// yozmaslik orqali tekshirib ko'rishingiz mumkin
db.collection('foydalanuvchilar')
.delete()
.then(response => {
console.log("Collection muvaffaqiyatli o'chirildi.")
})
.catch(error => {
console.log("Xatolik yuz berdi, boshqatdan harakat qilib ko'ring.")
})
// Siz xatolikni collection() metodi ichiga hech narsa
// yozmaslik orqali tekshirib ko'rishingiz mumkin
db.delete()
.then(response => {
console.log("Ma'lumotlar bazasi muvaffaqiyatli o'chirildi.")
})
.catch(error => {
console.log("Xatolik yuz berdi, boshqatdan harakat qilib ko'ring.")
})
// Eslatma: ba'zida ma'lumotlar bazasini o'chirib
// tashlaganingizda, sahifani qayta yuklamaguningizcha
// Chrome Dev-tools vositalarida o'zgarish bo'lmaydi
Bundan tashqari, barcha operatsiyalar bilan Async / Await dan foydalanishingiz mumkin
async function qoshish() {
await db.collection('foydalanuvchilar').add({
id: 1,
ism: 'Otabek',
yosh: 19
})
console.log("Birinchi foydalanuvchi qo'shildi")
await db.collection('foydalanuvchilar').add({
id: 2,
ism: 'Abdulaziz',
yosh: 19
})
console.log("Ikkinchi foydalanuvchi qo'shildi")
}
qoshish()
async function yangilash() {
let natija = await db.collection('foydalanuvchilar')
.doc({ id: 1 })
.update({
ism: 'Abdulakhad'
})
console.log(natija)
}
yangilash()
async function ornatish() {
let natija = await db.collection('foydalanuvchilar')
.doc({ id: 2 })
.set({
id: 4,
ism: 'Abdurahmon',
yosh: 14
})
console.log(natija)
}
ornatish()
async function foydalanuvchilarniOlish() {
try {
let foydalanuvchilar = await db.collection('foydalanuvchilar')
.orderBy('yosh')
.get()
console.log('foydalanuvchilar: ', foydalanuvchilar)
}
catch(error) {
console.log('xatolik: ', error)
}
}
foydalanuvchilarniOlish()
// Siz xatolikni collection() metodi ichiga hech narsa
// yozmaslik orqali tekshirib ko'rishingiz mumkin.
Odatda, MahalliyBaza ishlab chiqish (development) variantida quyidagi kabi ajoyib loglarni browserning dev-tools console bo'limida chiqarib boradi:
Siz bu loglarni db.config.debug
boolean maydonigaa false
qiymatini berish orqali o'zgartirishingiz mumkin.
Ma'lumotlar bazasini ishga tushirgandan so'ng va boshqa biror narsa bajarishdan oldin quyidagi kodni kiritish kerak:
import MahalliyBaza from 'mahalliybaza'
let db = new MahalliyBaza('db')
db.config.debug = false
// Buyog'iga databaza bilan biror narsa qilish kerak
Tez kunda... Playground tayyorlanish jarayonida.
Ushbu MahalliyBaza
nomli kutubxona borasida savollar, fikrlar, e'tirozlar, Ushbu reponing issues
bo'limida qoldiring. Shuningdex, xatoliklar bo'lsa, o'zbekcha tarjimalarni yashilash bo'yicha fikrlar bo'lsa ham yuqoridagi issues
bo'limida qoldiring.
Albatta javob beramiz. E'tiboringiz uchun kattakon rahmat.