TailwindCSS yoqdi. 🌚

Nimasini “hate” qilishyapti ekan. Bittasi, class’lar ko’payib ketadi. Lekin IDE’larni ko’pisida “Tailwind Fold” nomli extension bo’lsa kerak. Class’larni yashirib turadi.

Eng yoqqani, biror element ustida turib, uni “child”lariga stil bera olish, harxil “selection”lar qila olish bo’ldi.

#tailwind #frontend

@JoshDeveloper

Critical Rendering Path (CRP)

Browser’da sahifamizga murojaat kelgandan boshlab, to’liq yuklanguncha bo’ladigan jarayon.

Bu jarayonni to’liq tushunib olsangiz, dastur ilk yuklanishi optimizatsiyalarni bir qismini shunchaki mantiqan o’zingiz topib qo’yasiz.

Ilk yuklanish uchun qanday optimizatsiyalarni maslahat berasiz?

Eslatma: Ilk yuklanishni optimizatsiya qilish degani, dastur yuklanishni boshlagandan boshlab ishlashga tayyor holga kelgunga qadar jarayonni tezroq qilish deganidir. Vaqtini kamaytirish esa sizning fayllaringiz hajmi, so’rovlar soni, internet tez yoki sekinligi, yozgan kodlaringizni “browser” uchun qiyinlik darajalari va hokazolarga bog’liq.

#frontend

@JoshDeveloper

Initial Load Optimizations

Hech kim bu tepadagi CRP mavzusiga “Optimization” usullarini yozmapti, kommentda.

O’zim boshlab beraman shekilli.

Eng birinchisi,
kodlar fayllarini hajmini imkon qadar qisqartirish. Bu bo’lishi mumkin, “minification”, “compression(GZIP yoki Brotli eng mashxuri)”, “caching” yoki shunchaki keraksiz kodlarni o’chirish. :)

Ikkinchisi,
birinchi yuklanish uchun kerakli fayllarni o’zini yuklab, qolgan ikkinchi darajali keraklilarini orqa fonda asinxron yuklash.
Bu bo’lishi mumkin, “critical CSS”dan boshqa CSS kodlar, JS kodlar, ilk ko’rinishda uncha muhim bo’lmagan rasmlar, videolar va hokazolarni orqa fonga o’tkazish.

Esimga kelganlari shular. Qolgan maslahatlar, siz azizlardan.

#frontend

@JoshDeveloper

Oxirgi oylar Frontend arxitekturasiga aloqador mavzular bilan ko’p ishlayapman. O’rganishga harakat qilyapman.

Sizlarga “Frontend arxitekturasi” nomli maqolalar ketma-ketligini yozishni o’yladim.

Qiziq bo’ladimi? Qaysi mavzularga ko’proq e’tibor qaratay?

#frontend

@JoshDeveloper

Aslida ushbu mentoring'ni Angular dasturchilari uchun ochyotgan edim.

Qarasam Umumiy Frontend mavzularida oqsaydiganlar talaygina.

Shu sabab to'liq Frontend mavzulari (freymvorklarsiz) va xohishga ko'ra Angular mavzulari uchun qiladigan bo'ldim.

Umid qilamanki qatnashgan barcha o'quvchilarimiz bilimlarini ancha oshirishadi va intervyulardan ham qiyinchilik ko'rishmaydi.

P.s: Ingliz tilida o'tish imkoni ham bor.

#frontend #angular

@JoshDeveloper

Intervyu payti men, mushugimga qarata:
Shuncha qilganimni …..!!! 😄️️️️️️

#fun

@JoshDeveloper

“Frontend architecture” kursimizda yangilik bor.

Birinchi guruh qabuli boshlanyapti.

Birinchi guruh uchun shaxsan o’zim jonli tarzda dars o’tmoqchiman inshaaAlloh.

Kurs e’loni hali chiqmadi, ammo hozirdan joy band qilish niyatidagilar @vector_academy_admin ga bog’lansa bo’ladi.

Dars vaqtlari: Seshanba, Payshanba va Shanba kunlari, soat 20:00 da, 1.5 - 2 soat davomida.

Jami 12-15 ta dars o’tiladi.

#frontend

@JoshDeveloper

Ushbu rasmdagi mavzular haqida qisqa ma'lumotlarni bepul olishni istaysizmi? 🤔

Unda marhamat 😎: https://t.me/+Fy9G9UAn5k00MmM6

#frontend

@JoshDeveloper

Bu nima degani?

"AI"lashish kerak degani. Ya'ni, bir joyda qotib qolmasdan ish va hayot stilimizni AI bilan qurishni boshlashimiz kerak degani. Avval 2 ta saytni topshirgan bo'lsangiz, AI orqali 10 ta saytni topshirishingiz kerak degani.

Biz pishmadik 🔥, joyida o'tirib qolganlar pishdi. Zamon bilan hamnafas bo'lmaganlar pishdi.

"AI"lashing.

#ai #frontend

@JoshDeveloper

Frontend System design haqida so'raganmidingiz? 💭

Unda yangilikni biri 😉

Jum'a kuni, 8-avgust soat 20:30'da Diyorbek Sadullaev bilan "Frontend system design" haqida jonli suhbat uyushtiramiz, Xudo xohlasa.

Efirda o'zingizni qiziqtirgan savollarni yo'llashingiz mumkin bo'ladi.

🔗 Jonli efirga link: https://youtube.com/live/Pcxs07g-xVU

#frontend #systemDesign

@JoshDeveloper

RTL tillarni qanday "support" qilamiz?

Ba'zi dasturlar LTR(Left to right) emas, RTL(Right to left) o'qiladigan tillarni ham "support" qilishi kerak bo'ladi.

Shunday holatda qanday qadamlarni hisobga olishimiz kerak?

🔶 HTML tegimizga dinamik lang va dir xossalarini berishimiz kerak.

🔶 margin-left kabi aniq xossalar o'rniga, o'rniga margin-inline-start kabi dinamik xossalar berish kerak. (padding-* uchun padding-inline-*). Loyiha yozib bo'lingan bo'lsa, eng tez yo'li rtlcss kutubxonalardan birini ishlatish. Alohida "flipped css file" chiqazib beradi, bitta refresh qilib dinamik ravishda main.css'ni main.rtl.css ga o'girib qo'yasiz.

🔶 Ko'pincha rasmlar va icon'larni mirror qilishga to'g'ri keladi. Masalan transform: scaleX(-1) bilan.

🔶 Date formatlarni ham esingizdan chiqarmang.

Sizda yana qanday maslahatlar bor?

#rtl #css #frontend #accessibility


@JoshDeveloper

Frontend arxitekturasini videodarslardan o’rganish payti keldi 😎

👀 Frontend arxitekturasini o’rganib, kam sonli mutaxassislar qatoriga qo’shilishni xohlaysiz, ammo bunga qanday erishishni bilmayapsizmi?

😉 Unda bizning videodarslarimizni kutib oling.

✅ Mentorimiz — Umar Sadullayev:
➖Senior Frontend Engineer - EPAM Systems;
➖Google Developer Expert;

📌 Batafsil ma’lumot uchun:
🔗 LINK

Bog’lanish uchun:
🔗 @vector_academy_admin

#frontend #architecture

@vector_academy_uz — bilim va tajriba kesishgan nuqta! 🫡

Va'da qilinganidek arxitektura kursiga shu kanalimizdan birinchi 10 ta insonga 10% chegirma beryapmiz.

Kurs haqida batafsil ma’lumot uchun:
🔗 LINK

#frontend

@JoshDeveloper