Doston Dev | IT BLOG
172 subscribers
177 photos
26 videos
3 files
220 links
πŸ—‚ Frontend endi siz o'ylaganchalik uzoqda emas!

πŸ’» Frontend Dasturlash bo'yicha bepul video darslar va foydali IT bloglar sahifasi

πŸ”΄ YouTube: youtube.com/DostonRajabov

πŸ‘₯ Muhokama uchun guruh: @doston_dev_chat

❓Murojaat uchun: @rajabov_doston
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
#foydali_kod
#animation
#css

Snow - yog'ayotgan qor animatsyasini sof CSS animatsiyasi orqali amalga oshirish.

πŸ‘‰ Kod linki

@doston_dev
πŸ’πŸ»β€β™‚οΈ Maktabdan Google gacha... - O'zbek dasturchisining hikoyasi

πŸ‘‰ Maqola

@doston_dev
πŸš€ JavaScript dialog oynalari: alert, prompt, confirm metodlari.

JavaScript da kiritish va chiqarishning 3 standart usuli mavjud:

⚠️ Alert (Ogohlantirish) - matnli dialog oynasini chaqiradi va OK tugmasiga ega.

Misol: alert("Doston Dev kanaliga obuna bo'ling!");

πŸ–Š Prompt (So'rov) - kiritish maydonini o'z ichiga olgan dialog oynasini chaqiradi. Siz satrlar va qiymatlarni kiritishingiz mumkin.

Misol: var userName = prompt("Iltimos, foydalanuvchi nomingizni kiriting:");

βœ… Confirm
(Tasdiqlash) - matn va ikkita tugmachali dialog oynasini chaqiradi: Bekor qilish va OK.

Misol: var result = confirm("Siz Doston Dev kanaliga obuna bo'ldingizmi?");

@doston_dev
⌨ Qanday qilib element chegarasini tasvirga aylantirish mumkin❓

πŸ’πŸ»β€β™‚οΈ CSS da siz istalgan tasvirni istalgan elementning chegarasi sifatida qo'yishingiz mumkin. Oddiy qilib aytganda, siz rasmdan ramka yasashingiz mumkin! Buning uchun border-image xususiyatidan foydalaniladi.

βœ… Bu xususiyat tasvirni butun uzunligi bo'ylab takrorlanishi yoki cho'zilishi kerakligini belgilash imkonini beradi.

🧐 Ushbu misolda tasvir dumaloq qiymat tufayli butun perimetr bo'ylab takrorlanadi.

.border_image {
border: 15px solid transparent;
padding: 20px;
border-image: url(image.png) 40 round;
}

Stretch xususiyati dumaloq xususiyatga qarama-qarshidir, chunki u tasvirni kengaytiradi:

.border_image {
border: 15px solid transparent;
padding: 20px;
border-image: url(image.png) 40 stretch;
}


πŸš€ Rasm URL chaqiruvi yordamida kodga qo'shiladi.

@doston_dev
#foydali_manba

πŸ’πŸ»β€β™‚οΈ OverAPI - Bu barcha mashhur dasturlash tillarining sintaksisi, funktsiyalari va metodlari bo'yicha shpargalkalarning elektron to'plami.

@doston_dev
Forwarded from IT Park Uzbekistan
❓ JavaScript asoslari yoki biznes-tahlili bilan tanishmisiz? πŸ€”

🦾 Tajriba orttirish vaqti keldi!
IT Park rezidenti β€œExadel” JavaScript va biznes-tahlili boΚ»yicha amaliyotchilarni jalb qilmoqda.

πŸ”₯ Muhim: amaliyotni muvaffaqiyatli tugatganingizdan soΚ»ng, β€œExadel” kompaniyasidan ish taklifini olishingiz mumkin.

❔ Qanday talablar bor?
Ingliz
tilini kamida B1 darajasida bilish, hamda, quyidagi koΚ»nikmalarni bilish: https://bit.ly/3HbFwh8

▫️ RoΚ»yxatdan oΚ»tishning oxirgi muddati:
– biznes-tahlilchilar uchun: 2022-yil 4-fevralgacha;
– JavaScript dasturchilari uchun: 2022-yil 6-fevralgacha.

▫️ Amaliyot rus va ingliz tillarida onlayn tarzda oΚ»tkaziladi.

➑️ Roʻyxatdan oʻtish uchun havola: https://forms.gle/FkmwVT8zBNz8Q77v8
πŸŒ€ JavaScript darslari | Array methods (25-dars)

Assalom-u alaykum hurmatli obunachilar !!!

Bugungi video darsimizda eng ko'p ishlatiladigan Array methods lari bilan tanishib chiqamiz !!!

πŸ‘‰ Videoga o'tish


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

πŸ‘‰ Telegram | YouTube | Instagram
⌨ JavaScriptda find() metodi

find() metodi - funksiyaga berilgan shartni qanoatlantiradigan massivda topilgan birinchi elementning qiymatini qaytaradi. Aks holda, undefined qiymati qaytariladi, masalan, massivda bunday element bo'lmasa.

🧐 Keling, uchta ob'ektni o'z ichiga olgan massiv yarataylik:

const arr = [
{ id: 1, name: "Abbos" },
{ id: 2, name: "Ozodbek" },
{ id: 3, name: "Asadbek" },
]


πŸ’πŸ»β€β™‚οΈ Uchinchi elementni topish uchun find() metodidan foydalanamiz:

arr.find(element => element.id === 3)
// Natija: {id: 3, name: "Asadbek"}

πŸ’πŸ»β€β™‚οΈ Endi esa 7-raqamli elementni qidiiramiz va hech narsa topilmaydi, chunki u mavjud emas:

arr.find(element => element.id === 7)
// Natija: undefined


@doston_dev
πŸŒ€ JavaScript darslari | Array sort (26-dars)

Assalom-u alaykum hurmatli obunachilar !!!

Bugungi video darsimizda JavaScriptda massivlarni saralash metodlari bilan tanishib chiqamiz !!!

Darsimiz foydali bo'ladi degan umiddaman...

πŸ‘‰ Videoga o'tish

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

πŸ‘‰ Telegram | YouTube | Instagram
#foydali #js

undefined vs null

undefined
- e'lon qilingan o'zgaruvchi uchun mavjud, lekin u uchun hech qanday qiymat o'rnatilmagan.

null - o'zgaruvchiga aniq tayinlangan bo'sh yoki mavjud bo'lmagan qiymatni bildiradi.

πŸ’πŸ»β€β™‚οΈ "undefined" va "null" qat'iy taqqoslaganda teng emas.

βœ… Ushbu ikki qiymat o'rtasidagi farq haqida ko'proq ma'lumotni ushbu maqoladan o'qishingiz mumkin.

@doston_dev
#foydali_kod #js

Satrlarni birlashtirishda "+" operatoridan foydalanishni unuting, shablon satrlari (literal) orqali buni oson hal qilish mumkin

πŸ“Š "+" operatori bilan satrlarni birlashtirish eski usullardan biri hisoblanadi. Bundan tashqari, ko'p sonli o'zgaruvchilarni (yoki ifodalarni) o'z ichiga olgan qatorlarni birlashtirishda bu usuldan foydalanish chalkashlik va xatolar xavfini oshiradi.

πŸ’πŸ»β€β™‚οΈ Shablon satrlaridan foydalanish esa o'zgaruvchilarni bevosita matnga kiritish imkonini beradi. Ular o'ziga xos sintaksisga ega, bunda qator orqa tirnoqlarga (``) kiritilgan. Shablon qatori dinamik qiymatlarni almashtirish uchun joylarni o'z ichiga olishi mumkin. Bunday joylar dollar belgisi va jingalak qavslar bilan belgilanadi. Masalan, ${expression}.

@doston_dev
Qiziqarli qisqa savol-javob

Yuqoridagi dasturda console name lar qanaqa ketma-ketlikda chiqadi
Anonymous Quiz
33%
Alex,Devin,Eagle Sam
19%
Sam,Eagle,Devin,Alex
33%
Eagle,Sam,Devin,Alex
15%
Eagle,Sam,Alex,Devlin
πŸŒ€ JavaScript darslari | Array methods (every, some, filter) (27-dars)

Assalom-u alaykum hurmatli obunachilar !!!

Bugungi video darsimizda eng ko'p ishlatiladigan every, some, filter kabi Array metodlari bilan tanishib chiqamiz !!!

πŸ‘‰ Videoga o'tish


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

πŸ‘‰ Telegram | YouTube | Instagram
πŸš€ Assalom-u alaykum hurmatli obunachilar !!!

Yaqinda iSystem IT academy da mentor sifatida faoliyatimni boshladim. Agar siz ham dasturlashning Front-end sohasiga qiziqsangiz unaqada bu imkoniyat aynan siz uchun. iSystem IT academy tomonidan tashkil etilgan Front-end kursiga qabul boshlandi. Ushbu kurs davomida siz dasturlashning Front-end yo'nalishi bo'yicha yetarlicha bilim va malakaga ega bo'lishingiz mumkin.

Kurs bo'yicha ma'lumot

πŸ—“ Kurs davomiyligi: 5 oy
πŸ•’ Kurs vaqti: Haftada 3 marta (2 soat)

Juft kunlari: (19:00-21:00)
Toq kunlari: (09:00-11:00)

πŸ’πŸ»β€β™‚οΈ Agar sizda ulkan maqsadlar va kuchli shijoat bo'lsa unda biz bilan harakatni boshlang!

☎️ +998998826060
+998998846060

πŸ—’ Ro'yxatdan o'tish

πŸ“ Manzil

@doston_dev
JavaScript reduce() metodi

reduce() metodi -
massiv elementi uchun reduktor funksiyasini bajaradi va bitta qiymatni ya'ni funksiyaning hisoblagan natijasini qaytaradi. reduce() metodi massivning bo'sh elementlari uchun funksiyani bajarmaydi va asl elementlar qatorini uzgartirmaydi.

✍🏻 Sintaksis

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

function() - (majburiy) Massivdagi har bir element uchun bajariladigan funksiya.

βœ… Reduktor funksiyasi parametrlari:

▫️total - (majburiy) Boshlang'ich qiymat yoki funktsiyaning avval qaytarilgan qiymati.
▫️currentValue - (majburiy) Joriy elementning qiymati.
▫️currentIndex - (ixtiyoriy) Joriy element indeksi.
▫️arr - (ixtiyoriy) Joriy element tegishli massiv.


πŸ’πŸ»β€β™‚οΈ Misol: Massivdagi barcha raqamlarni ayirish

const numbers = [175, 50, 25];

function myFunc(total, num) {
return total - num;
}

let result = numbers.reduce(myFunc);
console.log(result);

// Dastur natijasi: 100

@doston_dev
πŸŒ€ JavaScript darslari | Array methods (reduce) (28-dars)

Assalom-u alaykum hurmatli obunachilar !!!

Bugungi video darsimizda eng ko'p ishlatiladigan reduce() Array metodi bilan tanishib chiqamiz !!!

Darsimiz foydali bo'ladi degan umiddaman...

πŸ‘‰ videoga o'tish

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

πŸ‘‰ Telegram | YouTube | Instagram
πŸš€ Underscore.js β€” qulay JavaScript kutubxonasi

Underscore.js 100 dan ortiq funksiyalarga ega ajoyib dasturchi vositadir. Kutubxonadan to'plamlar bilan ishlash kabi standart vazifalarni bajarish, shuningdek, shablonlarni tuzish va ob'ektlarning tengligini tekshirish uchun foydalanish mumkin.

πŸ’πŸ»β€β™‚οΈ Kutubxonada to'plamlar bilan ishlashning ko'plab metodlari mavjud, masalan: every(), map(), partition(), shuffle(), find(), reduce(), filter(), pluck().

πŸ’πŸ»β€β™‚οΈ Underscore.js massivlar bilan ishlash uchun ham juda mos keladi, buning uchun u first() , flatten() , zip() , object() metodlariga ega.

βœ… Underscore.js xuddi boshqa kutubxonalar kabi - <script> tegi yoki Node.js orqali o'rnatiladi: npm install underscore.

@doston_dev