Reaksiyalarni portlatamiz๐งจ
Kompyuteringizda sinab koสปring!
Consolega nima chiqadi?
#absJavaScript
https://t.me/abs_Java_Script
Kompyuteringizda sinab koสปring!
Consolega nima chiqadi?
JavaScript
#absJavaScript
https://t.me/abs_Java_Script
๐2โก1โคโ๐ฅ1๐ฅ1๐1๐1
#Dars16 #JS #absJavaScript #JavaScript #Foydali
โก๏ธโก๏ธโก๏ธ
Buni kompyuteringizda sinab koสปring.
HTML ochib, unga JS ni ulab, JS ga yozing va "Open with LiveServer". "Parol yozin"ga parol oสปylab toping ๐๐.
๐
๐ t.me/absJavaScript
โก๏ธโก๏ธโก๏ธ
Buni kompyuteringizda sinab koสปring.
HTML ochib, unga JS ni ulab, JS ga yozing va "Open with LiveServer". "Parol yozin"ga parol oสปylab toping ๐๐.
let parol = prompt('Kirish uchun parolni kiriting')
if(parol == "Parol yozin"){
alert("Parol to'g'ri, saytdan foydalanishingiz mumkin!")
else{
location.reload()
}๐ t.me/absJavaScript
โคโ๐ฅ1โก1๐1๐1๐1๐1
#JavaScript #absJavaScript
Insonlar aldashi mumkin, lekin raqamlar aldamaydi ๐
๐ Dasturchilarning koโpchiligi telefonga nisbatan kompyuterdan koโproq foydalanadilar.
โ Ular web-saytlarga asosan kompyuterdan kiriladi deb oโylaydilar.
โ ๏ธ Buning oqibatida web-saytlarning responsivligiga kam eโtibor berishadi.
โผ๏ธ Lekin raqamlar shuni koโrsatmoqda-ki, biz kattaroq eโtiborni responsivlikka qaratishimiz kerak ekan.
(Maสผlumot oสปrnida aytish mumkinki "RESPONSIVE" bu - saytni bir turdagi emas balki bir necha turdagi yani telefon ๐ฑ, noutbuk๐ป, planshet๐ฅ va boshqa turdagi gadgetlarga ham moslab yaratish โ
.)
Postni Do'stlarga ham share qilaylik โก๏ธ
๐ t.me/absJavaScript
Insonlar aldashi mumkin, lekin raqamlar aldamaydi ๐
๐ Dasturchilarning koโpchiligi telefonga nisbatan kompyuterdan koโproq foydalanadilar.
โ Ular web-saytlarga asosan kompyuterdan kiriladi deb oโylaydilar.
โ ๏ธ Buning oqibatida web-saytlarning responsivligiga kam eโtibor berishadi.
โผ๏ธ Lekin raqamlar shuni koโrsatmoqda-ki, biz kattaroq eโtiborni responsivlikka qaratishimiz kerak ekan.
Postni Do'stlarga ham share qilaylik โก๏ธ
๐ t.me/absJavaScript
โก2โคโ๐ฅ1๐1๐ฅ1๐1
#challenge #snow #JavaScript #absJavaScript #HTML #CSS #JS #winter
Sinab koสปringchi nima chiqar ekan ๐.
Code ๐
Sinab koสปringchi nima chiqar ekan ๐.
Code ๐
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="CONTENT-TYPE" content="text/html; charset=UTF-8">
<title>Snow</title>
</head>
<body>
<section class="section">
<div class="section-container">
<img class="section-container-img" href="https://images.app.goo.gl/8ctwMkEr5ZurDYLR6" alt="snow-icon">
<button class="print">Print</button>
</div>
</section>
</body>
</html>
*{
margin: 0;
padding: 0;
}
.section{
padding-top: 75px;
padding-bottom: 75px;
bacground-color: #2BBFFF;
}
.section-container{
margin-left: auto;
margin-right: auto;
width: 1200px;
display: flex;
justify-content: space-between;
}
.section-container-img{
width: 100px;
height: 100px;
}
.print{
padding: 10px;
color: #000;
bacground-color: #FFF;
border-radius: 8px;
border: none;
}let btn = document.querySelector('.print');
btn.addEventListener('click', function(){
print();
});โ2โคโ๐ฅ1๐1๐ฅ1๐1๐1
#JS #CSS #HTML #absJavaScript #JavaScript #Tutorial #Foydali
Frontend dasturchi bo'lish uchun , nimalarni bilishim kerak โ๏ธ
Asosiysi โ html , css va javascript ni bilishiz kerak.
Tekinga o'rganish uchun manbalar:
1โฃ. https://www.youtube.com/watch?v=WXDDLyTI2Dk
2โฃ. https://www.youtube.com/watch?v=KcJESju6KDs
html( boshlang'ich ) โ https://www.youtube.com/watch?v=xcGtfYUfDLo&list=PLHNaMQIyrDHOZhHnc2UdQEOHrb1xM7HaF
html( yuqori ) โ https://www.youtube.com/watch?v=OdkbJgQUrZ0&list=PLXJSt32YUa4V2XJRrR2tkJTf_MPsiY32m&index=18
1โฃ. https://www.youtube.com/watch?v=cUz7lqCNn1A&list=PLXJSt32YUa4U3kviEXBjQ9MJud0Xi-8P8( 9 ta darsni tugating )
2โฃ. https://www.youtube.com/watch?v=Zn5uwsNdTjE&list=PLXJSt32YUa4XbOFdKE8uwCbccpD-nGaPL&index=5( 25 ta darsni tugatish )
1โฃ. https://www.youtube.com/watch?v=al4u2WER84Q
2โฃ. https://www.youtube.com/watch?v=jWW18aIECWg&t=12s
3โฃ. https://www.youtube.com/watch?v=hJTcMmWB888&t=2s
1โฃ. https://www.youtube.com/watch?v=zJuDsji3IbE&list=PLNS3PujVHR-ay0HpqbsPWccgEhJZk6K9u(to'liq tugatish)
2โฃ. https://youtu.be/CdlPHoTmZqU?si=0bnqscbKBzUOaYC3
3โฃ. https://youtu.be/Q3tFsK9B6S4?si=C_vFkCNG6CI6ShHH
4โฃ. https://youtu.be/lvHCgNKvODs?si=3piXfbdjmP41PUIy
๐ซ Hoziroq obuna bo'ling va do'stlarga ham ulashib qo'ying
โ https://t.me/absJavaScript
Frontend dasturchi bo'lish uchun , nimalarni bilishim kerak โ๏ธ
Asosiysi โ html , css va javascript ni bilishiz kerak.
Tekinga o'rganish uchun manbalar:
Dasturlashga kirishdan oldin , qisqacha malumot:
1โฃ. https://www.youtube.com/watch?v=WXDDLyTI2Dk
2โฃ. https://www.youtube.com/watch?v=KcJESju6KDs
HTML ni o'rganish uchun:
html
html
CSS ni o'rganish uchun:
1โฃ. https://www.youtube.com/watch?v=cUz7lqCNn1A&list=PLXJSt32YUa4U3kviEXBjQ9MJud0Xi-8P8
2โฃ. https://www.youtube.com/watch?v=Zn5uwsNdTjE&list=PLXJSt32YUa4XbOFdKE8uwCbccpD-nGaPL&index=5
CSS da amalyot qilish uchun:
1โฃ. https://www.youtube.com/watch?v=al4u2WER84Q
2โฃ. https://www.youtube.com/watch?v=jWW18aIECWg&t=12s
3โฃ. https://www.youtube.com/watch?v=hJTcMmWB888&t=2s
javascript ni o'rganish uchun:
1โฃ. https://www.youtube.com/watch?v=zJuDsji3IbE&list=PLNS3PujVHR-ay0HpqbsPWccgEhJZk6K9u
2โฃ. https://youtu.be/CdlPHoTmZqU?si=0bnqscbKBzUOaYC3
3โฃ. https://youtu.be/Q3tFsK9B6S4?si=C_vFkCNG6CI6ShHH
4โฃ. https://youtu.be/lvHCgNKvODs?si=3piXfbdjmP41PUIy
โก๏ธJavaScript
๐ซ Hoziroq obuna bo'ling va do'stlarga ham ulashib qo'ying
โ https://t.me/absJavaScript
โคโ๐ฅ1โ1๐1๐ฅ1๐1๐1
#JavaScript #Dasturlash #WebDasturlash #Frontend #HTML #CSS #JS #Programmer #CodingLife #WebDevelopment #absJavaScript
โน๏ธ JavaScript (JS) โ bu veb-saytlar, dasturlar va hatto serverlarni yaratishda ishlatiladigan kuchli dasturlash tili.
๐ด JS Nimaga Kerak?
โ
Dinamik veb-sahifalar yaratish
โ
Tugmalar, animatsiyalar, modal oynalar qoโshish
โ
Ma'lumotlarni qayta ishlash va API'lar bilan ishlash
๐ด Dastlabki "JS" kodingiz
Quyidagi kod ekranga "Salom, JavaScript!" deb chiqaradi:
Bu kodni browserning console oynasida yoki Node.js muhiti orqali ishlatishingiz mumkin!
โSavol: "JavaScript" qaysi sohalarda ishlatiladi? Kommentda fikr qoldiring!
โญ Keyingi postda "JavaScriptni qanday ishlatamiz?" yoritiladi.
๐ @absJavaScript | #JaSc@absJavaScript
1. JavaScript nima? Nega uni oโrganish kerak?
โน๏ธ JavaScript (JS) โ bu veb-saytlar, dasturlar va hatto serverlarni yaratishda ishlatiladigan kuchli dasturlash tili.
๐ด JS Nimaga Kerak?
๐ด Dastlabki "JS" kodingiz
Quyidagi kod ekranga "Salom, JavaScript!" deb chiqaradi:
console.log("Salom, JavaScript!");Bu kodni browserning console oynasida yoki Node.js muhiti orqali ishlatishingiz mumkin!
โญ Keyingi postda "JavaScriptni qanday ishlatamiz?" yoritiladi.
๐ @absJavaScript | #JaSc@absJavaScript
๐2๐ฅ2โคโ๐ฅ1โก1
#JavaScript #Dasturlash #WebDasturlash #Frontend #HTML #JS #CodingLife #JavaScriptTutorial #absJavaScript
JavaScript kodini uch xil usulda ishlatish mumkin:
1๏ธโฃ HTML ichida <script> orqali
Eng oddiy usul โ HTML hujjatining ichida yozish:
๐ Bu kod sahifa yuklanganda alert oynasini chiqaradi.
2๏ธโฃ Alohida ".js" fayl orqali
Kodingizni alohida .js faylga yozib, HTML bilan bogโlash yaxshiroq:
๐ Bunda barcha JavaScript kodi script.js faylida boโladi.
3๏ธโฃ Brauzer console orqali
Agar siz tezda kodni tekshirmoqchi boโlsangiz:
1๏ธโฃ Chrome yoki Firefoxโni oching
2๏ธโฃ F12 tugmasini bosing
3๏ธโฃ Console oynasiga quyidagi kodni yozing
๐ Bu kod consoleโda "JavaScript ishladi!" deb chiqaradi.
โฎ Avvalgi postda "JavaScript nima? Nega uni oโrganish kerak?" yoritilgan.
โญ Keyingi postda "HTML, CSS va JavaScript โ ularning farqi nima?" yoritiladi.
๐ @absJavaScript | #JaSc@absJavaScript
2. JavaScriptni Qanday Ishlatamiz?
JavaScript kodini uch xil usulda ishlatish mumkin:
1๏ธโฃ HTML ichida <script> orqali
Eng oddiy usul โ HTML hujjatining ichida yozish:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS Boshlanishi</title>
</head>
<body>
<h1>Salom, JavaScript!</h1>
<script>
alert("Bu JavaScript!");
</script>
</body>
</html>
๐ Bu kod sahifa yuklanganda alert oynasini chiqaradi.
2๏ธโฃ Alohida ".js" fayl orqali
Kodingizni alohida .js faylga yozib, HTML bilan bogโlash yaxshiroq:
<script src="script.js"></script>
๐ Bunda barcha JavaScript kodi script.js faylida boโladi.
3๏ธโฃ Brauzer console orqali
Agar siz tezda kodni tekshirmoqchi boโlsangiz:
1๏ธโฃ Chrome yoki Firefoxโni oching
2๏ธโฃ F12 tugmasini bosing
3๏ธโฃ Console oynasiga quyidagi kodni yozing
console.log("JavaScript ishladi!");๐ Bu kod consoleโda "JavaScript ishladi!" deb chiqaradi.
โฎ Avvalgi postda "JavaScript nima? Nega uni oโrganish kerak?" yoritilgan.
โญ Keyingi postda "HTML, CSS va JavaScript โ ularning farqi nima?" yoritiladi.
๐ @absJavaScript | #JaSc@absJavaScript
๐2โคโ๐ฅ1๐1๐ฅ1
#HTML #CSS #JS #absJavaScript
โน๏ธ Agar veb-dasturlashni oโrganmoqchi boโlsangiz, uchta asosiy texnologiyani bilishingiz kerak:
๐ HTML โ Tuzilma (Structure)
HTML (HyperText Markup Language) โ bu veb-sahifaning asosiy skeleti. U matnlar, rasmlar, tugmalar va boshqa elementlarni joylashtirish uchun ishlatiladi.
Misol:
๐ CSS โ Dizayn (Style)
CSS (Cascading Style Sheets) โ veb-sahifalarga goโzallik beradi. Rang, shrift, joylashuv kabi xususiyatlarni belgilaydi.
Misol:
๐ JavaScript โ Interaktivlik (Interaction)
JavaScript โ bu veb-sahifaga jon beradi. Tugmalar, modal oynalar, animatsiyalar yaratish va maโlumotlarni qayta ishlash uchun ishlatiladi.
Misol:
๐ HTML โ skelet, CSS โ bezak, JavaScript โ harakat!
โฎ Oldingi postda "JavaScriptni qanday ishlatamiz?" yoritilgan.
โญ Keyingi postda "HTML asoslari - dastlabki sahifamiz." yoritiladi.
๐ @absJavaScript | #JaSc@absJavaScript
3. HTML, CSS va JavaScript โ
ularning farqi nima?
โน๏ธ Agar veb-dasturlashni oโrganmoqchi boโlsangiz, uchta asosiy texnologiyani bilishingiz kerak:
๐ HTML โ Tuzilma (Structure)
HTML (HyperText Markup Language) โ bu veb-sahifaning asosiy skeleti. U matnlar, rasmlar, tugmalar va boshqa elementlarni joylashtirish uchun ishlatiladi.
Misol:
<h1>Bu sarlavha</h1>
<p>Bu oddiy matn.</p>
๐ CSS โ Dizayn (Style)
CSS (Cascading Style Sheets) โ veb-sahifalarga goโzallik beradi. Rang, shrift, joylashuv kabi xususiyatlarni belgilaydi.
Misol:
h1 {
color: blue;
font-size: 24px;
}๐ JavaScript โ Interaktivlik (Interaction)
JavaScript โ bu veb-sahifaga jon beradi. Tugmalar, modal oynalar, animatsiyalar yaratish va maโlumotlarni qayta ishlash uchun ishlatiladi.
Misol:
document.querySelector("h1").style.color = "red"; ๐ HTML โ skelet, CSS โ bezak, JavaScript โ harakat!
โฎ Oldingi postda "JavaScriptni qanday ishlatamiz?" yoritilgan.
โญ Keyingi postda "HTML asoslari - dastlabki sahifamiz." yoritiladi.
๐ @absJavaScript | #JaSc@absJavaScript
โคโ๐ฅ2๐ฅ2๐1
#Set #absJavaScript
Set โ bu to'plam. Faqat bunda har bir element bir marotaba foydalanishi mumkin.
๐ @absJavaScript
Set
Set โ bu to'plam. Faqat bunda har bir element bir marotaba foydalanishi mumkin.
let set = new Set() โ yangi Set yaratildi.set.add("abs") โ qiymat qo'shildiset.delete("abs") โ qiymat olib tashlandi.set.has("abs") โ qiymat bor yo'qligi tekshiradi . Bor bo'lsa true aksida bo'lsa false set.clear() โ ma'lumotlarni tozalaydiset.size โ elementlar soni๐ @absJavaScript
๐จโ๐ป2โคโ๐ฅ1๐1๐ฅ1
11. โ JavaScript sintaksisi va konsol
๐ JavaScriptga ilk qadam!
Assalomu alaykum, dasturlashga qiziqqan doโstlar!
Bugun siz bilan JavaScript sintaksisi bilan tanishamiz va konsolda kod yozishni oโrganamiz.
โ๏ธ Sintaksis โ bu dasturlash tilining grammatikasi. Toโgโri sintaksis yozilmasa, kod ishlamaydi.
console.log("Salom, JavaScript!");๐ console.log() โ bu brauzerning konsolida maโlumot chiqarish uchun ishlatiladi.
๐ฅ Konsolni ochish uchun:
โข Chrome:
F12 โ โConsoleโโข Firefox:
Ctrl + Shift + KMisol:
console.log(5 + 3); // 8
console.log("Bugun dars 11");
Siz uchun vazifa:
Oโzingiz haqingizda 3 ta
console.log() yozing.โญ Keyingi postda "O'zgaruvchilar: var, let, const" haqida oโrganamiz.
๐ @absJavaScript | #JaSc@absJavaScript
โคโ๐ฅ1๐1