Kecha qilishim kerak bo'lgan maketlar borligi uchun qoshimcha loyiha qila olmadim , kechagi kun hisobiga bugun ertalab yangi loyiha qildim. Menimcha ko'p chilikga qiziq bolsa kerak bu loyiha.
๐ฅ1
Rasmlardan nusxa olish
Oldin textlardan nusha olish bo'yicha amalyot qilgan edim. Rasmlardan nusha olish textlardan nusxa olishga o'xshab ketadi lekin rasmlarda bazi qoshimchalar qoshiladi.
Link: https://timely-klepon-55492b.netlify.app/
GitHub:https://github.com/Abdulvahobjon/js-project-30
@abs_javascript
Oldin textlardan nusha olish bo'yicha amalyot qilgan edim. Rasmlardan nusha olish textlardan nusxa olishga o'xshab ketadi lekin rasmlarda bazi qoshimchalar qoshiladi.
Link: https://timely-klepon-55492b.netlify.app/
GitHub:https://github.com/Abdulvahobjon/js-project-30
@abs_javascript
โค3๐1
width vs naturalWidth
height vs naturalHeight
JavaScriptda rasmni uzunligi va balandligini olmoqchi bo'lganizda sizga html va css dan bergan o'lchamlarizni qaytaradi.
naturalWidth esa rasmni o'zini default holatidagi olchamni qaytaradi ( rasmni o'lchamini o'zgartirilmagan holatdagi holati)
@abs_javascript
height vs naturalHeight
let uzunlik = img.width
JavaScriptda rasmni uzunligi va balandligini olmoqchi bo'lganizda sizga html va css dan bergan o'lchamlarizni qaytaradi.
let uzunlik = img.naturalWidth
naturalWidth esa rasmni o'zini default holatidagi olchamni qaytaradi ( rasmni o'lchamini o'zgartirilmagan holatdagi holati)
@abs_javascript
๐ฅ5๐2
JavaScript
Rasmlardan nusxa olish Oldin textlardan nusha olish bo'yicha amalyot qilgan edim. Rasmlardan nusha olish textlardan nusxa olishga o'xshab ketadi lekin rasmlarda bazi qoshimchalar qoshiladi. Link: https://timely-klepon-55492b.netlify.app/ GitHub:https://โฆ
Responsive qilmagan ekanman ๐คฆ๐ปโโ๏ธ , hozir to'g'rilab qoydim.
Endi telefon danham kirib ishlatib ko'rsaiz bo'ladi.๐
Endi telefon danham kirib ishlatib ko'rsaiz bo'ladi.๐
๐3๐1
Webpack
Webpack - bu JavaScript , CSS va boshqa asosiy fayillarni o'z ichiga oladi. Ularni Web(www) uchun optimallashtirilgan tarzda birlashtiradi.
@abs_javascript
Webpack - bu JavaScript , CSS va boshqa asosiy fayillarni o'z ichiga oladi. Ularni Web(www) uchun optimallashtirilgan tarzda birlashtiradi.
@abs_javascript
๐ฅ4โค1๐1๐ค1๐ณ1
+ Webpack
Shuningdek Webpace - SASS yoki TypeScript kompilyatsiyalarini npn orqali o'zi amalga oshiradi. Yani codlarimizni Web brauzer tushunadigan tilga o'girib beradi.
@abs_javascript
Shuningdek Webpace - SASS yoki TypeScript kompilyatsiyalarini npn orqali o'zi amalga oshiradi. Yani codlarimizni Web brauzer tushunadigan tilga o'girib beradi.
@abs_javascript
๐4
NPM nima ?
NPM - Node Package Managerning (Node paket boshqaruvchisi) qisqartmasidir. Bu, Node.js platformasi uchun dasturlarni boshqarish va ulardan foydalanish uchun yaratilgan paket boshqaruvchisi (package manager)dir.
@abs_javascript
NPM - Node Package Managerning (Node paket boshqaruvchisi) qisqartmasidir. Bu, Node.js platformasi uchun dasturlarni boshqarish va ulardan foydalanish uchun yaratilgan paket boshqaruvchisi (package manager)dir.
@abs_javascript
๐8
1. ReferenceError
Agar o'zgaruvchi yoki function nomiga , undan oldin murojat qilinsa ReferenceError paydo bo'ladi.
@abs_javascript
let myFunction= function() {
console.log('ABS JavaScript');
}
console.log(myArray[2]);
let myArray = [1, 2, 3];
Agar o'zgaruvchi yoki function nomiga , undan oldin murojat qilinsa ReferenceError paydo bo'ladi.
@abs_javascript
๐5โค1
package.js
dependencies vs devDependencies farqi nima ?
dependencies - bu loyiha ishga tushirilganda kerak bo'ladigan modullarni(paketlarni) o'z ichiga oladi.
npm install orqalio'rnatiladi.
devDependencies - qismi esa faqatgina loyiha tayyor bo'lguniga qadar kerak boladi. misol uchun.
@abs_javascript
dependencies vs devDependencies farqi nima ?
dependencies - bu loyiha ishga tushirilganda kerak bo'ladigan modullarni(paketlarni) o'z ichiga oladi.
npm install orqalio'rnatiladi.
"dependencies": {
"react": "^17.0.2",
"express": "^4.17.1"
}
devDependencies - qismi esa faqatgina loyiha tayyor bo'lguniga qadar kerak boladi. misol uchun.
"devDependencies": {
"babel": "^7.15.4",
"webpack": "^4.29.5"
}
@abs_javascript
โค6
Counter
Bugun oddiyroq loyiha qildim , boshqa ishlarga vaqt ko'p ketib qoldi.
2 ta button va 2 ta select dan iborat ozgina noodatiyroq counter yasadim.
1. Son qo'shish
2. Son ayirish
3. Qo'shish va Ayirish darajasini belgilash
4. localStorage ga o'zgarishlarni saqlab qoladi.
Link: https://abdulvahob-count.netlify.app/
GitHub: https://github.com/Abdulvahobjon/js-project-30
@abs_javascript
Bugun oddiyroq loyiha qildim , boshqa ishlarga vaqt ko'p ketib qoldi.
2 ta button va 2 ta select dan iborat ozgina noodatiyroq counter yasadim.
1. Son qo'shish
2. Son ayirish
3. Qo'shish va Ayirish darajasini belgilash
4. localStorage ga o'zgarishlarni saqlab qoladi.
Link: https://abdulvahob-count.netlify.app/
GitHub: https://github.com/Abdulvahobjon/js-project-30
@abs_javascript
๐ฅ6๐3
remove() nima ?
HTML dan elementni tag tugi bilan olib tashlash uchun ishlatiladi.
SEVGI.remove()
@abs_javascript
HTML dan elementni tag tugi bilan olib tashlash uchun ishlatiladi.
SEVGI.remove()
@abs_javascript
๐13
๐6โค3
focus() nima ?
Elementlarga focus tushurish uchun ishlatiladi. (TAP bosganda focus tushdi)
โโโโ
Meni focusim buzilib qolgan bolsa kerak!!!
@abs_javascript
Elementlarga focus tushurish uchun ishlatiladi. (TAP bosganda focus tushdi)
โโโโ
Meni focusim buzilib qolgan bolsa kerak!!!
@abs_javascript
โค3๐3
Buttonni bosganda inputga focus tushadi.
@abs_javascript
<input type="text" id="username">
<button onclick="focusInput()">Input maydoniga fokus bering</button>
<script>
function focusInput() {
// Input maydoniga fokus berish
document.getElementById('username').focus();
}
</script>
@abs_javascript
โค6๐1
Bazi insonlarni hayotini Math.Random() qilib yuborging kelib ketadi yoki o'zingnikini.
console.error("O'zing bilan o'zing kelisha olmaganda๐ก") => console oynasiga error habarini chiqarish
@abs_javascript
console.error("O'zing bilan o'zing kelisha olmaganda๐ก") => console oynasiga error habarini chiqarish
@abs_javascript
๐ฅ8๐1
#xazil
Barcha katta tarjibali, obro'li mutahasislar o'zlarini "backend developer" deb atashadi va mijozlar tomonidagi ishlarni bajarishdan bosh tortishadilar , shuning uchun mijoz tomonini tajribasiz , kichik va unchalik hurmatli bo'lmagan muhandislarga qoldiriladi๐๐
1 yoshga qariganliklaring bilan frontendchilar ๐คฃ
@abs_javascript
Barcha katta tarjibali, obro'li mutahasislar o'zlarini "backend developer" deb atashadi va mijozlar tomonidagi ishlarni bajarishdan bosh tortishadilar , shuning uchun mijoz tomonini tajribasiz , kichik va unchalik hurmatli bo'lmagan muhandislarga qoldiriladi๐๐
1 yoshga qariganliklaring bilan frontendchilar ๐คฃ
@abs_javascript
๐5๐3
E ukam Lorem dan kamroq qil , Hozir miyyanga Return dan berib , butun tanangni Filter qilib yuboraman, ikki hafta localStorage da qolib ketasan , iltimos aka Clear qilib yuboring desangham foydasi yo'q oma.
@abs_javascript
@abs_javascript
๐คฃ15๐2โค1
REST API nima ?
Cluent va Server o'rtasida turuvchi ma'lumot almashishi uchun ishlatiladigan inerface.
@abs_javascript
Cluent va Server o'rtasida turuvchi ma'lumot almashishi uchun ishlatiladigan inerface.
@abs_javascript
๐5๐ฅ1