📊 Nimaga IT olamida xatolar bag (bug — hasharot) deb ataladi❓

Afsonaga qaraganda 1947-yilning 9-sentyabrida Harward universitetida, Greys Myurrey Xopper Mark II Aiken Relay Calculator qurilmasini tekshirayotgan vaqtida xatolikka duch keladi. Keyinchalik aniqlanishi boʻyicha qurilma sxemasida kapalak yopishib qolgan boʻladi. Greys sxemadan hasharotni olayotgan payti xonaga zobit kirib kelib, undan nima qilayotganini soʻraydi. U kompyuterni hasharotlardan tozalayotganini aytadi (ingliz tilida: debugging). Oʻsha paytdan beri dasturlashda xatolar — bug, xatolarni tuzatish esa debugging deb ataladi.

Siz buni bilarmidingiz?

〽️anba: IT Planeta


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 BOOTSTRAP darslari | MODAL VA TAB (9-dars)


👉 Videoga o'tish


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

#foydali_kod
#html
#css
#animation

✨ CSS bilan morfing

CSS da animatsiya orqali so'zlarni o'zgartirish

👉 Kod linki

@doston_dev

🌀 BOOTSTRAP darslari | BOOTSTRAP 5 SCROLLSPY VA OFFCANVAS (10-dars)


👉 Videoga o'tish


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🗂 Plagin nima ❓

Plagin - ( inglizcha "plug in" - "ulanish uchun") mustaqil ravishda kompilyatsiya qilingan dasturiy ta'minot moduli bo'lib, asosiy dasturga dinamik ravishda ulangan va uning imkoniyatlarini kengaytirish yoki ishlatish uchun mo'ljallangan. Plaginlar odatda umumiy kutubxonalar sifatida ishlaydi.

Plaginlarni ulash imkoniyatiga ega bo'lish uchun asosiy dasturni ishlab chiquvchisi unda ba'zi dasturiy interfeyslarni ta'minlashi kerak. Ba'zi ilovalarda plaginlarni foydalanuvchi qo'shimcha ravishda sozlashi mumkin.

Plaginlar frontend dasturlashda ham juda muhim hisoblanadi. Buni hisobga olgan holda navbatdagi darslarimiz ham aynan Frontend dasturchi uchun kerak bo'lgan ayrim plaginlarni ilovalarimizda foydalanish bo'yicha bo'ladi.

Bizni kuzatishda davom eting !!!

👉 @doston_dev

🌀 OWL-CAROUSEL plagini haqida ...

Veb ilovalarni ishlab chiqishda biz ko'pincha rasm slayderini, bannerni yoki mahsulot karuselini yaratishga to'g'ri kelamiz. Ushbu vazifalarni bajarish uchun bizga juda ham mashhur bo'lgan jQuery plagini Owl Carousel yordamga keladi.

Plagin juda ko'p sonli sozlamalarga ega, u turli xil ekran o'lchamlari uchun moslashtirilgan, barcha zamonaviy brauzerlar bilan mos keladi (va ko'plab eskirgan, ammo hali ham foydalaniladi).

OWL Carousel Slider - veb ilovalar yaratish uchun moslashtirilgan va to'liq sezgir Carousel Slider plaginidir. Ushbu Carousel Slider plaginini saytingizning istalgan joyida slayder ko'rsatish mumkin.

Qisqa kod yordamida sozlash uchun siz 40 dan ortiq parametrlardan foydalanishingiz mumkin, bu uni juda konfiguratsiya va foydalanuvchilar uchun qulay qiladi. Siz saytingizda OWL Carousel slayderini har qanday qarama -qarshiliksiz ishlatishingiz mumkin.

OWL Carousel slayderi shuningdek, video galereyalarni ko'rsatishga yordam beradigan YouTube yoki Vimeo videolarini ham qo'llab-quvvatlaydi.

✨ Plagin bir qancha yangi xususiyatlarni o'z ichiga oladi:

🟡 Ko'rsatiladigan slaydlar elementini qurilma kengligi bo'yicha boshqarish (ko'rish porti).

🟠 Bir sahifada bir nechta misollar.

🟣 Navigatsiyani surish imkoniyati.

🔵 Infinity Slaydlar loopi.

🔴 YouTube/Vimeo videolarini qo'llab-quvvatlash.

✨ Boshqa mavjud xususiyatlari:

⚡️Tez va sezgir slaydlar.
⚡️Kuchli administrator sozlamalari
⚡️Slayder maydoni uchun fon tasviri va rangi.
⚡️Qisqa kodli tizim.
⚡️Slayder vidjeti.
⚡️To'liq javob beradigan va mobil versiyasi tayyor.
⚡️Kuchli sozlamalar variantlari paneli
⚡️Bir marta bosish bilan qisqa kod tugmasi.
⚡️Owl karusel variantlari.
⚡️Yoqilgan navigatsiyani bosish imkoniyati.
⚡️Sichqonchani sudrab o'tish yoqilgan.
⚡️Qisqa kodni qo'llab-quvvatlash
⚡️Maxsus xabar turi slayder.
⚡️Tasvirlar / Videolar / Tavsiflarni qo'llab-quvvatlash.
⚡️Juda Yengil.
⚡️O'rnatish va ishlatish oson.
⚡️To'liq tarjima qilish mumkin
⚡️Istalgan joyda cheksiz slayder.
⚡️Sof CSS yoki LESS bilan tahrirlanadigan uslublar
⚡️Yaxshi tashkil etilgani osongina sozlash imkonini beradi.


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 PLUGINS | OWL-CAROUSEL (1-dars)


👉 Videoga o'tish


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

📊 Barchaning sevimli grafik kutubxonasi ...

Highcharts - zamonaviy SVG-ga asoslangan, ko'p platformali diagramma kutubxonasi. Bu web va mobil loyihalarga interaktiv jadvallar va diagrammalarni qo'shishni osonlashtiradi. U 2009 yildan beri faol ishlab chiqilmoqda va mustahkam xususiyatlar to'plami, foydalanish qulayligi va puxta hujjatlar tufayli ishlab chiquvchilarning sevimlisi bo'lib qolmoqda.

Highchartning barcha diagramma kutubxonalari har qanday ma'lumotlar bazasi yoki serverlar to'plami bilan ishlay oladi. Ma'lumotlar istalgan shaklda, jumladan CSV, JSON yoki yuklangan va yangilangan jonli shaklda berilishi mumkin. .Net, PHP, Python, R va Java, shuningdek, iOS va Android kabi eng mashhur tillar uchun frameworklar hamda Angular, Vue va React kabi JavaScript frameworklari Highcharts hamjamiyatida mavjud.

Highcharts ko'rish qobiliyati zaif foydalanuvchilar va faqat klaviatura navigatsiyasiga ega foydalanuvchilar uchun sanoatning eng murakkab foydalanish imkoniyatini qo'llab-quvvatlaydi.

👉 @doston_dev

🌀 PLUGINS | HIGHCHARTS (2-dars)


👉 Videoga o'tish


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

♨️ AOS JS - sahifani aylantirishda scroll animatsiyasi bilan ishlash kutubxonasi ...

Frontend dasturchilari web ilovalarni ishlab chiqishda ko'pincha mijozlar saytga ajoyib effektlarni - sahifani aylantirishda ya'ni sahifada scroll yuzaga kelganda animatsiyani amalga oshirishni so'rashlari bilan duch kelishadi. Ha, albatta, siz CSS-da bunday effektlarni o'zingiz yaratishingiz mumkin, lekin munosib animatsiya qilish uchun bir necha soat vaqt sarflaganingizga to'g'ri keladi. Ammo xavotirga o'rin yo'q. Bu maqsadlar uchun ko'plab tayyor kutubxonalar allaqachon yaratilgan va eng yaxshilaridan biri bu Animate On Scroll yoki AOS js.

AOS js sahifa pastga va yuqoriga aylantirganda ya'ni scroll hosil qilinganda elementlarni jonlantirishga ya'ni turli effektlarni hosil qilishga imkon beradi. Yuqoriga qaytsangiz, elementlar avvalgi holatiga jonlanadi va pastga aylantirsangiz, elementlar yana jonlantirishga tayyor bo‘ladi.

👉 @doston_dev

🌀 PLUGINS | AOS - Animate on scroll (3-dars)


👉 Videoga o'tish


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🗂 Sassy Cascading Style Sheets (SCSS)

SCSS - bu CSS-da kompilyatsiya qilingan preprocessor tili. Bu SASS ning maxsus turi (Syntactically Awesome Style Sheets). SCSS-ning senariysi Saasscript-da amalga oshiriladi. SCSS CSS-ning barcha xususiyatlarini o'z ichiga oladi, shuningdek, qo'shimcha xususiyatlarga qo'shimcha ravishda qo'shiladi.


SCSS-dan foydalanib, biz CSS-ga ko'plab qo'shimcha funktsiyalarni qo'shishimiz mumkin, masalan, o'zgaruvchilar, joylashtirish va boshqalar. Ushbu qo'shimcha funktsiyalarning barchasi an'anaviy CSS-ni yozish bilan taqqoslaganda CSS-ni yozishni ancha osonlashtirishi va tezlashtirishi mumkin.
SCSS an'anaviy CSS-ni ishlab chiqaradi. SASS yoki SCSS-da kodni o'qish CSS-da o'qishdan tezroq.

❗️SASS va SCSS ularning sintaksisiga nisbatan yagona farqi - bu chiziqning ishlatilishidir {}. Boshqacha qilib aytganda, SCSS tarkibi SASSdan boshqa narsa emas.

✅ SCSS ning afzalliklari

✨ Bu sizga dastur tuzilishida toza, oson va kam CSS yozishni osonlashtiradi.

✨ Unda kamroq kodlar mavjud, shuning uchun siz CSS-ni tezroq yozishingiz mumkin.

✨ U juda yaxshi hujjatlarga ega, ya'ni barcha kerakli ma'lumotlarni Internet orqali olishingiz mumkin.

✨ Ichki sintaksisdan va ranglarni boshqarish, matematik funksiyalar va boshqa qiymatlar kabi foydali funksiyalardan foydalanishingiz uchun OSON.

✨ U CSS-ning barcha versiyalari bilan mos keladi. Shunday qilib, siz istalgan mavjud CSS kutubxonalaridan foydalanishingiz mumkin.

✨ U CSS-dagi qiymatlarni istagancha qayta ishlatishga yordam beradigan o'zgaruvchilardan iborat.

✨ Sintaksisni ajratib ko'rsatish keng qo'llaniladigan CSS vositasi va SCSS-da qo'llab-quvvatlanadi. SCSS sizga mavjud koddan foydalanishga imkon beradi va kodning tashqi harakatlarini o'zgartirmasdan uning ichki tuzilishini yaxshilashga yordam beradi.

⚠️ SCSS ning kamchiliklari

⚡️Nosozliklarni tuzatish - Dastlabki protsessorlarda kompilyatsiya bosqichi mavjud, bu esa kodni disk raskadrovka qilishga urinishda CSS-dagi kod satrlarini ahamiyatsiz qiladi. Ammo disk raskadrovka dasturlashdan ikki baravar qiyin va bu juda katta kamchiliklar mavjud.

⚡️Katta CSS fayllari - Manba fayllari kichik bo'lishi mumkin, ammo yaratilgan CSS ulkan bo'lishi mumkin, bu esa SCSS ga qiyinchilik olib keladi.

⚡️Tushunish - Dastlabki protsessorlar keng tarqalib ketgan bo'lsa ham, CSS-da bilimlar mavjud. Asbobni tushunish va undan samarali foydalanish o'rtasida katta farq bor.

⚡️Rivojlanish - kompilyatsiya mavjud bo'lgan eng yaxshi vositalardan foydalangandan keyin ham rivojlanishni sekinlashtirishi mumkin.

⚡️Foyda yo'qotish - SASS-dan foydalanish brauzerning ichki elementlari inspektorining afzalliklarini yo'qotishiga olib kelishi mumkin.


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 SASS darslari

Sass - bu CSS-ga kompilyatsiya qilingan uslublar jadvali tili. Bu sizga o'zgaruvchilardan, o'rnatilgan qoidalardan, miksinlardan, funktsiyalardan va boshqalardan foydalanishga imkon berad.

🟢 Sass CSS-ning barcha versiyalari bilan to'liq mos keladi. Sass boshqa CSS kengaytma tillariga qaraganda ko'proq xususiyat va qobiliyatlarga ega.

🟣 Sass katta uslublar jadvallarini yaxshi tartibga solishga yordam beradi va dizaynni loyihalar ichida va loyihalar bo'ylab almashishni osonlashtiradi.

🟠 Sass bir nechta texnologik kompaniyalar va yuzlab dasturchilar tomonidan faol qoʻllab-quvvatlanadi va ishlab chiqiladi.

Xullas bugungi navbatdagi darsimizda Sass ning barcha xususiyatlari haqida batafsil fikr yuritamiz.

👉 Videoga o'tish


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

#Portfolio_uchun
#Maket
#Amaliyot
#Figma

Assalom-u alaykum hurmatli obunachilar !!!

Mana HTML, CSS, Bootstrap, Sass, Scss darslarini ham yakunlab oldik. Endi shu kungacha egallagan bilimlarimiz, Bootstrap va SCSS orqali web saytlarning web dizaynerlar tomonidan yaratilgan maketidan foydalangan holda responsive web sahifalarni shakllantiramiz.

Bu amaliyot darslarimizda biz quyidagi Davlat Test Markazi ning web-sahifa maketidan foydalanishga qaror qildik. Amaliyot darslarimiz davomida ushbu web sahifa maketini responsive ko'rinishda "jonlantiramiz".

🗂 Veb sahifa maketi

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 HTML, BOOTSTRAP, SASS | NAVBAR AMALIYOT (1-QISM)

Amaliyot darslarimizning quyidagi ilk darsi davomida web sahifaning NAVBAR qismini shakllantiramiz.

👉 Videoga o'tish

🗂 Veb sahifa maketi


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 HTML, BOOTSTRAP, SASS | HEADER AMALIYOT (2-QISM)

Amaliyot darslarimizning navbatdagi darsi davomida web sahifaning HEADER qismini shakllantiramiz.


👉 Videoga o'tish

🗂 Veb sahifa maketi


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 HTML, BOOTSTRAP, SASS | MAIN AMALIYOT (3-QISM)

Amaliyot darslarimizning quyidagi ilk darsi davomida web sahifaning MAIN qismini shakllantiramiz.


👉 Videoga o'tish

🗂 Veb sahifa maketi


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

#foydali_kod
#html
#css
#animation

✨ Turli effektlarga ega 100 dan ortiq veb-sayt tugmalari

👉 Kod linki

@doston_dev

🌀 HTML, BOOTSTRAP, SASS | SECTIONS AMALIYOT (4-QISM)

Amaliyot darslarimizning navbatdagi qismida web sahifaning bir nechta bo'limlari SECTION larni shakllantirishni ko'rib chiqamiz.


👉 Videoga o'tish

🗂 Veb sahifa maketi


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 HTML, BOOTSTRAP, SASS | FOOTER AMALIYOT (5-QISM)

Amaliyot darslarimizning so'nggi qismi davomida web sahifaning FOOTER qismini shakllantiramiz va loyihani yakunlaymiz.


👉 Videoga o'tish

🗂 Veb sahifa maketi


〽️ Biz siz uchun darslarni tayyorlamoqdamiz. Siz ham bizni qo'llab quvvatlab yuborasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram