Assalomu alaykum. Hormanglar, dam olish kunlari yaxshi o’tyaptimi? Payshanba va dushanba kunlarining postlari orasida ozgina tanaffus bo’lib qolayotgandek-a? Vaqtdan foydalanib har hafta imkoni boricha shanba yo yakshanba kunlari erkin mavzudagi har xil ma’lumotlar bilan o’rtoqlashib turmoqchimiz. Shu turdagi birinchi postni yaqinroq tanishib olish uchun ajratsak, nima deysiz? Bu postda veb dasturlash sohasiga qanday qilib qiziqib qolganim, bu mutaxassislikni qaysi manbalardan o’rganganim, o’rganish davomidagi eng katta xatoim, yaqin kelajakdagi @mayoquz kanaliga oid rejalar va yana ba’zi boshqa narsalar haqida gapirib o’tamiz. Qani boshladik! 😃


Qisqacha oʻzim haqimda 👤

Ismim Muhammadjavohirbek Sur’atov, Xudo xohlasa, oktabrda 24 yoshga to’laman. Shu yili Toshkent Xalqaro Vestminster Universitetining (TXVU) Biznes Axborot Tizimlari (Business Information Systems) fakultetini tamomladim. Hozirda o’quv markazlarida frontend dasturlash bo’yicha dars beryapman, shu kanalni yuritib turibman. Keyingi haftadan o’quv markazida yangi guruh darslari boshlanishi kutilyapti, siz ham qo’shilishingiz mumkin 😊


Veb dasturlashni o'rganishim qanday boshlangan? 🏳

2014-yil 1-kurslik paytimda universitetimizda internet va sayt tuzishga oid fan o’tilar edi. O’sha darslardan keyin veb dasturlashga qiziqib qolganman. Bu darslarning ma’ruzalar qismida Internet tarixi, foydali mavzular haqida o’rgangan bo’lsak, seminarlarda sayt tuzish asoslari o’rgatilar edi. Birinchi kurs ishimiz sayt tuzish bo’lgan. Darslar soni nisbatan kamroq (jami 12 ta, 2 soatdan) bo’lganigami yoki u paytda kompyuter va internetni ishlatishga ancha no’noq bo’lganimgami kurs ishini qilish uchun ancha qiynalganman. Hozir o’sha tuzgan saytimga qarasam, ancha-muncha xatolar qilgan ekanman (pastroqda saytni GIF formatida yubordim, ko’ringchi qalay?). Sayt tuzishga qiynalgan paytim ustozimizdan savol so’rasam, “Internetda bor, Googledan qidirib ko’r” degan javob olardim. O’shanda ustozimizdan xafa bo’lgan, “ustoz bo’lsa, nega unda o’rgatmaydi?” degan fikrda edim, lekin bu ish keyinroq o’z mevasini berdi: savollarimga mustaqil ravishda internetdagi manbalardan javob topishni o’rgana oldim. Kurs ishini bajarishda qiynalganim uchun yozgi ta’tilda turli onlayn videokurslar va maqolalardan sayt tuzish sirlarini o’rgana boshladim. O’shandan beri turli dasturlash tillari, grafik muharrirlarda ishlashni o’rganib ko’rdim. Hozir ham o’zim tanlagan mutaxassislik bo’yicha har xil manbalar yordamida bilimlarimni oshirib kelmoqdaman. O'rganishdan tashqari universitetimizda 3 yil veb dasturchilar to'garagini yurgazdim, Shu to'garakdagi tajriba keyinchalik professional tarzda dars berishimda ancha qo'l keldi. O'sha darslardan birining videosini Moverga joylagandim, mana bu yerda: https://mover.uz/watch/krMrp9Jm/

Davomi pastda
#erkin_mavzu

Veb dasturlashni qaysi manbalardan o'rgandim? 📚

Veb dasturlashni asosan ingliz tilidagi manbalardan o’rganganman. Ba’zi-ba’zida rus tilidagi video va maqolalarga ham murojaat qilib turaman. Dasturlash yoki boshqa axborot texnologiyasi sohasiga kirishmoqchi bo’lganlarga birinchi o’rinda berishim mumkin bo’lgan tavsiya - ingliz tilini o’rganish. Imkoni bo’lmasa, rus tilini. Ingliz tilini o’rganish kelajakda ko’p foydalar beradi: ingliz tilida juda ko’p tekin o’quv qo’llanmalar bor; o’z sohangizda biron savol chiqib qolsa, bemalol ingliz tilidagi rasmiy qo’llanma (dokumentatsiya)dan qarab javob topib keta olasiz. Veb dasturlashni o’rganmoqchi bo’lganlarga o’zim sinab ko’rgan quyida keltirilgan ustozlar tuzgan videodarslarni tavsiya qila olaman.
- Jeffrey Way - “30 days to learn HTML and CSS” videokursi, Laracasts.com
- Wes Bos - Flexbox, JavaScript, NodeJS, ReactJS bo’yicha kurslar
- Maximillian Schwarzmuller - PHP va JavaScript, YouTubeda “AcadeMind” kanali
- Alex J. Garrett - YouTubeda “CodeCourse”
- Brad Hussey - CodeCollege.ca
- Brad Traversy - YouTubeda “Traversy Media”
- WebDesign Master YouTube kanali (rus tilida)
- va boshqalar. JavaScriptni o'rganish bo'yicha UzGeeks yig'ilishida ba'zi tavsiyalar ham bergan edim. Mana bu videoda ko'rishingiz mumkin: https://mover.uz/watch/FhxleDnm/


Veb dasturlashni o’rganishdagi yo’l qo’ygan eng katta xatoim 🤦‍♂️
Aniq bir mutaxassislikni tanlamay, hamma narsani o’rganishga kirishish.

Dasturlashga yangi bo’lganim uchun har narsa qiziqarli tuyulardi, “hammasida kuchli mutaxassis bo’la olaman” deb o’ylardim. O’zimcha qatorasiga videokurslarga ro’yxatdan o’tib chiqdim, bir nechtasini sotib oldim. Hozir qarasam, Udemy.com ning o’zidagina 467 ta videokursga qo’shilgan ekanman 😲. Buning katta xato ekanligini esa juda kech bildim. Bir sohani tanlamaganim uchun hayolimni jamlay olmay goh veb dasturlash, goh telefonlarga dastur tuzishni o’rganmoqchi bo’lar edim. Shu bilan ko’p vaqtim bekorga ketib qoldi. Dasturlash sohasiga yangi bo’lganlarga maslahat: turli dasturlash tillari, ularning nima maqsadda ishlatilishi haqida internetdan izlaning, tajribali dasturchi akalardan maslahat so’rang. Bor variantlar haqida o’ylab, bittasini tanlang-da, shu sohaning eng zo’ri bo’lishga harakat qiling. Bo’lmasa, 5 xil soha haqida oz-moz biladigan, lekin tayinli bir amaliy ish qilolmaydigan bo’lib qolasiz. Tajribadan o’tgan 😞 Bitta sohada mutaxassis bo’lsangiz, boshqa sohaga o’tish ham ancha oson bo’ladi 👍


@mayoquz uchun yaqin 4-5 oylik reja:
🎯 FrontLoops turkumidagi mashqlarni tugatish (21 ta mashq qoldi);
🎯 FrontLoops mashqlariga JavaScript va/yoki jQuery yordamida dinamik imkoniyatlar qo’shish jarayoni videolarini chiqarish;
🎯 "Qisqa HTML” turkumidagi videolar tarjimasini tugatish;
🎯 Ohans Emmanuelning “Understanding Flexbox” (“Fleksboksni tushunish”) qo’llanmasini tarjima qilish;
🎯 freeCodeCamp.org saytidagi mashqlarni bajarish davomida JavaScript haqidagi videolar tuzish;
🎯 “Sublime Textda samaradorlik” nomli premium videokurs tayyorlash.
Hozircha shular 😊 Nasib qilsa, ancha vaqtgacha kanalimizdan zerikib qolmasligingizga harakat qilamiz.

Bunday uzuuun matn bilan charchatib qo’ymadik, deb umid qilaman. Oxirigacha o’qiganlar 😎 tugmasini bosinglar, necha kishi to’liq o’qiganini bilib olamiz 😊. Ha, aytgancha yuqorida aytganimdek kelayotgan haftada PDP o’quv markazida yangi guruhda frontend dasturlash darslari boshlanadi, Xudo xohlasa. Qatnashmoqchi bo’lganlar @PdpUzAdmin ga yozib, ro’yxatdan o’tishsa, o’quvchilar yig’ilishi bilan darslarni boshlaymiz.

Ertaga 19:00da esa FrontLoops turkumidagi navbatdagi video "Elektron karmon" chiqariladi. Saytni turli ekranlarga moslashuvchan qilish ham o'rgatilgan. Davomiyligi 89:38 daqiqa 😳 O'tkazib yubormang 😊

#erkin_mavzu

Kurs ishi uchun tuzgan saytim

​🎬 Kutib oling, yangi video!
FrontLoops #9 - Elektron karmon 💳.

Bu video shu kungacha olingan eng yaxshi videomiz, deb ayta olamiz:
- o'ziga xos chiroyli va real loyihada ishlatsa bo'ladigan dizayn 😎;
- shu kungacha chiqarilgan videolarimiz orasida eng uzoq davomiylikdagi video - naqd 1:29:38 soat 😳;
- nafaqat katta ekranda, balki planshet va mobil telefonlar ekraniga moslashuvchi dizayn 🖥📱.

Videoga qiziqtira oldikmi? Unda boshqa gap bilan vaqtingizni olmaylik. Video linklari "fstudiyu"!
Mover: https://mover.uz/watch/LrAZUwem/
YouTube: https://youtu.be/yJhkjGzbuog

Qiziqtira olmadikmi? Unda bu videoni ko'rib CSS bo'yicha o'rganishingiz mumkin bo'lgan narsalarni sanab chiqamiz:
- element fonidagi rasmni joylashtirish background-position;
- bo'yi va eni cheklangan elementlarda tashqariga toshib chiquvchi elementlar bilan ishlash - overflow;
- psevdo elementlari ota elementga nisbatan vertikal o'q bo'yicha o'rtaga keltirish;
- media so'rovlar (media query - @media) yordamida element stillarini ekran eniga qarab turli qiymatlarga o'zgartirish;
- katta ekranda yonma-yon turgan elementlarni kichik ekranda ustma-ust joylash;
- elementni ekranning pastki qismiga qotirib, "mixlab" qo'yish.
Frontend dasturlash sohasiga yangi bo'lsangiz, bundanda ko'proq narsalarni o'rganib olishingiz mumkin.

Mover: https://mover.uz/watch/LrAZUwem/
YouTube: https://youtu.be/yJhkjGzbuog

Video yoqqan bo'lsa, kanalga obuna bo'ling va do'stlaringiz bilan ulashing :) Video bo'yicha savol va takliflarni video izohlarida qoldirishingiz mumkin.

9-mashq kodi: https://codepen.io/Muhammadjavohir/pen/VBWOra
Hamma mashqlar kodlari: https://codepen.io/collection/AEWJkO/

Oldingi video - "#8 - Turizm sahifasi":
Mover: https://mover.uz/watch/DxIvblem/
YouTube: https://youtu.be/BK7OXSRNYU4

Kanallarimizga obuna bo'ling.
Telegram: https://t.me/mayoquz
Mover: https://mover.uz/channel/mayoq/
YouTube: https://www.youtube.com/channel/UCVkIqOM_hAlOPnpzWoijFJw

Mayoq
#frontLoops

📖 "Qisqa HTML" 3: footer ichidagi section.

Bu maqolada HTML5 standartida yangi tatbiq qilingan footer va section elementlari haqida ma'lumot olishingiz mumkin. Maqolada berilgan ma'lumotlar:
- section ning vazifasi nima?
- footer ichiga nimalar joylasa bo'ladi?
- section ni ishlatishdagi qoidalar
- foydali manbalarga havolalar

Maqolaga havola: https://medium.com/@Muhammadjavohir/qisqa-html-3-footer-ichidagi-section-86b32bc887b3

Mayoqda nafaqat maqolalar, balki videodarslar ham qo'yib borilmoqda. HTML/CSSga qiziquvchilar bo'lsa, amaliy yondashuvdagi videolarimizni @mayoquz kanalimizga o'tib tomosha qilishlari mumkin.

#mayoq #html_shorts #tarjima

P.S. Maqolaga baho berib yuborasizmi? Huddi maktabdagidek 5️⃣-a'lo, 1️⃣-juda yomon 😄 Postni @mayoquz dan boshqa kanalda ko'rayotgan bo'lsangiz, https://t.me/mayoquz/37 👈 shu yerga yoki @mayoquz ga o'tib, baho qo'ysangiz bo'ladi.

Zoʻr mutaxassis boʻlish uchun qancha vaqt kerak? 🤔

Assalomu alaykum. Baʼzi hollarda dasturlovchilar guruhlarida "falon sohani qancha vaqtda zoʻr oʻzlashtirish mumkin, falon dasturlash tilini toʻliq oʻrganishga shuncha vaqt yetadimi?" degan savollar soʻrab turiladi. Bu savolga yarim yil yoki bir yil deb javob berish toʻliq toʻgʻri javob boʻlmasligi mumkin, deb oʻylayman. Linkdagi postda "Birinchi 20 soat" va "10 000 soat" nomli nazariyalar haqida maʼlumot beramiz. Pastroqda "10 000 soat" nazariyasi haqida ruhlantiruvchi (motivatsion) videoni yuboryapmiz. Koʻrishga arziydi, "atvichayu" 😄

Maqola: http://telegra.ph/Zo%CA%BBr-mutaxassis-bo%CA%BBlish-uchun-qancha-vaqt-kerak-08-02

Kanallarimizga obuna bo'ling.
Telegram: https://t.me/mayoquz
Mover: https://mover.uz/channel/mayoq/
YouTube: https://www.youtube.com/channel/UCVkIqOM_hAlOPnpzWoijFJw

Mayoq
#mayoq #maqola

📖 "Qisqa HTML" 4: SVGni sahifaga qanday tarzda joylash mumkin?

Bu maqolada HTML sahifalarga SVGni joylashning 4 xil usuli va ularning imkoniyatlari bilan tanishib chiqishingiz mumkin. Maqola oxirida shu sohaning ekspertlaridan bo'lgan Sora Suvaydanning blogi va HTML Academy muallifligidagi SVG haqidagi 2 ta o'quv kursiga havolalar bor. Foydali bo'ladi, degan umiddamiz.

Maqolaga havola: https://medium.com/@Muhammadjavohir/qisqa-html-4-qanday-qilib-sahifaga-svgni-joylash-mumkin-90b9d50c706e

Mayoqda nafaqat maqolalar, balki videodarslar ham qo'yib borilmoqda. HTML/CSSga qiziquvchilar bo'lsa, amaliy yondashuvdagi videolarimizni @mayoquz kanalimizga o'tib tomosha qilishlari mumkin.

#mayoq #html_shorts #tarjima

Oxirgi postda ba'zi kamchiliklar bo'lgani uchun tahrirlab, bir necha daqiqa ichida joylaymiz

@mayoquz kanalimizda postlarni kunning qaysi vaqtida joylganimiz siz uchun maʼqul boʻladi? Postlar joylash soatini koʻpchilik tanlagan vaqtga oʻzgartirishga harakat qilamiz.
anonymous poll

21:00-00:00 – 43
👍👍👍👍👍👍👍 67%

19:00-21:00 – 10
👍👍 16%

07:00-09:00 – 6
👍 9%

09:00-11:00 – 2
▫️ 3%

11:00-13:00 – 1
▫️ 2%

15:00-17:00 – 1
▫️ 2%

17:00-19:00 – 1
▫️ 2%

13:00-15:00
▫️ 0%

👥 64 people voted so far. Poll closed.

​​Assalomu alaykum, yaxshilar. Salomatmisizlar?

Xo'sh, so'rovnomamizning natijasiga ko'ra ko'pchilikka videolarning kech soat 9 dan keyin joylanishi ma'qul bo'lar ekan. Bu haftadan boshlab video va maqolalarni soat 21:30 ⏰ da joylashni yo'lga qo'yamiz. FrontLoops bo'yicha tuzilayotgan videolarda biroz tanaffus bo'lib qoldi, 10-vazifa birmuncha murakkabroq ekan. Bundan tashqari, 10-videoda oldingilaridan boshqacha yondashuv - sayt tuzishning mobile-first yondashuvini, ya'ni avvaliga saytning kichik ekranlardagi ko'rinishi, keyin esa katta ekranlardagi ko'rinishini tuzishni o'rganishingiz mumkin bo'ladi. Shu bilan birga saytning CSS kodini bir necha bo'laklarga bo'lish va ularni bir umumiy CSS faylga yig'ishni ham ko'rib chiqamiz.

Yana bir yaxshi yangilik!

FrontLoops videolari bilan birga endi freeCodeCamp.org saytidagi mashqlarni bajarish videolarini ham joylab boramiz. Yangi videoturkum haqidagi videoni uzog'i ertaga kechgacha chiqarishga harakat qilamiz.

Ha, aytgancha, "Qisqa HTML"dagi maqolalarni ham o'qib turinglar, keyingi maqolada CSS yozishning BEM uslubi haqida gaplashib o'tamiz.

Hurmat bilan,
Mayoq

Yangi video turkumi haqidagi videomizni kutib oling! 🔥
freeCodeCamp platformasida veb dasturlashni o'rganish.

Bugungi videoda freeCodeCamp.org sayti haqida ma'lumot berib o'tamiz. Bundan keyingi videolarda shu saytdagi mashqlarni birma-bir bajarib chiqamiz. Bu mashqlar ham o'zimizga, ham sizga foydali bo'ladi, degan umiddamiz. Nasib bo'lsa, bu videolarimiz uzoq vaqt davom etadi 😊

Jeki Channing kinolarida titrlar ko'rsatiladigan paytda o'xshamay qolgan kadrlar ko'rsatilar edi, bilsangiz. O'xshamagan kadrlardan bir-ikkitasini video oxiriga qo'shib qo'ydik. Bunaqa holatlar ko'p-ko'p bo'lib turadi 😁😁😁

YouTube: https://youtu.be/3k9UD2Sk-zA
Mover: https://mover.uz/watch/t3sXe3tm/

Keyingi postgacha xayr. Sog' bo'linglar 🖖

Kanallarimizga obuna bo'ling
Telegram: https://t.me/mayoquz
Mover: https://mover.uz/channel/mayoq/
YouTube: https://www.youtube.com/channel/UCVkIqOM_hAlOPnpzWoijFJw

#freeCodeCamp #html

Assalomu alaykum. Kanalimizdagi navbatdagi video bugun chiqarilishini reja qilgan edik. Afsuski, bugun ulgura olmadik. Video tayyor (10-mashq, 1-qism), ertaga ertalab uzogʻi 11 gacha Mover va YouTubega yuklab e'lon qilishga harakat qilamiz. Ertangi video tahminan 30 daqiqalik.

Holatimizni tushunasiz, degan umiddamiz 😊 Keyingi postda koʻrishguncha. Sogʻ boʻlinglar.

🎬 FrontLoops #10-1 - Apple Watch sayti. Menyu 🍏.

Bu videoda Apple Watch lending sahifasining menyu qismini tuzishni ko'rib chiqamiz. Videoda HTML va CSS yordamida sayt tuzishning mobile-first yondashuvi bilan tanishishingiz mumkin. Bundan tashqari videoda media so’rovlar yordamida saytni turli xil ekranlarga moslashuvchan ko’rinishga keltiramiz.

Mover: https://mover.uz/watch/x8hQIitm/
YouTube: https://youtu.be/kv9MSjgtlQI

Video yoqqan bo'lsa, kanalga obuna bo'ling va do'stlaringiz bilan ulashing :) Video bo'yicha savol va takliflarni video izohlarida qoldirishingiz mumkin.

10-mashq kodi: https://codepen.io/Muhammadjavohir/pen/rroJZJ
Hamma mashqlar kodlari: https://codepen.io/collection/AEWJkO/

Oldingi video - "#9 - Elektron karmon":
Mover: https://mover.uz/watch/LrAZUwem/
YouTube: https://youtu.be/yJhkjGzbuog

Kanallarimizga obuna bo'ling.
Telegram: https://t.me/mayoquz
Mover: https://mover.uz/channel/mayoq/
YouTube: https://www.youtube.com/channel/UCVkIqOM_hAlOPnpzWoijFJw

Mayoq
#frontLoops

Video kecha 21:30 da joylanishi kerak edi. Kechikkanligi tufayli ertalab yuboraverdik. Keyingilarini vaqtida chiqarishga harakat qilamiz :)

☺️ Ogoh bo'ling, oramizda qitmir obunachilar bor! 😁😁
Meni o'ylantirgan tomoni - qanday qilib yarim soatlik videoni 6 daqiqada ko'rib chiqib, unga "👎 Yomon" deb ovoz berish mumkin 🤔 Yoki vaqt mashinasi allaqachon tuzib chiqildimi? 😳

Videolarimizda, kodda kamchiliklar bo'lsa, buni videoning izohlar qismida qoldirishingiz mumkin. Xafa bo'lish yo'q, xatomiz bo'lsa, uni to'g'rilashimiz shart, albatta. Mana pastda bir misoli.

Moverdagi video izohlarida kamchiliklarni aytishdi. Bu biz uchun xatolarimizni ko'rib, to'g'rilashimizga imkon beradi :) https://mover.uz/watch/nXCoMVem

Mini tavsiya

Odatda CSS bo'yicha o'zimga yangi bo'lgan biron mavzuga yo'liqsam yoki biron CSS xususiyati haqida chuqurroq ma'lumot olmoqchi bo'lsam, Google topib bergan natijalardan CSS-Tricks va SmashingMagazine saytlaridagi ma'lumotni birinchi o'rinda o'qib chiqaman. Mana hozir ham CSSni preload yordamida tezroq yuklab olish haqidagi ma'lumotlarni o'qib o'tiribman. 🤓📚

#mayoq #mini_tavsiya