Dasturchilar uchun ayni kerakligi 😎

Metabob kodni tuzatish va qayta ishlashni avtomatlashtirishga yordam beradi.

AI sizning kodingizni tekshiradi, xatolar haqida signal beradi, ularni tushuntiradi va tuzatadi

✅ Python, Javascript, Typescript, C++, C va Java bilan ishlaydi, Github, Bitbucket, Gitlab va VScode da mavjud.

Bu AI'dan foydalanadiganlar bormi? 💬

👉🏼 @frontend 👈🏼

💎 Dasturchilar uchun foydli bo'lgan 7ta sayt

1️⃣ O'zingiz biladigan dasturlash tilingiz bo'yicha kod yozib bilimingizni sinab ko'rish imkoniyatini beruvchi sayt:
👉🏻 https://codewars.com/

2️⃣ CSS Grid'ga oid ajoyib misollarini osongina o'rganish imkoniyatini beruvchi sayt:
👉🏻 https://griddy.io/

3️⃣ Sizga animatsiyalarni yaratish, ko‘rish va ishga tushirishda yordam beradigan ajoyib sayt:
👉🏻 https://keyframes.app/animate

4️⃣ Kodlarni bir dasturlash tilidan boshqa dasturlash tiliga o'tqazib beruvchi sayt:
👉🏻 https://ide.onelang.io/

5️⃣ Ochiq manbali CSS, SVG va Figma UI Ikonkalari mavjud sayt:
👉🏻 https://css.gg/

6️⃣ Web dasturchilar uchun kerak bo'ladigan ikonkalar bor eng yaxshi sayt:
👉🏻 https://fontawesome.com/

7️⃣ VSCode'ni brauzerning o’zida foydalanish imkoniyatini beruvchi sayt:
👉🏻 https://vscode.dev/


👉🏼 @frontend 👈🏼

#vscplugin

Tailwind CSS IntelliSense

Tailwind CSS IntelliSense VSCode foydalanuvchilariga avtoto‘ldirish, sintaksisni ajratib ko‘rsatish va tahlil qilish kabi ilg‘or funksiyalarni taqdim etish orqali Tailwindda ishlash imkoniyatingizni oshiradi.

📥 Plaginni o'rnatish

👉🏼 @frontend 👈🏼

#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 👈🏼

#js #quiz

let a = 3;
let b = new Number(3);
let c = 3;

console.log(a == b);
console.log(a === b);
console.log(b === c);

👉🏼 @FrontEnd 👈🏼

#hazil

Yig'ilgan tajriba 😅

👉🏼 @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 👈🏼

Telegram premiumchilarni yordamga chaqiramiz 👇🏼

https://t.iss.one/boost/frontend

Bu holat hamma Frontend'chilarning boshidan o’tgan bo’lsa kerak, shundaymi? 😂

Frontendchilar kanali 👉🏼 @Frontend

Miyyani press qiladigan joyi 😁

let a = 5;
let b = a-- + ++a;
let c = a++ - --b;
            
console.log(a+b+c);

👉🏻 @FrontendIQ > #js

#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

Dunyoning eng katta API hubi - rapidapi.com

Do'stlaringizga ham ulashib qo'ying 🚀

Bizga qo'shiling 👉🏼 @Frontend 👈🏼

#js
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 👈🏼

#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:

⚙️ settings ➡️ editor ➡️ Sticky Scroll

Do'stlarga ulashing 🚀

Bizga qo'shiling 👉🏼 @Frontend 👈🏼

Geolokatsiyani aniqlash va uni xaritada ko'rsatish 🗺

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 👈🏼

#vue #amaliyot

💼 Lavozim: Frontend Vue dasturchi

NDC(ndc.uz) IT kompaniyasi Frontend VueJS bo'yicha Internship e'lon qiladi!

🌐 Batafsil o'qing

Vakansiyalar: 👉🏼 @frontendVacancy