#javascript

✌️ JavaScript weekly #​696

@frontend

#devTools #frontend

📱 Frontend dasturchilar uchun foydali vositalar

React Dev Tools / Vuejs Devtools: Ushbu kengaytmalar React yoki Vue ilovalarini tuzatish uchun zarurdir. Siz komponentlarni ko'rib chiqishingiz, ularning xususiyatlari va holatlarini ko'rishingiz mumkin.

Redux Dev Tools: Ilovangizda Redux'dan foydalansangiz bu uning holatini tuzatishga yordam beradi.

JSON Formatter: JSON faylini yuborsangiz, uni chiroyli formatda ko'rsatiladi.

ColorZilla: ColorZilla sizga kerakli rangni olishga yordam beradi.

WhatFont: Bu kengaytma veb-saytdan shriftni aniqlaydi.

Mobile simulator: Responsive testing

Screenshot Tool: Tezkor skrinshotlar olishga imkon beradigan skrinshot vositasi

@frontend

#js #leetCode #frontend

⚙️ JavaScript va Leetcode'da masala ishlash bo'yicha o'zbek tilida bepul darslar

Videoga havola

@frontend

#vue #frontend

💚 v-for ichida destrukturizatsiya qilish

🟡 ES6 destrukturizatsiyasidan foydalanmasdan v-for'dan foydalanish

<div v-for="car in cars" :key="car.id">
  <h2>{{ car.make }} {{ car.model }}</h2>
</div>

cars[] avtomobillar ro'yxati va har bir avtomobil quyidagi tuzilishga ega:

interface Car {
  make: string; // Avtomobil markasi
  model: string; // Modeli
  id: string; // id
}

🟡 ES6 destrukturizatsiyasidan foydalanib, kodni toza va tushunarli qilish mumkin:

<div v-for="{id, make, model} in cars" :key="id">
  <h2>{{ make }} {{ model }}</h2>
</div>

@frontend

#charts #ui

📈 Recharts orqali yaratilgan shadcn/ui chartlarini loyihangizda ishlatishingiz mumkin. Chiroyli va moslashuvchan dizayn, bepul Open Source.

https://ui.shadcn.com/charts

@frontend

#ai #gemini

📱 Gemini o'zbek tilida ham yaxshi muloqot qila olmoqda , muammoga duch kelsangiz yoki biror narsa haqida ma'lumotga ega bo'lmoqchi/o'rganmoqchi bo'lsangiz yaxshi ai assistant bo'la oladi.

Gemini AI - Google Search asosida ma'lumotlarni qayta ishlaydi, shuning uchun bu sizning vaqtingizni anchagina tejaydi.

https://gemini.google.com/app

@frontend

#miniProject #frontend

📱 HTML, CSS va JavaScriptdan foydalanib yaratilgan mini-loyihalar

HTML, CSS va JavaScriptdan foydalanib yaratilgan turli xil mini-loyihalari to'plangan. Ushbu loyihalar yangi boshlovchilar uchun o'zlarini sinab ko'rish va asosiy tushunchalarni o'rganish uchun ajoyib manbadir.

Har bir loyiha uchun HTML, CSS va JavaScript kodlari, shuningdek, loyihaning jonli demosi mavjud.

GitHub sahifaga havola

@frontend

#javascript #library #frontend

🦶 Driver.js

Bu JavaScript kutubxonasi foydalanuvchilarni interfeys bilan tanishtirish, yo'l-yo'riq berish imkoniyatini beradi. U kichik hajmli (taxminan 5kb), moslashuvchan , har qanday elementni ta'kidlab chiqarish imkoniyatini beradi.

doc : https://driverjs.com/docs/installation

@frontend

#js #library #frontend

🔔 Top JavaScript bildirishnoma kutubxonalari

— SweetAlert
— React-Toastify
— Toastr
— Essential JS 2
— chakra-ui/alert
— Vue Toastification
— Sonner
— Awesome Notifications

@frontend

#portfolio #frontend

Frontend dasturchining portfolio saytida
"Nimalar bo'lishi kerak ?"

🔘Shaxsiy ma'lumotlar:

- Qisqa tarjimai hol
- Ta'lim va sohadagi tajribangiz
- Shaxsiy fotosurat yoki avatar qo'shing

🔘Ko'nikmalaringiz:

- Frontend dasturlashda foydalanadigan barcha texnologiyalar ro'yxatini kiriting.
- Har bir texnologiya uchun sizning tajriba darajangizni ko'rsating.
- Qo'shimcha ko'nikmalarni, masalan, dizayn yoki UX/UI

🔘Loyihalaringiz:

- Eng yaxshi ishlaringizni joylang.
- Har bir loyiha uchun qisqa tavsif, ishlatilgan texnologiyalar va loyihada sizning rolingiz.
- Loyihalarni filtrlash yoki qidirish imkoniyatini.

🔘Aloqa ma'lumotlari:

- Siz bilan bog'lanishga qulay bo'lgan elektron pochta/telegramga havola, manzilingiz va telefon raqamingiz.
- Ijtimoiy media profillaringizga havolalarni kiriting.

Saytingiz vizual jihatdan qiziqarli va foydalanish uchun oson bo'lishi kerak. Mobil qurilmalar uchun moslashuvchan dizayndan foydalaning.

Portfoliongizni muntazam yangilab boring. Eng yaxshi loyihangizni namoyish qilish uchun yuqori sifatli tasvirlar ishlating.

Ba'zi namunalar:
1. https://sarkar.fr
2. https://henryheffernan.com

@frontend