〽️ Internet axborot saytlarida «O‘zbekistonda Axborot texnologiyalari sohasida oylik ish haqi 7 million so‘mdan 11 million so‘mgacha bo‘lgan ish taklif qilinmoqda» degan e’lon tarqaldi. Ushbu e’lon aholimizning ish izlayotgan va izlamayotganlarda ancha katta qiziqish va munozaralarga sabab bo‘ldi. Albatta, nisbatan katta maosh to‘lanadigan bunday ishga davlat idoralari tomonidan rasmiy ravishda e’lon berilishi ish izlayotgan, ko‘proq daromad qilishni xohlayotgan fuqarolarning e’tiborini tortdi.

Ushbu o‘ziga xos shov-shuvli e’lon ko‘pchilikda «programmist», «dasturchi», «developer» degan kasblar haqida izlanish va tushunchalar shakllanishiga sabab bo‘ldi. Nima uchun ularga bunday yuqori maosh to‘lanishi, bu sohani biladigan mutaxassislarga talab yuqoriligi haqida umumiy ma’lumotga ega bo‘lishdi.

Axborot texnologiyalari sohasidan uzoqroq bo‘lgan insonlarda «bu kasbni egallash qiyin, «mening mutaxassisligim umuman boshqaku, «yoshim o‘tib qoldi, endi kech» kabi fikrlar tug‘ilishi tabiiy. Lekin, dasturchilik haqida internetdan maqolalarni qidirib o‘qilsa fikrlar ijobiy tomonga o‘zgaradi va dasturchilikni o‘rganishga ishtiyoq paydo bo‘ladi. To‘g‘ri, balki kelajakda kuchli dasturchi, professional developer bo‘lmasligi mumkindir, lekin, Frontend texnologiyalarini boshlang‘ich darajada yaxshi o‘rganishining o‘ziyoq ilmiy-ijodiy va biznes g‘oyalarini rivojlantirish uchun katta imkoniyatlar eshigini ochadi. Bu haqida RealNetworks asoschisi Rob Glaser ham ajoyib fikr bildirib o'tgan -

« Hayotingizda tanlagan yo'lingiz qanday bo'lishidan qat'i nazar - rassom,injener,huquqshunos,o'qituvchi, yoki hatta siyosatchi bo'lamizmi, farqi yo'q, agar siz kod yozish, dasturlashni bilib olsangiz, o'zingizga katta imkoniyatlar eshigini ochasiz »

Axborot olamining cho‘qqilari bo‘lgan Microsoft, Apple, Google, Facebook, Amazon, Alibaba kabi kompaniyalarning dunyoga kelishi ham oddiy qiziqish va ishtiyoqning samarasidir.

🌀 Frontend - Bu o‘zi nima va yuqoridagi gaplarga buning nima bog‘liqligi bor?» dersiz, bu savolingizga keyingi maqolada javob topasiz degan umiddamiz !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

#Frontend

🗂 Frontend dasturlash nima ❓

🌀 Frontend - «tashqi interfeys degan ma’noni bildirib, veb texnologiyalarning biridir. Bu texnologiya yordamida veb sahifalarning insonga ko‘rinib turuvchi, ma’lumot beruvchi vizual qismi yaratiladi. Frontend texnologiyalarini o‘rgangan inson o‘z ijodkorligi, kretiv yondoshuvi orqali turli g‘oyalarini veb sahifalar, dasturlar shaklida ro‘yobga chiqarishi mumkin bo‘ladi.

Bugungi kunda shaxsiy veb sahifaga ega bo‘lish o‘ziga xos elektron vizitka, passport vazifasini bajaribgina qolmay, balki sayt orqali ko‘plab foydali ishlarni amalga oshirish mumkin bo‘lib qoldi. Masalan, jurnalist, shoir, yozuvchi o‘z ijodi va izlanishlarinini veb sahifasi orqali yoritib borishi mumkin. Tadbirkor o‘z sahifasida mahsulot va xizmatlarini keng targ‘ib qilishi va daromadini oshirishi mumkin.

〽️ Umumiy qilib aytadigan bo‘lsak Frontend texnologiyalarini o‘rganish - internet xazinasining kalitini qo‘lga kiritish demakdir, bu xazinadan xohlagan narsangizni olishingiz, foydalnishingiz, boshqarishingiz mumkin.


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🗂 Frontend dasturlashni o'rganishni nimadan boshlash kerak ❓

🌀 Frontend dasturlash sohasi bir necha til va texnologiyalarni o‘z ichiga oladi. Uning asoslari HTML, CSS va JavaScriptdir. Vaqt davomida saytlarning ko‘rinishi va ishlashiga bo‘lgan sifat talabi o‘sishi tufayli shu texnologiyalar asosida bir qancha freymvork va kutubxonalar tuzib chiqilgan. Ulardan ko‘zlangan asosiy maqsad sayt tuzishga ketadigan vaqtni qisqartirishdir. CSS asosida Less, Less oldindan ishlov beruvchi (preprotsessor), foydalanuvchi interfeysini tuzishda yordam beruvchi Bootstrap va Tailwind kabi freymvorklari tuzilgan bo‘lsa, JavaScript asosida hozirgi kunda trendda bo‘lgan Angular, Vue freymvorklari va React kutubxonalari tuzib chiqilgan. Malakali frontend dasturchilarga dunyoning ko‘plab davlatlarida talab bor. Ularning bilimi va tajribasiga qarab turlicha ish haqi to‘lanadi. Bugungi kunda O‘zbekistonda malakali frontend dasturchilar oyiga o‘rtacha 300$ dan 1000$ gacha o‘rtacha daromad topishlari mumkin. Quyida frontend dasturlash sohasiga kiruvchi til va texnologiyalar haqida batafsil ma’lumot berib o‘tamiz.

🔵 HTML va CSS

HTML va CSS veb sahifalar asosini tashkil qiladi. HTML saytda aynan nimalar joylashishi kerakligiga mas’ul bo‘lsa (matn, rasm, video), CSSda ularning qaysi tartibda joylashuvi va qanday ko‘rinishda bo‘lishi yozib chiqiladi. Sayt foydalanuvchilarga ko‘rinadigan elementlar HTML va CSSda tuzilgani uchun bu ikkisisiz sayt tuzib bo‘lmaydi. Shuning uchun ham frontend sohasini o‘rganish aynan shu texnologiyalardan boshlanadi.

🔴 JavaScript va jQuery

JavaScript ham yuqorida aytib o‘tilgan texnologiyalar kabi frontend dasturlashning ajralmas qismidir. JavaScript brauzerlarda ishlovchi dasturlash tili bo‘lib, u bilan veb sahifaga interfaollik imkoniyatini berish mumkin. Misol uchun biron tugma bosilganda yoki foydalanuvchi saytning biror qismiga kelganda yangi oyna ochilishi yoki biron xabar ko‘rinishi. Birmuncha vaqt oldin sayt elementlariga interfaollik qo‘shishda JavaScriptning o‘zidan foydalanish dasturchi uchun nisbatan qiyin bo‘lgan, ba’zi vazifalarni bajarishning imkoni bo‘lmagan. O‘sha vaqtda jQuery kutubxonasi tuzilgan bo‘lib, u yordamida dasturchi JavaScript tilida mavjud bo‘lmagan imkoniyatlardan qulay yo‘l bilan foydalana olgan. Hozirgi kunda JavaScriptda jQuery kutubxonasi kiritgan yangiliklar tatbiq qilingan bo‘lsada, dasturchilar jQueryni ishlatishni tashlab qo‘yishgani yo‘q. Statistikaga ko‘ra JavaScript 2017 yilning eng ommalashgan dasturlash tili deb tan olindi.

🟢 Less va Sass

Less va Sass oldindan ishlov beruvchi freymvorklari CSS asosida yaratilgan bo‘lib, dasturchilar uchun CSS bilan ishlashda anchagina qulayliklar va qo‘shimcha imkoniyatlarni yaratib beradi. Uning yordamida sayt tuzishga ketadigan vaqt tejaladi, nisbatan kamroq kod yozish mumkin bo‘ladi.

🟣 Bootstrap, Materialize, Foundation va boshqa CSS freymvorklar

Bu freymvorklar dasturchiga deyarli tayyor ko‘rinishdagi sayt elementlarini taklif qiladi. Ular yordamida odatda ko‘p ishlatiladigan elementlarni bir necha daqiqalar ichida tuzish mumkin. Ularning har biri o‘ziga xos stildagi elementlarga ega. Material va yassi stillar ham shular jumlasidandir. Hatto saytni qog‘ozda qo‘lga chizilgandek ko‘rinishga keltiradigan freymvork ham bor - http://www.getpapercss.com.


🟠 AngularJS, ReactJS va VueJS

AngularJS, ReactJS va VueJS JavaScript dasturlash tiliga asoslangan bo‘lib, ular yordamida veb saytlarni yanada takomillashtirish, qo‘shimcha imkoniyatlar qo‘shish va bu o‘zgartirishlarni dasturchi o‘ylagandan ham oson usulda amalga oshirish mumkin. Agar siz HTML, CSS, Bootstrap va JavaScriptni biladigan frontend dasturchi bo‘lsangiz, bugungi kunda yurtimizda oyiga o‘rtacha 100$ dan 300$ gacha daromad topishingiz mumkin. Bordiyu siz yuqorida sanab o‘tilganlardan tashqari AngularJS, ReactJS va VueJS texnologiyalaridan birini bilsangiz, sizning o‘rtacha oylik daromadingiz 400$ dan 600$ gacha bo‘lishi mumkin. Bu daromad albatta nisbiy olingan. Veb dasturchilarning daromadi odatda ularning bilim darajasi va tajribasi bilan belgilanadi.

@doston_dev

🗂 Frontend developer egallashi kerak bo‘lgan qo‘shimcha bilimlar va ko‘nikmalar:

⚡Veb dizayn va mobil dizayn. Frontend dasturchi veb va mobil dizayn bo‘yicha boshlang‘ich ma’lumotga ega bo‘lishi va dizaynning mazmunini tushunishi lozim. Bu ularga saytni chiroyli hamda qulay ko‘rinishga keltirishda qo‘l keladi.

⚡ Adobe Photoshop yoki Sketchda ishlash ko‘nikmasiga ega bo‘lishi lozim. Frontend dasturchi rasm ko‘rinishidagi sayt dizaynini kodga o‘tkazadi. Shu ish mobaynida grafik tahrirlash dasturlari bilan ishlash saytning rasm ko‘rinishidan kerakli elementlari ishlatish uchun ajratib olish uchun zarur.

⚡ Git texnologiyasini bilishi va unda ishlay olishi lozim.

⚡ Veb dasturlashning yana bir asosiy qismi bekend sohasi ishlash prinsipini bilishi lozim. Frontend dasturchi ma’lumotlar bazasidan kelayotgan ma’lumotlar bilan ishlay olishi lozim.

⚡ Frontend dasturchi veb dasturlarni test qilish texnologiyasi bilan tanish bo‘lishi va bilishi lozim.

⚡ Eng muhim ko‘nikmalardan biri o‘z ustida doimiy ishlash va boshqalarning xatosidan to‘g‘ri xulosa chiqarishdir.

Ushbu maqolamizdan frontend texnologiyasi haqida umumiy ma’lumot oldingiz va sizda veb sayt yaratilishi bo‘yicha ilk tasavvurlar shakllandi, deb o‘ylayman. Agar sizda frontend dasturlashga qiziqish paydo bo‘lgan bo‘lsa va o‘rganishni istasangiz bizni kuzatishda davom eting va FRONTEND DEVELOPMENT darslarimizni kuzatib boring !!!

@doston_dev

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

#Doston_Dev
#Web_dasturlash
#Frontend

🗂 Frontend dasturlash endi siz o'ylaganchalik uzoqda emas. Frontend dasturlashni mustaqil ravishda bepul va sifatli videodarslar orqali o'rganing !!!

Bugungi ilk video darsimizda Telegram va YouTube kanallarimizda olib boriladigan "FRONTEND DEVELOPMENT" darslari haqida batafsil ma'lumot olishingiz mumkin.

👉 Videoga o'tish


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


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

#HTML

HTML nima ❓

Gipermatnni belgilash tili asoslari asosida tushuntirilgan Gipermatnni belgilash tili (HTML) - ko'pgina veb-sahifalar va onlayn ilovalarni tashkil etuvchi kompyuter tili hisoblanadi. Gipermatn - bu matnning boshqa qismlariga havola qilish uchun ishlatiladigan matn, belgilash tili esa veb-serverlarga hujjatning uslubi va tuzilishini bildiradigan belgilar qatoridir.

HTML dasturlash tili hisoblanmaydi, chunki u dinamik funktsiyalarni yaratolmaydi. HTML yordamida veb foydalanuvchilar elementlar, teglar va atributlar yordamida bo'limlar, paragraflar va havolalarni yaratishi va tuzishi mumkin.

Ushbu maqolada HTML asoslari, shu jumladan uning qanday ishlashi, uning ijobiy va salbiy tomonlari, CSS va JavaScript bilan qanday aloqasi borligi muhokama qilamiz.

🎯 HTML evolyutsiyasi - HTML va HTML5 o'rtasidagi farq nima?

HTMLning birinchi versiyasi 18 ta tegdan iborat edi. O'shandan beri har bir yangi versiya yangi teglar va atributlarga qo'shildi. Hozirgi kunga qadar tilning eng muhim yangilanishi bu 2014 yilda HTML5 ning joriy qilinishi edi.

HTML va HTML5 o'rtasidagi asosiy farq shundaki, HTML5 formalarni boshqarishning yangi turlarini qo'llab -quvvatlaydi. HTML5 shuningdek, <article>, <header> va <footer> kabi tarkibni aniq tasvirlash mumkin bo'lgan bir nechta semantik teglarni ham taqdim etdi.

🎯 HTML ning afzalliklari va kamchiliklari

Boshqa har qanday kompyuter tili singari, HTML ning ham kuchli va cheklangan tomonlari bor. HTML ning ijobiy va salbiy tomonlari:

🟢 Afzalliklari:

⚡Dasturlash sohasida yangi boshlovchilar uchun juda qulay. HTML toza va izchil belgilashga ega, shuningdek yangi boshlovchular uchun o'rganish juda ham oson hisoblanadi.

⚡Qo'llab quvvatlash. HTML gipermatnlash tili juda ko'p ishlatiladi, uning orqasida juda ko'p resurslar va katta jamoa bor.

⚡Ochiq manbali. HTML ochiq manbali va mutlaqo bepul. HTML barcha veb -brauzerlarda ishlaydi.

⚡Moslashuvchan. HTMLni PHP va Node.js. kabi orqa tillar bilan osongina birlashtirish mumkin.

🔴 Kamchiliklari:

⚡Statik. Til asosan statik veb -sahifalar uchun ishlatiladi. Dinamik funksionallik uchun sizga JavaScript yoki PHP kabi orqa tilni ishlatish kerak bo'lishi mumkin.
Alohida HTML sahifasi. Foydalanuvchilar HTML uchun individual veb -sahifalar yaratishi kerak, hatto elementlar bir xil bo'lsa ham.

⚡Brauzer muvofiqligi. Ba'zi brauzerlar asta-sekin yangi funktsiyalarni o'zlashtiradilar. Ba'zida eski brauzerlar har doim ham yangi teglarni ko'rsatmaydi.


🎯 HTML, CSS va Javascript qanday bog'liq tomoni bor❓

HTML matn elementlarini qo'shish va tarkib tuzilishini yaratish uchun ishlatiladi. Biroq, professional va to'liq javob beradigan veb -sayt yaratish yetarli emas. Shunday qilib, HTML veb -sayt tarkibining ko'p qismini yaratish uchun kaskadli uslublar jadvallari (CSS) va JavaScript yordamiga muhtoj.

CSS fon, ranglar, tartiblar, intervallar va animatsiyalar kabi uslublar uchun javobgardir. Boshqa tomondan, JavaScript slayderlar, qalqib chiquvchi oynalar va rasm galereyalari kabi dinamik funktsiyalarni qo'shadi. Bu uch til oldinga rivojlanishning asosidir.

Xulosa

HTML - Internetda topiladigan asosiy belgilash tili. Har bir HTML -sahifada veb -sahifa yoki ilovaning kontent tuzilishini yaratadigan bir qator elementlar mavjud.

HTML-bu juda ko'p qo'llab-quvvatlanadigan yangi boshlanuvchilar uchun qulay til va asosan statik veb-sahifalar uchun ishlatiladi. HTML uslublar uchun CSS va funksionallik uchun JavaScript bilan birgalikda yaxshiroq ishlaydi.

Siz bizning blogimizda olib boriladigan "FRONTEND DEVELOPMENT" darslarimizning ilk video darsida HTML haqida ilk tushunchalar va HTML ning tarkibiy qismlari haqida bilimlarga ega bo'lasiz. Bizni kuzatishda davom eting !!!

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 HTML darslari | HTML ga kirish (1-dars)

Internetning WWW xizmati, asosan, web-sahifalarga bog‘liq ekan, ular qanday yaratiladi ? – degan savol tug‘ulishi tabiiy. Web-sahifalar HTML (Hypertext Markup Language – Gipermatnli markerlash tili) tilida yoziladi. HTML – dasturlash tili hisoblanmaydi. Bu tilda hujjat (web-sahifa) tayyorlash uchun Windows’ning Bloknot kabi oddiy matn muharriri yetarli. Umuman olganda bugungi darsimizda HTML nima ekanligi va undagi asosiy elementlari haqida gaplashamiz !!!

👉 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

🗂 Web ilovalarda tasvirlar, ro'yxatlar, jadvallar, audio va video fayllar bilan ishlash

Bugungi kunda web ilovalarni grafik elementlarsiz tasavvur qilib bo'lmaydi.
Siz yaratgan web sahifa qiziqarli va chiroyli dizayn asosiga qurilgan bo'lsa uning foydalanuvchilari soni shubhasiz ortadi. Shu sababli Internet bilan ishlovchi dasturlar tasvirlarni (grafik elementlar) ochish imkoniga ega bo'lishi bilan internetda mavjud sahifalarning deyarli barchasi tasvirli axborotlarni nashr eta boshladi. Chunki tarvirlar yordamida web sahifada harakatlanuvchi tugmalar va Gif animatziyalarni aks ettirishimiz mumkin. Bu esa bizning web sahifamizni yanada chiroyli va sifatli ko'rinishini ta'minlaydi. Bugungi kunda tasvirlarsiz shunchaki yozuv va matnlardan tashkil topgan web ilovalar allaqachon foydalanuvchilar e'tiboridan chetda qolishga ulgurgan va hozirda bunday uslubda web ilovalar deyarli ishlab chiqilmaydi.

Frontend dasturchi sifatida web ilovalarni ishlab chiqar ekansiz ko'p hollarda tasvirlar bilan ishlashdan tashqari siz ro'yxatlar, jadvallar va multimedia vositalari video va audio fayllar bilan ishlashga duch kelasiz. Bunday paytda esa siz HTML da ro'yxatlar, jadvallar, video va audio fayllar bilan yetarlicha ishlay olish ko'nikmalariga ega bo'lishingiz lozim.

📋 Ro'yxat - bu ma'lumotlarning yoki har qanday ma'lumotni veb sahifalarda buyurtma qilingan yoki tartiblanmagan shaklda ko'rsatish uchun ishlatiladigan qisqa ma'lumotlarning yozuvi hisoblanadi. Masalan, narsalarni sotib olish uchun biz buyurtma berishimiz mumkin bo'lgan yoki ro'yxatga olinmagan ro'yxatni tuzishimiz kerak, bu bizga ma'lumotlarni tartibga solish va buyumni topishni osonlashtiradi. Web sahifada matndagi ayrim elementlarni ro'yxatlangan tartibda yozish qiyin emas va bundan tashqari foydalanuvchi matn bilan tanishib chiqishida qulayliklar yaratib beradi. Siz huddi Microsoft Word matn tahrirlash dasturida ro'yxatlarni qanday tuzsangiz huddi shu ko'rinishda HTML hujjatda ham maxsus teglar yordamida belgilash imkoniga egasiz.

📝 Jadval - bu satrlar va ustunlar yoki, ehtimol, yanada murakkab tuzilishdagi ma'lumotlarni yig'ish hisoblanadi. Jadvallar web sahifalarda aloqa, tadqiqot va ma'lumotlarni tahlil qilishda keng qo'llaniladi. Jadvallar matnli ma'lumotlar va raqamli ma'lumotlarni taqdim etish kabi turli vazifalarni bajarish uchun foydalidir. Jadvallar jadval shaklidagi ikki yoki undan ortiq elementlarni solishtirish uchun ishlatilishi mumkin. Jadvallar ma'lumotlar bazasini yaratish uchun ishlatiladi.

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 HTML darslari | IMG, TABLE, VIDEO, AUDIO (2-dars)

Navbatdagi darsimizda HTML ning tasvirlar, ro'yxatlar, jadvallar, video va audio fayllar bilan ishlash uchun yaratilgan imkoniyatlaridan foydalangan web sahifalarni shakllantirishni ko'rib chiqamiz. Bizni kuzatishda davom eting !!!

👉 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

🗂 Web dasturlarda HTML formalarning o'rni

Siz internetda ko'p marta formalarga duch kelgan bo'lsangiz kerak. Formalar bu qog'ozdagi anketaning elektron varianti bo'lib, o'zida matn kiritish maydonlarini, savollarga javob variantlari va boshqa bir qator form elementlarini o'zida mujassam qiladi. Formalar sayt egasi va foydalanuvchilar orasida aloqa o'rnatish uchun kerak. Formalar yordamida saytingiz orqali, misol uchun, ro'yxatdan o'tish jarayoni registratsiya, veb saytdagi profilingizga kirish yoki veb saytingizda profilingizni yaratish uchun avtorizatsiya, so'rovlar, kommentariyalar, ovoz berish, foydalanuvchilarnining ayrim savollar bo'yicha fikrini bilish va shunga o'xshash masalalarni hal qilishingiz mumkin. Demak, zamonaviy saytlarni formalarsiz tasavvur qilib bo‘lmas ekan.

Web dasturlashda formaning tashqi ko'rinishi HTML orqali shakllantiriladi. Undagi ma’lumotlarni esa qayta ishlash veb dasturlashda backend texnologiyalar ( python, java, php, asp, …) orqali amalga oshiriladi.

📕 HTML formasi - bu matn va parol maydonlari, tasdiqlash qutilari, radio tugmalari, yuborish tugmasi, menyular va boshqalarni o'z ichiga olgan hujjatning bo'limi hisoblanadi.

📗 HTML formasi foydalanuvchiga ism, elektron pochta manzili, parol, telefon raqami va hokazolarni qayta ishlash uchun serverga yuboriladigan ma'lumotlarni kiritishni osonlashtiradi.

🌀 HTML darslari | FORM elementlari (3-dars)

Formalar - bu qog'ozdagi anketaning elektron varianti bo'lib, o'zida matn kiritish maydonlarini, savollarga javob variantlari va boshqa forma elementlarini o'zida mujassam qiladi. Formalar sayt egasi va foydalanuvchilar orasida aloqa o'rnatish uchun kerak. Formalar yordamida saytingiz orqali ovoz berish, foydalanuvchilarnining ayrim savollar bo'yicha fikrini bilish va shunga o'xshash masalalarni hal qilishingiz mumkin.

Navbatdagi darsimiz orqali siz formaning turli elementlaridan foydalangan holda mustaqil o'z sahifangizni yaratishni o'rganasiz.

👉 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

🗂 CSS - bu nima ?

CSS – (Cascading Style Sheets) Kaskadli stillar majmuasi bo'lib stillar bilan ishlay oladigan web texnologiya hisoblanadi. CSS elementlarni ekranda, qog'ozda va yoki boshqa medialarda ko'rinishini tasvirlaydi. CSS web sahifalarga har xil stillar berish uchun ishlatiladi. Hamda bir vaqtning o'zida bir nechta web sahifalarni dizaynini o'zgartirish mumkin. Biror bir web sahifani turli xil qurilmalarda turli xil ko'rinishini ham ta'minlaydi. CSS file .css formati orqali tashqi xotira saqlab qo'yishingiz va kezi kelganda web sahifaning HTML kodini o'zgartirmasdan, faqat CSS faylni o'zgartirish orqali web sahifaga yangidan ko'rinish berishimiz mumkin. Qisqacha qilib aytadigan bo'lsak, HTML faqat web sahifani kodlarini yozish uchun ishlatiladi, HTML da ham web sahifaga dizayn bersa bo'ladi, lekin bu juda uzoq jarayon talab qilgani bois, CSS bu vazifani o'z bo'yniga o'lgan. CSS ning boshqa tillardan bitta ustun tarafi shundan iboratki, CSS kodlarini kompilatsiya qilish uchun, hech qanday kompillyatorlar, redaktorlar yoki biror bir dasturlar shart emas. Bizga oddiygina Internet Explorer va shu kabi brauzerlar kifoya. Brauzerlar orqali biz CSS kodlarini bemalol tahlil qilishimiz, natijamizni to'g'ridan to'g'ri ko'rishimiz mumkin.

🌀 CSS tarixi

CSS ning to'liq shakli 1997 yil tashkil topgan bo'lib, “WWW Consorcium” ida qo'llab quvvatlangan va foydalanishga taqdim etilgan. Dastlab, CSS kodlarini Netscape Navigator 4.0 va Internet Explorer 4.0 brouzerlari tushuna olgan, hozirgi kunda CSS kodlarni istalgan brauzerlar qo'llab quvvatlay oladi.


🌀 CSS ning afzalliklari

🟢 CSS vaqtni tejaydi - Siz CSSni bir marta yozib, keyin bir nechta HTML sahifalarida bir varaqdan qayta foydalanishingiz mumkin. Har bir HTML elementi uchun uslubni aniqlab, uni istaganingizcha web sahifalarga qo'llashingiz mumkin.

🔴 Sahifalar tezroq yuklanadi - Agar siz CSSdan foydalanayotgan bo'lsangiz, har safar HTML atributlarini yozishingiz shart emas. Bir tegning bitta CSS qoidasini yozing va uni ushbu tegning barcha holatlariga qo'llang. Shunday qilib, kam kod degani tezroq yuklab olish vaqtini anglatadi.

🟠 Oson texnik xizmat ko'rsatish - global o'zgarishni amalga oshirish uchun oddiygina uslubni o'zgartiring va barcha web sahifalardagi barcha elementlar avtomatik ravishda yangilanadi.

🟡 HTMLga nisbatan ustun uslublar - CSSda HTML ga nisbatan ancha kengroq xususiyatlar mavjud, shuning uchun HTML atributlarga qaraganda HTML sahifangizga yanada yaxshiroq ko'rinish berishingiz mumkin.

🔵 Bir nechta qurilmalar mosligi - Uslublar jadvallari bir nechta turdagi qurilmalar uchun tarkibni optimallashtirishga imkon beradi. Xuddi shu HTML hujjatidan foydalangan holda web saytning turli xil versiyalari PDA va uyali telefonlar kabi qo'lda yoki qurilmalarda taqdim etilishi mumkin.

🟣 Global veb-standartlar - Endi HTML atributlari eskirmoqda va CSS dan foydalanish tavsiya etiladi. Shunday qilib CSSni barcha HTML sahifalarda kelgusidagi brauzerlarga mos keltirish uchun foydalanishni boshlash yaxshi fikr.


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 CSS darslari | CSS ga kirish (1-dars)

CSS web sahifaning tashqi ko'rinishi va hissi bilan ishlov beradi. CSS dan foydalanib, siz matnning rangini, shriftlarning uslubini, paragraflar orasidagi bo'shliqni, ustunlarning o'lchamlari va joylashishini, fon rasmlari yoki ranglarning qanday ishlatilishini, sxemaning tuzilishini, turli xil qurilmalar va ekran o'lchamlari uchun displeyning o'zgarishini boshqarishingiz va turli xil effektlarni hosil qilishingiz mumkin.

CSS ni o'rganish va tushunish oson, lekin u HTML hujjatning taqdimotini kuchli boshqarish imkonini beradi. Ko'pincha CSS HTML yoki HTML belgilaydigan tillar bilan birlashtirilgan.

Navbatdagi darsimizda CSS orqali HTML elementlariga ta'sir o'tkazish haqida ilk tushunchalarga ega bo'lasiz. Bizni kuzatishda davom eting !!!

👉 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

🌀 CSS darslari | TEXT STYLE (2-dars)

Har qanday web ilovani bugungi kunda matnlarsiz tasavvur etib bo'lmaydi. Shunday ekan biz web sahifalarimizda matnlardan foydalangan holda ularga style berishimizga to'gri keladi. Matnlarga HTML orqali ham style berish mumkin. Ammo HTML da style berish imkoniyatlari cheklangan. Bunday paytda esa bizga CSS yordamga keladi. CSS orqali matnlarga oson va sifatli style berish mumkin.

Bugungi darsimizda CSS orqali HTML matn elementlariga ta'sir o'tkazish haqida batafsil gaplashamiz. Bizni kuzatishda davom eting !!!

👉 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

​​🎮 CSSni o'yin o'ynab o'rganing

Qiziqarli o'yin bilan bilimlar oson o'zlashtiriladi! Tasavur qiling miriqib o'yin o'ynaysiz va CSSni o'rganib olasiz. Internetda bu masalada sizga yordam beruvchi ba'zi saytlar mavjud.

- Grid Garden
CSS Grid'ni o'rganishga ko'maklashadi. Bog'ni tartibga soling va o'yinda g'olib bo'ling. Shu bilan birga CSS Grid bo'yicha bilimlaringizni mustahkamlab olasiz

- Grid Critters
O’yin sizga CSS Grid'ni o’zlashtirishga ko’maklashadi. Siz kosmik kemani boshqarasiz va Grideros sayyorasi aholisini Grid yordamida himoya qilasiz.

- Flexbox froggy
CSS Flexbox'dan foydalanib qurbaqalarni o'z o'rniga qaytarishga yordam bering. O'yin 24 ta bosqichdan iborat bo'lib barchasi juda qiziqarli. Oxirgi bosqichdan siz ham o'ta olasizmi buni hoziroq tekshiring

- Flexbox Zombie
CSS Flexbox'ni epchillik bilan o'rganing. Buni zombilarga qarshi ishlating. O'yin 12 bosqichdan iborat. Buning uchun saytda ro’yxatdan o’tish kerak bo’ladi.

- CSS Diner
CSS ni ham o’zlashtirishga, ham sahifalashning tayanch qoidalarni eslashga yordam beradi. Mahsulotlarni joylashtiring va dasturxonni to’g’ri buyruqlar orqali bezating, o'yin esa ko’rsatmalar bilan yordam beradi. Oson tuyulishi mumkin, ammo bo’shashmang – bu yerda 32 ta bosqich, har biridan so’ng vazifalar murakkablashib boradi.


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 CSS darslari | CSS da BACKGROUNDLAR OILASI BILAN ISHLASH (3-dars)

CSS da background xususiyati HTML elementga orqa fon effektlarini qo'llash uchun ishlatiladi. Misol uchun biror elementning orqa fon rangining biror rangda yoki elementning orqa foniga biror tasvirni aks ettirilishi bularga misol bo'la oladi.

Bugungi darsimizda CSS da aynan BACKGROUNDLAR OILASI bo'lmish background xususiyatlari bilan batafsil tanishamiz. Bizni kuzatishda davom eting !!!

👉 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

​​💻 Dasturlashni mobil qurilmalarda o‘rgatuvchi 11 ilova!

Bu haqida DIMAX Terabayt saytida xabar bergan. Ko‘pchilik yoshlarning qiziqishini inobatga olib, ular uchun dasturlashni o‘rgatuvchi mobil ilovalar ro‘yxatini keltiramiz. Ha, shular yordamida dasturlashni o‘z smartfoningizda ham o‘rganishingiz mumkin!

📱Udacity

Udacity – dasturlashni o‘rgatuvchi taniqli resurs bo‘lib, u mazkur yo‘nalishda bepul ilova ham chiqargan. Uning yordamida axborot texnologiyalari sohasidagi bepul kurslarda o‘z bilimlaringizni oshirishingiz mumkin. Ilova Android hamda iOS uchun ishlab chiqilgan.

📱Swifty

Swift dasturlash tilini o‘rganish uchun Apple kompaniyasining o‘zi tomonidan ishlab chiqilgan iOS-ilova.

📱Swift Playgrounds

Bu – Swift dasturlash tili bilan tanishishning eng sodda usulidir. Swift Playgrounds bilan o‘z planshetingizda – mavjud qoliplardan foydalangan holda, yoki o‘zingiz qolip o‘ylab topib, o‘z ilovangizni yaratishingiz mumkin.

📱Codecademy Hour of Code

Codecademy ta’lim portali iPhone uchun o‘zining ilk ilovasini ishlab chiqdi, uning yordamida dasturlash asoslarini bir soat ichidayoq o‘zlashtirishingiz mumkin! Undagi kichkina topshiriqlarni bajarish judayam kam vaqt talab etadi.

📱Lrn

Ommabop HTML, CSS, Python, Ruby, Javascript dasturlash tillaridan birida kod yozishga ko‘maklashuvchi servis. iOS uchun ilova tarzida taqdim etilgan, Android-versiyasi esa hozircha ishlov jarayonida.

📱Tynker

Bu – bolalar uchun ommabop o‘rgatuvchi platformalardan biri. Undan 8000 dan oshiq maktabda foydalanishadi. Tynker 6 milliondan oshiq bolalarga dasturlashni boshlashga yordam bergan. Uning iOS-ilovasi ham mavjud.

📱Khan Academy

Mashhur ta’lim resursi – Khan Academy ham Android va iOS uchun ilovalarini taqdim etgan. Ular mazkur platforma kurslarida o‘z mobil qurilmangiz orqali qatnashish imkonini beradi.

📱Javvy

Java dasturlash tilini o‘rgatuvchi interfaol o‘quv qo‘llanmasi. Uning yordamida mazkur til asoslarini o‘rganib olish mumkin. Ta’lim kursi 150 dan oshiq darsni o‘z ichiga oladi. Uni Google Play yoki iTunes do‘konidan olishingiz mumkin.

📱SoloLearn

SoloLearn – dasturlashni foydalanuvchiga maxsus o‘yinlar yordamida o‘rgatuvchi mobil ilovalar to‘plamidir. SoloLearn bepul ilovasini iOS va Android platformalari uchun yuklab oling.

📱Coursera: Online courses

Dunyoning yetakchi universitetlarining bepul kurslari – Coursera endi Android hamda iOS ilovalari tarzida ham chiqarilgan.

📱EdX – Online Courses

Jahondagi eng yaxshi universitetlarning onlayn-kurslarini taklif etuvchi yana bir ochiq ta’lim maydonchasi. Android yoki iOS tizimidagi qurilmalar uchun ilovani yuklab oling.


Ⓜ️anba: IT specialist

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 CSS darslari | WIDTH, HEIGHT, MARGIN, PADDING, FLOAT (4-dars)

Navbatdagi darsmizda elementlarimizga CSS dagi width va height xususiyatlari yordamida elementning bo'yi va enini belgilash, padding va margin orqali elementlarni siljitish va float xususiyatidan foydalangan holda bir nechta elementlarni bir necha usulda tartiblashni ko'rib chiqamiz. Bizni kuzatishda davom eting !!!

👉 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_manba

Web Skills - bu veb dasturchi sifatida o'rganilishi mumkin bo'lgan foydali ko'nikmalar to'plami. Bu sayt veb dasturlarni ishlab chiqishni endigina boshlagan dasturchilar va shuningdek, ko'p yillar davomida bu sohada bo'lgan va yangi narsalarni o'rganmoqchi bo'lganlar uchun foydalidir.


Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 CSS darslari | BORDER, BORDER-RADIUS, OVERFLOW (5-dars)

🔵 CSS Border Properties - CSS chegara xususiyatlari

CSS ning border xususiyatlari sizga elementning chegaralarini belgilash imkonini beradi. Misol uchun elementning chegarasini qattiq chiziq, juft chiziq, nuqta chiziq va boshqalar, yoki u rasm orqali tasvirlash mumkin . Bundan tashqari border xususiyatlari chegara uslubini (border-style), rangini (border-color) va qalinligini (border-width) belgilaydigan turli xil xususiyatlarni qanday sozlashni sizga tasvirlab beriladi.

🔵 Handling Overflowing Content - Ortiqcha tarkib bilan ishlash

CSS ning overflow xususiyati sizga tarkibni qisqarish yoki aylantirish satrlarini ko'rsatish yoki blok darajasidagi elementning ortiqcha tarkibini namoyish qilish yoki bermaslikni belgilashga imkon beradi.

Bugungi darsimizda aynan border, border-radius, overflow xususiyatlari haqida batafsil gaplashamiz.

👉 Videoga o'tish

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram

🌀 Qiziqarli HTML teglari:

🟢 <CODE> tegi dastur kodi bo'lgan bir yoki bir nechta matnli satrlarni ko'rsatishga mo'ljallangan.

🔴 <BLOCKQUOTE> tegi hujjat ichidagi uzun tirnoqlarni ajratib ko'rsatish uchun mo'ljallangan. Matn chap va o'ng to'ldirilgan tekislangan blok shaklida ko'rsatiladi.

🟣 <DEL> tegi hujjatning yangi versiyasida olib tashlangan matnni ajratib ko'rsatish uchun ishlatiladi. Ushbu formatlash hujjat matniga qanday o'zgartirishlar kiritilganligini kuzatib borish imkonini beradi.

🟠 <XMP> tegi konteyner tarkibini "xuddi shunday" va belgilangan kenglikdagi shriftda aks ettiradi. <XMP> tegi yopilmaguncha, undagi barcha teglar oddiy matn sifatida ko'rsatiladi.

🟡 <ABBR> tegi belgilar qisqartmalar ekanligini bildiradi. Sarlavha parametri qisqartmaning dekodlanishini beradi, bu esa qisqartirishni tushunish imkonini beradi.

🔵 <ADRESS> tegi muallif haqidagi ma'lumotlarni saqlashga mo'ljallangan. Ma'lumot yig'ish uchun qidiruv tizimlari ushbu teg tarkibini tahlil qilishi rejalashtirilgan.

Ijtimoiy tarmoqlardagi sahifalarimizga obuna bo'ling:

👉 Telegram | YouTube | Instagram