Dev thinking loud
1.68K subscribers
119 photos
8 videos
3 files
321 links
Dasturlash boyicha video darslar, subyektiv fikrlar, kundalik misollar, bahsli mavzular.

Youtube kanal: https://www.youtube.com/@ravshansbox

Muallif: @ravshansbox
Download Telegram
ESM modullar browserda "by default" (tarjimasini bilganlar yozvorishsin) kech yuklanadi (deferred).

Biz bilamizki, browserda script taglar kech yuklanishi uchun defer atribut berishimiz kerak. Bo'lmasa browser script tagni uchratishi bilan html processingni tohtatib scriptni yuklab(fetch) va ishlatish(execute)ni boshlaydi. Bu oz navbatida undan keyin kelgan html elementlarning DOMda topilmasligiga sabab boladi. Agar scriptimizda type=module bolsa defer avtomat tarzda yoqiladi.

manba: https://v8.dev/features/modules#defer

#did_you_know
πŸ‘22πŸ”₯6
VSCodeda importlar va xatolarni tuzatish

Skrindagi config vscodeda importlar bilan ishlashni qulaylashtiradi, yozilgan amallar file saqlanayotganda yozilgan ketma-ketlikda bajariladi:
- Avval ishlatilmagan importlar olib tashlanadi;
- Keyin yetishmaydigan importlar qoshib chiqiladi (tekshirish kerak bolishi mumkin, agar birdan kop import bolsa malum qoidalarga ko'ra birinchisi tanlanadi);
- Keyin importlar malum qoidalarga qarab sort qilinadi;
- Oxirida linter (eslint, stylelint...) xatolar tuzatiladi.

PS: .vscode/settings.json fileni gitga qoshsa teamdagi hamma vscode foydalanuvchilariga foydali boladi
πŸ‘41πŸ”₯11πŸ™2❀1
AbortSignal va AbortController

AbortSignal/AbortController interfacelari async operasiyalarni tohtatish uchun ishlatiladi. Masalan, juda ko'p ishlatiladigan fetch() funksiya RequestInit parameter(object)ga signal nomli property kutadi (optional) va biz bu propertyga AbortSignal instance berishimiz mumkin. Va keyinroq bu AbortController instancening .abort() methodini chaqirib requestni tohtatishimiz mumkin.

AbortSignal qabul qiladigan APIlar:
- Fetch
- EventTarget API
- ReadableStream/WritableStream
- WebSocket

AbortSignal instance odatda AbortControllerda saqlanadi, uni new AbortController() qilib yaratamiz, lekin uni AbortSignal static methodlari orqali ham yaratishimiz mumkin. Bular:
- AbortSignal.abort() - Allaqachon abort qilingan instance yaratadi.
- AbortSignal.any() - Parameterga AbortSignallardan tashkil topgan iterable oladi va ulardan biri abort bolganda bu ham abort boladi.
- AbortSignal.timeout() - Parameterda berilgan millisekund qiymatda avtomat abort boladigan instance qaytaradi (Backenddan kutilayotgan javobga timeout qoyish uchun juda qulay)
πŸ”₯19πŸ‘12❀4
Keyingi post yoki videolar nima haqida bo’lishini hohlardiz?
Anonymous Poll
25%
JavaScript
40%
TypeScript
17%
React
19%
Testing
❀3πŸ‘1πŸ”₯1
TypeScript: resurslar bilan tanishuv

https://youtu.be/-CRLBlucnTU
πŸ‘23❀3πŸ”₯3
Rewrite git history

Adashib asosiy branchga commit va push qilib qoydingiz mi? Havotirga o’rin yo’q, quyidagicha orqaga qaytaramiz:

git checkout main
git reset --soft HEAD

git push origin main --force

git checkout new-branch
git add .
git commit -m "commit to new branch"
git push origin new-branch
πŸ”₯53πŸ‘23❀4
Zed for Linux

Linux foydalanuvchi dasturchilarga hushxabar. Zed linuxga ham release bo'ldi (to'g'risi o'zim tekshirib ko'rishga imkoniyatim bo'lmadi).

https://zed.dev/linux
πŸ‘11πŸ”₯4
TypeScript through docs: The Basics

https://youtu.be/etl4UrBb2qc
πŸ”₯21πŸ‘3
YouTubeda 1000ta bo'ldik πŸŽ‰
πŸ”₯75πŸ‘12❀1
Consoleda nima chiqadi?

console.log(Boolean('true'), Boolean('false'));
Anonymous Quiz
11%
false false
6%
false true
28%
true false
56%
true true
πŸ”₯8πŸ‘6❀2
Updating packages

Eskirgan paketlarni korish uchun:
npm outdated

Ularni "upgrade" qilish uchun:
npx npm-check-updates -i

ishlatishingiz mumkin

#tips_and_tricks
❀16πŸ‘16
Funksional dasturlashdagi "Currying" tushunchasi bilan tanishib chiqamiz

https://youtu.be/WwfoUoUUWkg
πŸ‘19πŸ”₯7
Funksional dasturlashda "Function Composition" tushunchasi bilan tanishib chiqamiz

https://youtu.be/OpO5Hrp77Z8
πŸ”₯15
TypeScript through docs: Functions

https://youtu.be/Pgkjn6LfSL0
πŸ‘9πŸ”₯1
TypeScript through docs: Objects

https://youtu.be/KW9wtWsZvuI
πŸ”₯11πŸ‘3
TypeScript through docs: Generics

https://youtu.be/4_DXeWUscf4
πŸ‘11πŸ”₯3
Quyidagi qatorning nanijasi qanday bo'ladi:
console.log(Object.keys([1,2,3]));
Anonymous Quiz
36%
[0, 1, 2]
35%
['0', '1', '2']
13%
[1, 2, 3]
16%
['1', '2', '3']
πŸ‘5