Mobx Funksional styleda
Assalomu aleykum, mobx bo'yicha postlarni davom ettirgan holda, bugun mobx'ni qanaqa qilib funksional styleda yozish haqida ko'rsatmoqchiman. Juda base holatda albatta.
1. Bitta yordamchi funksiya qilib olamiz, ortiqcha yozuvlarni kamaytirishlik uchun.
2. Store create qilish
Object ichida kerakli state va actionlarni yozib createStore funksiyamizga uzatib yuborsak bo'lgani. actionlar async yoki sync ekanligini farqi yo'q, middleware kerak emas,Salom reduxchilar)).
3. Kerakli componentga import qilamiz va ishlatamiz. Tamom.
Ha aytgancha bu misollarda global store yozilgan, commentlarda local store yozib ko'rishga urunib ko'ring))
#mobx #functional_style #mobxVsFunction
@elyor_dev
Assalomu aleykum, mobx bo'yicha postlarni davom ettirgan holda, bugun mobx'ni qanaqa qilib funksional styleda yozish haqida ko'rsatmoqchiman. Juda base holatda albatta.
1. Bitta yordamchi funksiya qilib olamiz, ortiqcha yozuvlarni kamaytirishlik uchun.
createStore funksiya boshlang'ich qiymat qabul qiladi va uni makeAutoObservable ga o'rab qaytaradi.2. Store create qilish
Object ichida kerakli state va actionlarni yozib createStore funksiyamizga uzatib yuborsak bo'lgani. actionlar async yoki sync ekanligini farqi yo'q, middleware kerak emas,
Ha aytgancha bu misollarda global store yozilgan, commentlarda local store yozib ko'rishga urunib ko'ring))
#mobx #functional_style #mobxVsFunction
@elyor_dev
👍1
elyor.dev
Mobx Funksional styleda Assalomu aleykum, mobx bo'yicha postlarni davom ettirgan holda, bugun mobx'ni qanaqa qilib funksional styleda yozish haqida ko'rsatmoqchiman. Juda base holatda albatta. 1. Bitta yordamchi funksiya qilib olamiz, ortiqcha yozuvlarni…
Local mobx store
Local mobx storelarni ishlatishlik uchun
Yoki custom ikki qatorlik hook yozsa ham bo'ladi:
#mobx #localStore
@elyor_dev
Local mobx storelarni ishlatishlik uchun
useLocalObservable hook bor, mobx-react-lite package ichida. Yoki custom ikki qatorlik hook yozsa ham bo'ladi:
export const useLocalObservable = <TStore extends Record<string, any>>(initializer: () => TStore): TStore => {
const [store] = useState(() => makeAutoObservable(initializer(), {}, { autoBind: true }))
return store
}
So'ng uni component ichida ishlatish: const todoList = useLocaleObservable(() => ({
todos: [] as as ITodoList[]
....
.......
}))
shunaqa qilib ishlataveramiz. #mobx #localStore
@elyor_dev
👍2
Client-Side kiber hujumga yo'lak ochuvchi zaifliklar (уязвимость) turlari haqida ekan. Frontendchi sifatida bularni yodda tutish muhim bo'lsa kerak
https://habr.com/ru/companies/bastion/articles/757590/
@elyor_dev
https://habr.com/ru/companies/bastion/articles/757590/
@elyor_dev
👍5
Hozir mobx va nextjs'ni "do'stlashtirish" bilan ovvoraman. Biror kunda yangi package dunyoga kelar balki. Stay tuned!
Mobx top)
@elyor_dev
Mobx top)
@elyor_dev
👍7
Mobx with react-query
Mobx va react-query integratsiyasi haqida qiziq video chiqdi. (Chatlardan birida tashlashdi). react-query ni mobx store ichida ishlatsa bo'lar ekan.
https://youtu.be/rNuIyo994OY?feature=shared
#mobx #react_query #mobx_top
@elyor_dev
Mobx va react-query integratsiyasi haqida qiziq video chiqdi. (Chatlardan birida tashlashdi). react-query ni mobx store ichida ishlatsa bo'lar ekan.
https://youtu.be/rNuIyo994OY?feature=shared
#mobx #react_query #mobx_top
@elyor_dev
elyor.dev
Mobx with react-query Mobx va react-query integratsiyasi haqida qiziq video chiqdi. (Chatlardan birida tashlashdi). react-query ni mobx store ichida ishlatsa bo'lar ekan. https://youtu.be/rNuIyo994OY?feature=shared #mobx #react_query #mobx_top @elyor_dev
Bundan qanaqa use case?
react-query'ning menga yoqmaydigan jihati, bu uning bir componentga bog'langani, ya'ni undan keladigan data bir nechta componentga kerak bo'lsa props drilling bo'lib ketishi, yana asosiy biznes logika ham componentlarda, ham storelarda (har bir app'da minimum bitta store bo'ladi, m-n: user sessionni saqlash uchun). qolib, aralashib ketishi. Yani SSOT (Single Source of Truth) buziladi.
mobx bilan (umuman istalgan stm bilan) integratsiya qilingan varianti bo'lsa butun logika uchun bitta qatlam javob berishini ancha osonlashtiradi, ui va bll ni maksimum ajrata olamiz, ham react-query barcha featurelarini saqlab qolamiz.
P.S. Videoda qo'shimcha DI (dependency inversion yoki injection) container library (react-ioc) ishlatilgan ekan, balkim kimgadir bu qiyin va tushunarsiz ko'rinar, sal keyinroq videodagi final codening soddaroq variantini (DI containerlarsiz) ko'rsatishga harakat qilaman.
#mobx #react_query
@elyor_dev
react-query'ning menga yoqmaydigan jihati, bu uning bir componentga bog'langani, ya'ni undan keladigan data bir nechta componentga kerak bo'lsa props drilling bo'lib ketishi, yana asosiy biznes logika ham componentlarda, ham storelarda (har bir app'da minimum bitta store bo'ladi, m-n: user sessionni saqlash uchun). qolib, aralashib ketishi. Yani SSOT (Single Source of Truth) buziladi.
mobx bilan (umuman istalgan stm bilan) integratsiya qilingan varianti bo'lsa butun logika uchun bitta qatlam javob berishini ancha osonlashtiradi, ui va bll ni maksimum ajrata olamiz, ham react-query barcha featurelarini saqlab qolamiz.
P.S. Videoda qo'shimcha DI (dependency inversion yoki injection) container library (react-ioc) ishlatilgan ekan, balkim kimgadir bu qiyin va tushunarsiz ko'rinar, sal keyinroq videodagi final codening soddaroq variantini (DI containerlarsiz) ko'rsatishga harakat qilaman.
#mobx #react_query
@elyor_dev
Mobx va react-query
Aytganimdek yuqoridagi videoda yozilgan codening biroz soddalashtirilgan variantini ishlatib
To'liq code: https://codesandbox.io/s/mobx-react-query-integration-8lpjg4?file=/src/todos/todo-model.ts
#mobx #mobx_react_query #todo_app
@elyor_dev
Aytganimdek yuqoridagi videoda yozilgan codening biroz soddalashtirilgan variantini ishlatib
todo-app yozdim. Screenshotlarda faqat ishlatilishi ko'rsatilgan, to'liq codeni esa codesandboxdan topasiz. To'liq code: https://codesandbox.io/s/mobx-react-query-integration-8lpjg4?file=/src/todos/todo-model.ts
#mobx #mobx_react_query #todo_app
@elyor_dev
👍4
Lyric chekinish.
Ish uchun, yoki biron communitylarda umuman odam ko'p bo'lgan chatlarda bo'lsanggiz, profilinggizning nomiga e'tibor berib qo'ying. Eng yaxshi varianti ism, familiya yozib qo'yishlik nazarimda. Har xil hech ma'no yo'q simvollardan chekingan ma'qul. Hacker_123nimadir, badBoy777, ***fthyhh*#&#& va hokazo nomlar sizni jiddiy odam sifatida qaralmasligizga olib keladi.
P. S. Bu shunchaki tavsiya, hech kimni kamsitish niyatim yo'q
P. S. S. Yuqoridagi nomlar shunchaki hayolimga kelgani, aniq biron kishini yozganim yo'q
#tavsiya
@elyor_dev
Ish uchun, yoki biron communitylarda umuman odam ko'p bo'lgan chatlarda bo'lsanggiz, profilinggizning nomiga e'tibor berib qo'ying. Eng yaxshi varianti ism, familiya yozib qo'yishlik nazarimda. Har xil hech ma'no yo'q simvollardan chekingan ma'qul. Hacker_123nimadir, badBoy777, ***fthyhh*#&#& va hokazo nomlar sizni jiddiy odam sifatida qaralmasligizga olib keladi.
P. S. Bu shunchaki tavsiya, hech kimni kamsitish niyatim yo'q
P. S. S. Yuqoridagi nomlar shunchaki hayolimga kelgani, aniq biron kishini yozganim yo'q
#tavsiya
@elyor_dev
👍10
Bun v1.0 chiqibdi. Bun bu yangi Javanoscript runtime. Nodejs ga alternative sifatida, nodejs dan ancha tezligini aytishmoqda. Nodejs dunyosida instrumentlar qismlarga ajratilgan. Masalan, webpack, ts-node, jest va hokazolar. Bun da esa hammasi "out-of-box" ekan.
Rasmda bir soniyada qancha http requestlarni "обработка" qila olishi haqida ko'rsatilgan. Nodejsdan 5x tezroq.
Yana bun nodejs projectlarni deyarli to'liq support qiladi deyishyapti.
Umuman olganda qiziq texnologiya. Sinab ko'rish kerak.
Official docs: bun.sh
#bun
@elyor_dev
Rasmda bir soniyada qancha http requestlarni "обработка" qila olishi haqida ko'rsatilgan. Nodejsdan 5x tezroq.
Yana bun nodejs projectlarni deyarli to'liq support qiladi deyishyapti.
Umuman olganda qiziq texnologiya. Sinab ko'rish kerak.
Official docs: bun.sh
#bun
@elyor_dev
👍11⚡2😱1
👍3
FSD - feature sliced design
FSD official telegram chatida o'zbekcha topic qo'shildi, qiziq bo'lsa marhamat:
https://news.1rj.ru/str/feature_sliced/75450
#fsd
@elyor_dev
FSD official telegram chatida o'zbekcha topic qo'shildi, qiziq bo'lsa marhamat:
https://news.1rj.ru/str/feature_sliced/75450
#fsd
@elyor_dev
👍3⚡2
👍4
Forwarded from Azimjon's Fikrlog
Shofir bilimi (yodlangan bilim)
1918-yil Nobel mukofoti yutganidan so'ng, Maks Plank Germaniya bo'ylab sayohat qilib, universitetlarda yangi kvant mexanikasi bo'yicha bir xil maruzani berib boradi.
Uning haydovchisi bu maruzani qayta-qayta eshitaverib, yodlab oladi va professorga bir taklif beradi.
Myunxin shahridagi uchrashuvda maruzani professor o'rniga haydovchisi o'tadi, professor esa hayovchisi o'rnida tinglab o'tiradi. Tinglovchilardan biri savol berib qolganida - boyagi haydovchi:
- "Shu qadar oddiy savol berdingizki, haydovchim javob bera qolsin" deydi.
Bu hikoyani eshitgach, biz bilgan qancha bilim aslida "shofir bilimi" ekan deb o'ylab qoladi odam.
Anglash - bilimni sizniki qiladi, yodlash emas.
Maktab esa xotirangizni tekshiradi - shofirlar ko'payadi.
1918-yil Nobel mukofoti yutganidan so'ng, Maks Plank Germaniya bo'ylab sayohat qilib, universitetlarda yangi kvant mexanikasi bo'yicha bir xil maruzani berib boradi.
Uning haydovchisi bu maruzani qayta-qayta eshitaverib, yodlab oladi va professorga bir taklif beradi.
Myunxin shahridagi uchrashuvda maruzani professor o'rniga haydovchisi o'tadi, professor esa hayovchisi o'rnida tinglab o'tiradi. Tinglovchilardan biri savol berib qolganida - boyagi haydovchi:
- "Shu qadar oddiy savol berdingizki, haydovchim javob bera qolsin" deydi.
Bu hikoyani eshitgach, biz bilgan qancha bilim aslida "shofir bilimi" ekan deb o'ylab qoladi odam.
Anglash - bilimni sizniki qiladi, yodlash emas.
Maktab esa xotirangizni tekshiradi - shofirlar ko'payadi.
👍5
Forwarded from Ayyubxon Fargʻoniy | 0.1x engineer (Ayyubxon)
Opera (browser)da Senior software engineer rolida ishlaydigan Ravshan aka JavaScript bo'yicha videodarsliklar chiqarishni boshlabdi.
Youtube kanallariga a'zo bo'lishni tavsiya qilaman.
https://youtube.com/playlist?list=PLn8TR1nMED9ZkH_zA0teP6ZEIF6oZhMSA&si=UyfvwHHiqid56aZv
Youtube kanallariga a'zo bo'lishni tavsiya qilaman.
https://youtube.com/playlist?list=PLn8TR1nMED9ZkH_zA0teP6ZEIF6oZhMSA&si=UyfvwHHiqid56aZv
👍5🔥1
Menimcha kanal nomini o'zgartiraman shekilli 😅
elyor.dev | mobx
Faqat yomon tomoni mobx reklama uchun to'lamaydida((
Authors:
@thunkdev
@mirjalol_norkulov
#mem_time #mobx
@elyor_dev
elyor.dev | mobx
Faqat yomon tomoni mobx reklama uchun to'lamaydida((
Authors:
@thunkdev
@mirjalol_norkulov
#mem_time #mobx
@elyor_dev
😁11