Forwarded from 42β‘οΈ
15 daqiqadan so'ng jonli darsni YouTubeda boshlaymiz: youtube.com/live/9DCwP6Xkujk
YouTube
Frontend Tizim Dizayni - Izolyatsiya va Xavfsizlik
π― Nimalarni o'rganamiz?
- XSS hujumlardan himoyalanish
- Dinamik kontent sanitariyasi
- Xavfli kodini xavfsiz yuritish
- Web Workers, Service Workers va iframe sandboxing
Case study: CodeSandbox arxitekturasi
Notion: https://circular-list-c3e.notion.site/Izolyatsiyaβ¦
- XSS hujumlardan himoyalanish
- Dinamik kontent sanitariyasi
- Xavfli kodini xavfsiz yuritish
- Web Workers, Service Workers va iframe sandboxing
Case study: CodeSandbox arxitekturasi
Notion: https://circular-list-c3e.notion.site/Izolyatsiyaβ¦
π₯7π4π3
42β‘οΈ
15 daqiqadan so'ng jonli darsni YouTubeda boshlaymiz: youtube.com/live/9DCwP6Xkujk
Ochiq darsimiz tugadi. YouTube dan bemalol ko'rishingiz mumkin.
Xavfsizlik mavzusida ko'p to'xtalib qolganimiz uchun Case Study mavzusini to'liq yoritolmadim. Buning uchun uzr so'rayman.
P.S. Davom ettirsamam bo'lardi lekin gapiraverib tomog'ib og'rib qoldiπ₯²
Xavfsizlik mavzusida ko'p to'xtalib qolganimiz uchun Case Study mavzusini to'liq yoritolmadim. Buning uchun uzr so'rayman.
P.S. Davom ettirsamam bo'lardi lekin gapiraverib tomog'ib og'rib qoldiπ₯²
π₯24π10π6
42β‘οΈ
15 daqiqadan so'ng jonli darsni YouTubeda boshlaymiz: youtube.com/live/9DCwP6Xkujk
Talablarga binoan, darsdagi Notion'ga link
circular-list-c3e on Notion
Izolyatsiya va Xavfsizlik | Notion
π― Nimalarni o'rganamiz?
π8π₯6
Frontend System Design Mock Interview
Kandidat: Diyorbek Sadullaev (@brogrammist)
Intervyu oluvchilar:
- Umar Sadullayev (@JoshDeveloper)
- Shahzod Tursunov (@shahzodcodes)
Vaqt: 30-sentyabr, 21:00
YouTube link: https://youtube.com/live/Asue50XgbL8?feature=share
Komponent arxitekturasi, state management'dan tortib, performance optimizatsiya, scalability mavzularigacha savollar bo'ladi.
Yetakchi tech kompaniyalarda senior va lead lavozimlarida ishlab kelyotgan mutaxassislardan o'rganamiz!
Frontend tizim dizayni kursiga qo'shiling: https://42.uz/course/frontend-tizim-dizayni
Kandidat: Diyorbek Sadullaev (@brogrammist)
Intervyu oluvchilar:
- Umar Sadullayev (@JoshDeveloper)
- Shahzod Tursunov (@shahzodcodes)
Vaqt: 30-sentyabr, 21:00
YouTube link: https://youtube.com/live/Asue50XgbL8?feature=share
Komponent arxitekturasi, state management'dan tortib, performance optimizatsiya, scalability mavzularigacha savollar bo'ladi.
Yetakchi tech kompaniyalarda senior va lead lavozimlarida ishlab kelyotgan mutaxassislardan o'rganamiz!
Frontend tizim dizayni kursiga qo'shiling: https://42.uz/course/frontend-tizim-dizayni
π24π₯6π1π1
Brogrammist
Frontend System Design Mock Interview Kandidat: Diyorbek Sadullaev (@brogrammist) Intervyu oluvchilar: - Umar Sadullayev (@JoshDeveloper) - Shahzod Tursunov (@shahzodcodes) Vaqt: 30-sentyabr, 21:00 YouTube link: https://youtube.com/live/Asue50XgbL8?feature=shareβ¦
YouTube
Frontend System Design - Mock Interview
Frontend System Design Mock Interview
Kandidat: Diyorbek Sadullaev ( @brogrammistuz )
Intervyu oluvchilar:
- Umar Sadullayev ( @JoshDeveloper )
- Shahzod Tursunov ( @shahzodcodes )
Haqiqiy frontend tizim dizayni intervyusini kuzating! Komponent arxitekturasiβ¦
Kandidat: Diyorbek Sadullaev ( @brogrammistuz )
Intervyu oluvchilar:
- Umar Sadullayev ( @JoshDeveloper )
- Shahzod Tursunov ( @shahzodcodes )
Haqiqiy frontend tizim dizayni intervyusini kuzating! Komponent arxitekturasiβ¦
π8π₯2
O'zgaruvchi/funksiya nomlarini yozganda qisqartmalarni qanday yozishga ikkilanaman:
Katta harf bilan yozaveraymi yoki kichik harfga o'zgartirsammi? π€
Mana sizga clean code tip:
Qisqartmalarni boshqa so'zlardek kichik harf bilan yozing!
π« validateXMLFile
β validateXmlFile
π« sendJSONRequest
β sendJsonRequest
Shunday qilinsa, so'zlarni o'qish osonlashadi.
Ayniqsa bir nechta qisqartmalar yonma-yon kelganda buning foydasini ko'rish mumkin.
π« setRESTAPIURL
β setRestApiUrl
P.S. LinkedIn'dan chopildi
Katta harf bilan yozaveraymi yoki kichik harfga o'zgartirsammi? π€
Mana sizga clean code tip:
Qisqartmalarni boshqa so'zlardek kichik harf bilan yozing!
π« validateXMLFile
β validateXmlFile
π« sendJSONRequest
β sendJsonRequest
Shunday qilinsa, so'zlarni o'qish osonlashadi.
Ayniqsa bir nechta qisqartmalar yonma-yon kelganda buning foydasini ko'rish mumkin.
π« setRESTAPIURL
β setRestApiUrl
P.S. LinkedIn'dan chopildi
π37π₯9
Lotin-Kirill dasturim analitikasida meni ko'p hayron qoldiradigan narsa bu - aktiv foydalanuvchilar demografiyasi!
Indonesiyadan har doim 10-15 ta user bor. Oxirgi oylarda Rossiya orqada qolib, Xitoy va Singapurdan foydalanuvchilar paydo bo'lishni boshladi. π€¨
Balki VPN dir?
Ishonish qiyin. Xitoyda bloklangan saytlar bizdan ko'ra ko'proq.
O'zbekistonlik talabalar/ishchilar?
Bo'lishi mumkin. Lekin Xitoyda o'qishsa ham, bunchalik aktiv foydalanuvchilar bo'lishi menga qiziq tuyulyapti.
Tilshunos/Tadqiqotchilar
Bu ham variant. Ammo yana yuqoridagi savol qiynaydi.
Botlar?
Ehtimoldan holi emas. Lekin maqsad tushunarsiz. Open-source library bo'lsa, nima qilishadi UI ishlatib? π€·ββοΈ
Xullas, bilmadim. Nima bo'sayam tinchlik bo'sin.π€²
Indonesiyadan har doim 10-15 ta user bor. Oxirgi oylarda Rossiya orqada qolib, Xitoy va Singapurdan foydalanuvchilar paydo bo'lishni boshladi. π€¨
Balki VPN dir?
Ishonish qiyin. Xitoyda bloklangan saytlar bizdan ko'ra ko'proq.
O'zbekistonlik talabalar/ishchilar?
Bo'lishi mumkin. Lekin Xitoyda o'qishsa ham, bunchalik aktiv foydalanuvchilar bo'lishi menga qiziq tuyulyapti.
Tilshunos/Tadqiqotchilar
Bu ham variant. Ammo yana yuqoridagi savol qiynaydi.
Botlar?
Ehtimoldan holi emas. Lekin maqsad tushunarsiz. Open-source library bo'lsa, nima qilishadi UI ishlatib? π€·ββοΈ
Xullas, bilmadim. Nima bo'sayam tinchlik bo'sin.π€²
π12π₯3
Intervyu savoli
Ushbu koddagi o'zgaruvchilar jami taxminan qancha xotira egallaydi?
Javoblaringizni izohlarda qoldiring π
Ushbu koddagi o'zgaruvchilar jami taxminan qancha xotira egallaydi?
const a = "..."; // 100MB string
const b = a;
let c = b;
var d = [c];
Javoblaringizni izohlarda qoldiring π
π9π₯1π€1
Brogrammist
Intervyu savoli Ushbu koddagi o'zgaruvchilar jami taxminan qancha xotira egallaydi? const a = "..."; // 100MB string const b = a; let c = b; var d = [c]; Javoblaringizni izohlarda qoldiring π
Javob
Taxminan:100 MB
Chunki, primitivlar ham "reference" orqali ko'chiriladi. Faqat o'sha nusxalardan biri o'zgargach "reference"lar bo'linadi va xotirada alohida joy olishni boshlaydi.
Bu V8 engine'sida, xususan Chrome va Node.js da shunday ishlaydi. Boshqa JS engine'lar optimizatsiyasi farq qilishi mumkin. Chunki ECMAScript spec'ida ayanan biror optimizatsiya uchun talab qoyilmagan.
Oddiy lekin chag'ituvchi savol.
Taxminan:
Oddiy lekin chag'ituvchi savol.
π16π₯2
Shaxsiy vebsaytimni open-source qildim
Kodi zo'r yozilmagan. Lekin yashiradigan narsamam yo'q ichida. π
Blogni o'zim 0 dan yasaganman. Boshida postlarni yozish uchun CRUD app qilgandim. Backend API, database, authnetication. Xullas yaxshigina overengineering bo'lgan. Albatta, o'rganish uchun.
Keyinchalik esa murakkablikdan qochib, iloji boricha sodda yechimlar qilish kerakligini anglab yetganman. Shu sabab postlarimni oddiy markdown fayllarga aylantirganman.
Markdown fayllar /public/articles ga qo'shiladi. Saytga kirganda o'sha yerdagi fayllar ro'yhati ko'rsatiladi. Birortasini ochganda markdown HTML ga o'girilib sahifada ko'rsatiladi. Tamom.
Faqat domen uchun pul to'layman xolos.
https://github.com/diyorbek/diyorbek.blog
Kodi zo'r yozilmagan. Lekin yashiradigan narsamam yo'q ichida. π
Blogni o'zim 0 dan yasaganman. Boshida postlarni yozish uchun CRUD app qilgandim. Backend API, database, authnetication. Xullas yaxshigina overengineering bo'lgan. Albatta, o'rganish uchun.
Keyinchalik esa murakkablikdan qochib, iloji boricha sodda yechimlar qilish kerakligini anglab yetganman. Shu sabab postlarimni oddiy markdown fayllarga aylantirganman.
Markdown fayllar /public/articles ga qo'shiladi. Saytga kirganda o'sha yerdagi fayllar ro'yhati ko'rsatiladi. Birortasini ochganda markdown HTML ga o'girilib sahifada ko'rsatiladi. Tamom.
Faqat domen uchun pul to'layman xolos.
https://github.com/diyorbek/diyorbek.blog
π₯18π7π1
YouTube stream qilamizmi?
Anchadan beri "live coding" stream qilish haqida o'ylab kelaman. "Recreational programming" degan narsa bor, ya'ni "ko'ngilochar dasturlash". YouTube da Tsoding degan rus aka shunqa videolar qiladi. Videolarini ko'rib maza qilaman. Shunga o'xshash streamlar qilsak menimcha qiziq bo'lardi. U akadek tajribam yo'q lekin harakat qilishga arziydi. π
Native HTML Canvas from Scratch
C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
Bitta stream bilan buncha narsani qilish imkoni yo'q. Seriyali qilamiz.
Nima deysizlar?
Anchadan beri "live coding" stream qilish haqida o'ylab kelaman. "Recreational programming" degan narsa bor, ya'ni "ko'ngilochar dasturlash". YouTube da Tsoding degan rus aka shunqa videolar qiladi. Videolarini ko'rib maza qilaman. Shunga o'xshash streamlar qilsak menimcha qiziq bo'lardi. U akadek tajribam yo'q lekin harakat qilishga arziydi. π
Native HTML Canvas from Scratch
C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
Bitta stream bilan buncha narsani qilish imkoni yo'q. Seriyali qilamiz.
Nima deysizlar?
π₯85π11π6π3
Brogrammist
YouTube stream qilamizmi? Anchadan beri "live coding" stream qilish haqida o'ylab kelaman. "Recreational programming" degan narsa bor, ya'ni "ko'ngilochar dasturlash". YouTube da Tsoding degan rus aka shunqa videolar qiladi. Videolarini ko'rib maza qilaman.β¦
Xo'sh... reaksiyalarga qaraydigan bo'lsak, mavzuga qiziqqanlar kam emas ekan.
Bu mavzu o'ta eksperimental. Menimcha qilsa bo'ladi va shunga birga harakat qilamiz, inshaAlloh.
Unday bo'lsa, bugun kech soat 22:00 da bitta stream qilamiz YouTube da.
Bu mavzu o'ta eksperimental. Menimcha qilsa bo'ladi va shunga birga harakat qilamiz, inshaAlloh.
Unday bo'lsa, bugun kech soat 22:00 da bitta stream qilamiz YouTube da.
π₯27π5π4π2
Brogrammist
YouTube stream qilamizmi? Anchadan beri "live coding" stream qilish haqida o'ylab kelaman. "Recreational programming" degan narsa bor, ya'ni "ko'ngilochar dasturlash". YouTube da Tsoding degan rus aka shunqa videolar qiladi. Videolarini ko'rib maza qilaman.β¦
YouTube
JS Canvas with Native C/C++ Graphics
Experimental dasturlash. C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
π₯11π4
Brogrammist
https://www.youtube.com/live/_6jSuztYxRc?si=tvW5E5IbQLEPiFb-
YouTube
JS Canvas with Native C/C++ Graphics (Part 2)
2-qism
Experimental dasturlash. C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
1-qism: https://www.youtube.com/live/_6jSuztYxRc?si=tvW5E5IbQLEPiFb-
Experimental dasturlash. C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
1-qism: https://www.youtube.com/live/_6jSuztYxRc?si=tvW5E5IbQLEPiFb-
1π₯9π3π1
Davom ettiramiz π
Bu stream'lar dars yoki savol-javob sessiyalari emas. Bu mening jonli efirda:
1. hech qanday tayyorgarliksiz kod yozishim
2. yangi narsalar o'rganishim
3. miyyam tormozlanishi
4. qiziq loyihadan zav olishim
Bularni stream qilmasam ham, baribir qilardim. Shunchaki gapirmasdan o'tirardim xolos. Kunlik terapiyaga aylanib qolyapti men uchun bu. π
https://youtube.com/live/MGrzycMuT60?feature=share
Bu stream'lar dars yoki savol-javob sessiyalari emas. Bu mening jonli efirda:
1. hech qanday tayyorgarliksiz kod yozishim
2. yangi narsalar o'rganishim
3. miyyam tormozlanishi
4. qiziq loyihadan zav olishim
Bularni stream qilmasam ham, baribir qilardim. Shunchaki gapirmasdan o'tirardim xolos. Kunlik terapiyaga aylanib qolyapti men uchun bu. π
https://youtube.com/live/MGrzycMuT60?feature=share
YouTube
JS Canvas with Native C/C++ Graphics (Part 3)
3-qism.
Experimental dasturlash. C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
1-qism: https://www.youtube.com/live/_6jSuztYxRc?si=tvW5E5IbQLEPiFb-
Experimental dasturlash. C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
1-qism: https://www.youtube.com/live/_6jSuztYxRc?si=tvW5E5IbQLEPiFb-
π₯7π6
Bugun kechΠ°gi segmentation fault error'ni tuzatish va kutubxonamiz imkoniyatlarini va API sini kengaytirishga harakat qilamiz.
https://youtube.com/live/yXyRtXMGPFY?feature=share
https://youtube.com/live/yXyRtXMGPFY?feature=share
YouTube
JS Canvas with Native C/C++ Graphics (Part 4)
4-qism.
Experimental dasturlash. C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
1-qism: https://www.youtube.com/live/_6jSuztYxRc?si=tvW5E5IbQLEPiFb-
Experimental dasturlash. C/C++ bilan native graphics ga asoslangan JavaScript kutubxona quramiz.
Maqsad: Brauzerdagi Canvas script'larni executable qilish imkoniyati.
1-qism: https://www.youtube.com/live/_6jSuztYxRc?si=tvW5E5IbQLEPiFb-
π₯10π2