Frontend pinned Β«#sorovnoma
Barchaga Assalomu aleykum π Ushbu so'rovnomada faol qatnashishingiz so'rab qo'lamiz! Boisi kanalimiz rivoji va sizlarga foydali bo'ladigan kontentlar tayyorlashimiz uchun. Rahmat ))Β»
Barchaga Assalomu aleykum π Ushbu so'rovnomada faol qatnashishingiz so'rab qo'lamiz! Boisi kanalimiz rivoji va sizlarga foydali bo'ladigan kontentlar tayyorlashimiz uchun. Rahmat ))Β»
#tavsiya #tajriba
π§ Sodda yechimlarni, murakkab yechimlardan ustun qo'ying (KISS printsipi)
"KISS printsipi" dasturlashda sodda va tushunarli kod yozishga qaratilgan bir tamoyil hisoblanadi. KISS so'zi "Keep It Simple, Stupid" degan iboraning bosh harflaridan tashkil topgan. Bu printsipga asosan, dasturchilar murakkab logika va arxitektura yordamida yozgan kodingizni kelajakda tushunishi, optimizatsiya qilishni va kengaytirishi kerak bo'ladigan dasturchilar haqida o'ylashlari kerak. Bu dasturchiga yarim yildan keyin o'zingiz aylanishingiz mumkin:) Kerak bo'lmagan joyda turli xil dasturiy tamoyillarni, arxitektura shablonlarini, dasturiy tillarning yangi xususiyatlarini v.k. ishlatishga urunmang! Chunki bu kodingizga ortiqcha murakkablik qo'shadi.
Sodda, tushunarli kod, genial va murakkab koddan yaxshiroq, chunki u o'qish va o'rganish, kengaytirish va debug qilish osonroq.
Loyihalaringizni arxitekturasini soddalashtirishga uruning. Bu sizga vaqt, xarajat va muammolardan tejaydi.
ππΌ @FrontEnd ππΌ
π§ Sodda yechimlarni, murakkab yechimlardan ustun qo'ying (KISS printsipi)
"KISS printsipi" dasturlashda sodda va tushunarli kod yozishga qaratilgan bir tamoyil hisoblanadi. KISS so'zi "Keep It Simple, Stupid" degan iboraning bosh harflaridan tashkil topgan. Bu printsipga asosan, dasturchilar murakkab logika va arxitektura yordamida yozgan kodingizni kelajakda tushunishi, optimizatsiya qilishni va kengaytirishi kerak bo'ladigan dasturchilar haqida o'ylashlari kerak. Bu dasturchiga yarim yildan keyin o'zingiz aylanishingiz mumkin:) Kerak bo'lmagan joyda turli xil dasturiy tamoyillarni, arxitektura shablonlarini, dasturiy tillarning yangi xususiyatlarini v.k. ishlatishga urunmang! Chunki bu kodingizga ortiqcha murakkablik qo'shadi.
Sodda, tushunarli kod, genial va murakkab koddan yaxshiroq, chunki u o'qish va o'rganish, kengaytirish va debug qilish osonroq.
Loyihalaringizni arxitekturasini soddalashtirishga uruning. Bu sizga vaqt, xarajat va muammolardan tejaydi.
ππΌ @FrontEnd ππΌ
Amaliyot qilish uchun TOP manbalar π
π Tayyor Dizayn shablonlari orqali HTML, CSS imkoniyatlaringizni kuchaytiring β codewell.cc
π Murakkabroq Frontend loyihalarida o'zingizni sinang β frontendpractice.com
π Bir oylik javascript chellenji orqali JS bo'yicha bilimlaringizni oshiring β javascript30.com
π CSSga doir turli darajadagi vazifalar jamlanmasi β cssbattle.dev
π Frontend boβyicha musobaqa oβtkazish uchun ajoyib sayt β 100dayscss.com
Frontendchilar kanali ππΌ @Frontend ππΌ
π Tayyor Dizayn shablonlari orqali HTML, CSS imkoniyatlaringizni kuchaytiring β codewell.cc
π Murakkabroq Frontend loyihalarida o'zingizni sinang β frontendpractice.com
π Bir oylik javascript chellenji orqali JS bo'yicha bilimlaringizni oshiring β javascript30.com
π CSSga doir turli darajadagi vazifalar jamlanmasi β cssbattle.dev
π Frontend boβyicha musobaqa oβtkazish uchun ajoyib sayt β 100dayscss.com
Frontendchilar kanali ππΌ @Frontend ππΌ
π5π₯1
This media is not supported in your browser
VIEW IN TELEGRAM
Bu holat hamma Frontend'chilarning boshidan oβtgan boβlsa kerak, shundaymi? π
Frontendchilar kanali ππΌ @Frontend
Frontendchilar kanali ππΌ @Frontend
π14π―2π1
let a = 5;ππ» @FrontendIQ > #js
let b = a-- + ++a;
let c = a++ - --b;
console.log(a+b+c);
β‘7π1
#amaliyot #api
Amaliyot qilish uchun 7 ta ajoyib bepul API π»
1οΈβ£ Web Search API
Agar siz Google kabi qidiruv tizimini yaratmoqchi bo'lsangiz yoki oddiy qidiruv tizimi vidjeti qilmoqchi bo'lsangiz, Web Search API buning uchun ajoyib vositadir.
Web Search
2οΈβ£ Open Weather Map API
Open Weather Map - bu dunyo bo'ylab so'nggi ob-havo haqida ma'lumot beruvchi bepul API. Siz qilishingiz kerak bo'lgan narsa shahar nomi yoki mamlakat nomini ko'rsatish va u o'sha hudud uchun ob-havo ma'lumotlarini qaytaradi
Open Weather Map
3οΈβ£ IMDB API
Agar siz kino ilovasini yaratmoqchi bo'lsangiz, IMDB API yana bir ajoyib API bo'lib, u so'ralgan filmlar, aktyorlar, seriallar, treylerlar, kino ratinlari va boshqalar uchun ma'lumotlarni qaytaradi.
IMDB
4οΈβ£ News API
News API ajoyib bepul API bo'lib, u sizga dunyo miqyosidagi yangiliklar haqidagi ma'lumotlarni taqdim etadi.
News
5οΈβ£ Instagram API
Instagram klonini yaratmoqchi bo'lsangiz. Instagram-dan real vaqtda ma'lumotlarni taqdim etadigan ushbu ajoyib bepul API-dan foydalanishingiz mumkin.
Instagram
6οΈβ£ API-Football
Agar siz Futbol natijalari ilovasini yaratmoqchi bo'lsangiz, API-Football siz uchun API bo'lib, u +940 futbol ligalari va kuboklarini taqdim etadi. Har 15 soniyada jonli va o'yindan oldingi koeffitsientlar, voqealar, tarkiblar, murabbiylar, o'yinchilar, eng yaxshi to'purarlar, turnir jadvali, statistika, transferlar.
API-Futbol
7οΈβ£ Meme Generator API
Meme Generator API - bu oddiy mem generatori bo'lib, u oldindan yuklangan tasvirni asosida memlarni yaratadi. Memlar JPEG tasvir fayl formatida taqdim etiladi.
Meme Generator
Do'stlaringizga ham ulashib qo'ying π
Bizga qo'shiling ππΌ @Frontend ππΌ
Amaliyot qilish uchun 7 ta ajoyib bepul API π»
1οΈβ£ Web Search API
Agar siz Google kabi qidiruv tizimini yaratmoqchi bo'lsangiz yoki oddiy qidiruv tizimi vidjeti qilmoqchi bo'lsangiz, Web Search API buning uchun ajoyib vositadir.
Web Search
2οΈβ£ Open Weather Map API
Open Weather Map - bu dunyo bo'ylab so'nggi ob-havo haqida ma'lumot beruvchi bepul API. Siz qilishingiz kerak bo'lgan narsa shahar nomi yoki mamlakat nomini ko'rsatish va u o'sha hudud uchun ob-havo ma'lumotlarini qaytaradi
Open Weather Map
3οΈβ£ IMDB API
Agar siz kino ilovasini yaratmoqchi bo'lsangiz, IMDB API yana bir ajoyib API bo'lib, u so'ralgan filmlar, aktyorlar, seriallar, treylerlar, kino ratinlari va boshqalar uchun ma'lumotlarni qaytaradi.
IMDB
4οΈβ£ News API
News API ajoyib bepul API bo'lib, u sizga dunyo miqyosidagi yangiliklar haqidagi ma'lumotlarni taqdim etadi.
News
5οΈβ£ Instagram API
Instagram klonini yaratmoqchi bo'lsangiz. Instagram-dan real vaqtda ma'lumotlarni taqdim etadigan ushbu ajoyib bepul API-dan foydalanishingiz mumkin.
6οΈβ£ API-Football
Agar siz Futbol natijalari ilovasini yaratmoqchi bo'lsangiz, API-Football siz uchun API bo'lib, u +940 futbol ligalari va kuboklarini taqdim etadi. Har 15 soniyada jonli va o'yindan oldingi koeffitsientlar, voqealar, tarkiblar, murabbiylar, o'yinchilar, eng yaxshi to'purarlar, turnir jadvali, statistika, transferlar.
API-Futbol
7οΈβ£ Meme Generator API
Meme Generator API - bu oddiy mem generatori bo'lib, u oldindan yuklangan tasvirni asosida memlarni yaratadi. Memlar JPEG tasvir fayl formatida taqdim etiladi.
Meme Generator
Dunyoning eng katta API hubi - rapidapi.com
Do'stlaringizga ham ulashib qo'ying π
Bizga qo'shiling ππΌ @Frontend ππΌ
π4π₯3
#js
Topshiriq: Massivdagi har bir elementni sonini aniqlash.
Yechim:
Natija:
Bu JavaScript funktsiyasi berilgan massivdagi har bir elementni sanaydi va natijani obyekt (object) ko'rinishida qaytaradi. Funksiyada reduce metodidan foydalanilgan. reduce metodi massivdagi har bir elementni bitta qiymatga o'zlashtirish imkonini beradi.
Sizda qanday yechim bor, izohlarda yozib qoldiring π¬
Do'stlarga ulashing π
Bizga qo'shiling ππΌ @Frontend ππΌ
Topshiriq: Massivdagi har bir elementni sonini aniqlash.
Yechim:
function countElements(arr) {
return arr.reduce((acc, element) => {
acc[element] = (acc[element] || 0) + 1;
return acc;
}, {});
}
// Misol uchun
const tags = ["#javascript", "#react", "#patterns", "#css", "#interview", "#javascript", "#css"]
console.log(countElements(tags));
Natija:
{
"#javascript": 2,
"#react": 1,
"#patterns": 1,
"#css": 2,
"#interview": 1
}
Bu JavaScript funktsiyasi berilgan massivdagi har bir elementni sanaydi va natijani obyekt (object) ko'rinishida qaytaradi. Funksiyada reduce metodidan foydalanilgan. reduce metodi massivdagi har bir elementni bitta qiymatga o'zlashtirish imkonini beradi.
Sizda qanday yechim bor, izohlarda yozib qoldiring π¬
Do'stlarga ulashing π
Bizga qo'shiling ππΌ @Frontend ππΌ
π3π₯2
This media is not supported in your browser
VIEW IN TELEGRAM
#vsCode #foydali
π±Sticky Scroll
Visual Studio Code-ning yangi tahrirlovchisi Sticky Scroll xususiyati, sizning kodlaringizni oβqishda yordam beradi. Bu xususiyat yordamida, siz kodlaringizni oβqishda, kodning qaysi qismida ekanligingizni bilib turishingiz mumkin, chunki boβlimlar yuqoriga yopishtiriladi, masalan, klass, funksiya aniqlanishi va hokazo...
β VS Code'da ishga tushirish:
Do'stlarga ulashing π
Bizga qo'shiling ππΌ @Frontend ππΌ
π±Sticky Scroll
Visual Studio Code-ning yangi tahrirlovchisi Sticky Scroll xususiyati, sizning kodlaringizni oβqishda yordam beradi. Bu xususiyat yordamida, siz kodlaringizni oβqishda, kodning qaysi qismida ekanligingizni bilib turishingiz mumkin, chunki boβlimlar yuqoriga yopishtiriladi, masalan, klass, funksiya aniqlanishi va hokazo...
β VS Code'da ishga tushirish:
βοΈ settings β‘οΈ editor β‘οΈ Sticky Scroll
Do'stlarga ulashing π
Bizga qo'shiling ππΌ @Frontend ππΌ
π6
Frontend
#vsCode #foydali π±Sticky Scroll Visual Studio Code-ning yangi tahrirlovchisi Sticky Scroll xususiyati, sizning kodlaringizni oβqishda yordam beradi. Bu xususiyat yordamida, siz kodlaringizni oβqishda, kodning qaysi qismida ekanligingizni bilib turishingizβ¦
This media is not supported in your browser
VIEW IN TELEGRAM
βπ
π12
This media is not supported in your browser
VIEW IN TELEGRAM
Geolokatsiyani aniqlash va uni xaritada ko'rsatish πΊ
Geolocation API yordamida foydalanuvchining koordinatalarini olishingiz va keyin ularni xaritadan joyni topish uchun ishlatishingiz mumkin.
ππΌ @Frontend ππΌ
Geolocation API yordamida foydalanuvchining koordinatalarini olishingiz va keyin ularni xaritadan joyni topish uchun ishlatishingiz mumkin.
<p class="status"></p>
<iframe class="map" src=""></iframe>
<button class="button">Men qayerdaman?</button>
const button = document.querySelector(".button"),
map = document.querySelector(".map"),
status = document.querySelector(".status");
button.addEventListener('click', findLocation);
function findLocation() {
if (!navigator.geolocation) {
status.textContent = 'ΠΠ°Ρ Π±ΡΠ°ΡΠ·Π΅Ρ Π½Π΅ Π΄ΡΡΠΆΠΈΡ Ρ Π³Π΅ΠΎΠ»ΠΎΠΊΠ°ΡΠΈΠ΅ΠΉ...';
} else {
navigator.geolocation.getCurrentPosition(success, error);
}
function success(position) {
const { longitude, latitude } = position.coords;
map.src = `https://www.openstreetmap.org/export/embed.html?bbox=${longitude}%2C${latitude}&layer=mapnik`;
}
function error() {
status.textContent = 'Baribir topaman!:0';
}
}
ππΌ @Frontend ππΌ
π4π₯2π―2
This media is not supported in your browser
VIEW IN TELEGRAM
Kursni bitirib ishga kirolmay yurganlar bilan ish haqida suhbat qilib qolsang π
ππΌ @Frontend ππΌ
ππΌ @Frontend ππΌ
π6