Попробовал, наконец, разработку на Blazor. Это такой фреймворк под .NET, который позволяет писать фронтенд на C#. Работает он двумя способами: либо собирает весь проект в WebAssembly, и бедный пользователь грузит себе мегабайтную dll, либо устанавливает клиент-серверное соединение через SignalR и шлёт клиенту информацию об обновлённых DOM-элементах.
Вот вторую то я и пробовал. Казалось бы — каждое нажатие кнопки требует отправить на сервер запрос и получить ответ. Никогда такого не было! Но субъективно разницы во времени отклика нет (потому что веб и так достаточно медленный, хаха).
Фронтенд-часть пишется очень похоже на JSX: вёрстка реактивно вперемешку с кодом. Когда-то я очень ругал React за такой подход, потому что каша. Но нетипизированный JS по-умолчанию каша, а здесь же по факту получается очень удобно: статический анализ не даёт тебе делать ошибки и писать ерунду.
Но приятный полноценный язык программирования вместо JavaScript это лишь вишенка на торте. Самое крутое — вся сила серверного кода с полноценной возможностью обращения к базе данных, шеринг моделей данных между сервером и клиентом, и, наконец, Dependency Injection любого серверного модуля в «клиент»! То есть вы не просто пишете одно приложение вместо двух, вы ещё и получаете отсутствие ошибок при каком-нибудь изменении моделей API, когда сервер стал отдавать не то, что ожидает клиент. Вам вообще теперь не нужен API, достаточно закодить нужную функцию на серваке и инжектировать её в нужный фронтенд-модуль.
Это супер удобно, супер быстро, супер устойчиво к ошибкам. Теперь не хочется возвращаться даже на вполне крутой Vue 3. Но, система пока новая, она не обросла решениями от комьюнити, а браузерный API всё равно придётся дергать через JavaScript Interop. Для совсем кайфа нужно подождать годик, поскольку развитие идёт довольно быстро. Например, там нет очень нужного в таком деле hot reload, но в .NET 6 он уже анонсирован, и вроде как есть в превью, а релиз в ноябре.
#dev
Google Docs saytiga oid 7 mohirlik
#mohirlik / #docs
🔜 Nasib qilsa oktabr oylarida e'lon qilinishi reja qilingan "Kompyuter Savodxonligi" (KS) onlayn, pullik kursimiz uchun Word dasturini o'rgatish bilan birgalikda Google Docs dan foydalanish bo'yicha ham darslar kiritdik.
✅ Word'dan ko'ra qulayroq jihatlari bo'lgan Docs ni bir vaqtni o'zida bir qancha insonlar tomonidan ko'rish/o'zgartirish imkoniyati va undagi menyularni juda sodda tuzilgani ushbu saytdan foydalanishga undaydi. Undan tashqari Word kabi Docs da hech qanday aktivatsiyalar so'ralmaydi 😉.
📃 Sizlarga ulashmoqchi bo'lgan ushbu qo'llanma yuqorida aytib o'tilgan kursimizning bir darsi uchun tayyorlangan.
🌐Onlayn ko'rish I .PDF shaklida yuklash
❓KS kursimizni kutayotganlar bormi? (👍 = xa)
💻 Kompyuterni birga o'rganamiz ⤵️
TelegramIYouTube
Asinxron JavaScript (2-qism) || Async / await
Promiseda ketma-ket .then() methodini ko'p ishlatishdan saqlanish uchun Async/ await dan foydalanish tavsiya qilinadi.
async function fetchData(){
const response = await fetch("https://jsonplaceholder.typicode.com/todos/1")
const res = await response.json()
console.log(res);
}
Async / await da xatoliklar bilan ishlash uchun try / catch dan foydalanamiz
async function fetchData(){
try{
const response = await fetch("https://jsonplaceholder.typicode.com/todos/1")
const res = await response.json()
if(!res.ok){
throw new Error("show erorr")
}
console.log(res);
}
catch(err){
console.log(err);
}
}
Async kalit so'zi bilan boshlangan har qanday fungsiya bizga promise qaytarishini xisobga olsak xatoliklar bilan fungsiya chaqirilgan joyda ham ishlash mumkin.
async function fetchData(){
const response = await fetch("https://jsonplaceholder.typicode.com/todos/1")
const res = await response.json()
if(!res.ok){
throw new Error("show erorr")
}
return res
}
fetchData().then((data)=>{
console.log(data)
}).catch((err)=>{
console.log(err);
});
#javascript#docs
☑️@valisherbotirov
Asinxron JavaScript || Promise
JavaScriptda Promiseni new Promise() konstruktoriga argument sifatida o'zida resolve va reject argumentlarini qabul qilgan fungsiya berish bilan yaratamiz.
const myPromise = new Promise((resolve, reject) => {
let age = 21;
setTimeout(() =>{
if(age > 20)
resolve("Done processing")
else
reject("Error processing")
},2000)
})
Promisedan qaytgan malumotlarni then va catch methodlari bilan tutib olib qayta ishlaymiz
myPromise.then((res) =>{
console.log(res)
}).catch((err) =>{
console.log(err)
})
Agar promise fulfilled muvaffaqiyatli bo'lsa malumotlarni then methodi bilan, agar xatolik rejected bo'lsa unda catch methodida xatolikni tutib olishimiz mumkin!
#javascript#docs
☑️@valisherbotirov
Google Docs servisiga oid 10 mohirlik
#videodars / #docs / #word / manba
ℹ️ Microsoft Word dasturining o'rnini bosuvchi servislardan biri Google Docs hisoblanadi. Ushbu darsimizda servisga tegishli bo'lgan 10 ta mohirlik va ustuvor jihatlarini ko'rib chiqamiz.
🌐 Google Docs'ga quyidagi manzillar orqali kirishingiz mumkin:
- https://docs.google.com/
- https://docs.new/
📌Word dasturidagi "Сноска" funksiyasi haqida batafsil ma'lumot
🟢YouTube'da ko'rish (📲)
💽: 51.7 MB ⏳: 09:36
💻 Kompyuterni birga o'rganamiz ⤵️
TelegramIInstagramITikTokIYouTube
Sheets yoki Docs'da tayyorlangan hujjatni tezkor pdf qilib yuklash
#mohirlik / #docs / #sheets
⬇️ Google Sheets yoki Docs da tayyorlangan hujjatlarni onlayn ko'rish imkoniyati mavjud, lekin ba'zi telefonlarda ushbu saytlarda tayyorlangan hujjatlarni ko'rishda qiyinchilik bo'lishi mumkin. Bunday holatda hujjatga kirmasdan turib uni PDF holatida yuklashni tavsiya qilamiz.
➕ Buning uchun hujjat havolasiga /export?format=pdf qo'shib brauzerdan kirasiz, shunda hujjatning ayni vaqtdagi holati PDF shaklida yuklanib boshlaydi, masalan:
🔗 Hujjatimiz havolasi (onlayn ko'rish): https://docs.google.com/spreadsheets/d/1GzCdUFfKIgn2TJCYXEuNyBtYlg3BGoz2yS_-RnOIytI
📄 Uni .PDF holatida yuklash: https://docs.google.com/spreadsheets/d/1GzCdUFfKIgn2TJCYXEuNyBtYlg3BGoz2yS_-RnOIytI/export?format=pdf
😉 Kompyuter Savodxonligi kursimizda Sheets va Docs'ni o'rganish bo'yicha darslar yetarlicha amaliyotlar bilan berilgan: Kompyuterni professionallardan o'rganing!
💻 Kompyuterni birga o'rganamiz ⤵️
TelegramIYouTube
Welcome to Russia!
Congratulations, you became students in the Russian Federation! We are happy to welcome you and wish you success in academics, science and in your chosen speciality!
And to facilitate your adaptation in the new conditions, we have prepared for you a memo with the most up-to-date information that will be useful to you in Russia.
What can you learn from it?
❇️ Key phone numbers of government services, federal agencies and institutions;
❇️ Dates of major public holidays;
❇️ Information about the documents required to enter the country;
❇️ First 5 steps when arriving in Russia;
❇️ Information on departure;
❇️ Documents to carry out with you all the time;
❇️ Useful links and advices.
Download the attached document or follow the QR code in the comments.
Thanks to t.me/inostranets_v_RF
#global#info#docs
Bind()
Bind ni call va apply dan farqi funksiyani ishlatilgan joyida chaqirmasdan funksiyani this qiymatini biz berib yuborgan objectga o'zgartirib yangi funksiya yaratib qaytaradi. Uni biror o'zgaruvchiga tenglab olib ishlatishimiz mumkin bo'ladi.
function myFunc(){
console.log(this.age)
}
const obj = {
age:21
}
const newFunc = myFunc.bind(obj)
newFunc()
Bind da objectga qo'shib argument berib yuborish call ga o'xshash bo'ladi
bind(obj, arg1, arg2, ...)
#javascript#docs#interview_questions
☑️@valisherbotirov
Apply()
Apply methodi ham Call() bilan deyarli bir xil ishlaydi. Call() dan farqi funksiyaga argument berib yuborayotgan vaqtimiz argumentlarni array ko'rinishida beramiz.
function myFunc(args){
console.log(this.age + " " + args)
}
const obj = {
age:21
}
myFunc.apply(obj,["this is argument"])
```
call(obj, arg1, arg2, ...)
apply(obj, [arg1,arg2,...])`
#javascript#docs#interview_questions
☑️@valisherbotirov
JavaScriptda Call() , Apply() va Bind() methodlari.
Call() - JavaScriptda funksiyani chaqirish paytida this qiymatini o'zgartirish uchun ishlatiladi. Bu method orqali berib yuborgan objectimizni contextida shu funksiyani chaqirib beradi va funksiya ichida ishlatilgan this ni berib yuborilgan objectimizga tenglashtirib beradi.
Misollar orqali ko'ramiz :
function myFunc(){
console.log(this)
}
myFunc()
Bizda muFunc degan funksiyamiz bor va bu bizga xozir global Window objectini qaytaradi. Chunki fungsiya global scopeda chaqirilgan.
Endi funksiyaga call methodi orqali birorta object berib ko'ramiz.
function myFunc(){
console.log(this)
}
const obj = {
age:21
}
myFunc.call(obj)
Bu holda funksiyamiz bizga obj deb nomlangan objectimizni qaytaradi. Sababi call() methodi funksiyani obj objectini contextida chaqirib beryabdi va natijada funksiyani this qiymati bizning obj nomli objectimizga teng bo'lib qolyabdi.
Call() orqali argument berib yuborish
Call() bilan funksiyani chaqirgan vaqtimiz objectga qo'shib o'zimizda ixtiyoriy argument ham berib yuborishimiz mumkin.
function myFunc(args){
console.log(this.age + " " + args)
}
const obj = {
age:21
}
myFunc.call(obj,"this is argument")
#javascript#docs#interview_questions
☑️@valisherbotirov
JavaScript fungsiyalarda this kalit so'zidan foydalanish
Fungsiyaning ichida this kalit so'zidan foydalanganimizda this qiymati fungsiya qayerda chaqirilayotganiga bog'liq bo'ladi.
Misollar yordamida ko'rib o'tamiz!
function showThis (){
console.log(this)
}
showThis()
ushbu misolda this bizga JavaScriptdagi Window objectini qaytaradi. Sababi biz fungsiyani global scope ichida chaqiryabmiz.
const person = {
name : "Valisher",
fetchName:function(){
console.log(this.name) // Valisher
}
}
person.fetchName()
bu misolda esa this bizga person objectini qaytaradi. Sababi fetchName fungsiyasi person objectini xossasi bo'lgani uchun fungsiyani chaqirgan vaqtimiz this person objectini qaytaradi.
const person = {
name : "Valisher",
fetchName:function(){
console.log(this.name)
}
}
const getName = person.fetchName
const person2 = {
name : "John",
getName
}
person2.getName() // John
ushbu misolda esa this kalit so'zi person2 objectini qaytaradi. Sababi biz person1 objectidagi fetchName fungiyasini getName o'zgaruvchisiga tenglab olib uni esa person2 objectiga property sifatida beryabmiz. Natijada this bizga person2 objectini qaytarib beryabdi.
#javascript#docs#interview_questions
☑️@valisherbotirov