#git

⚙️ Git haqida o'zbekcha kitob.

Git-ning rasmiy saytida kitob bo'limida git haqida batafsil ma'lumot beruvchi , o'rganish uchun qo'llanma mavjud va buni o'zbek tilida tarjimasi bor.

Qo'llanmaga o'tish: https://git-scm.com/book/uz/v2

Qo'llanmaning 10/3 qismigina tarjima qilingan :(

Git haqida foydali manbalar:
- GIT CHEAT SHEET
- Learn Git
- Using Git

@frontend

#react

⚙️ React 19 Beta

React 19 yangilanishlari haqida ma'lum qilindi:

#️⃣ React Compiler: Yangi kompilyator React kodini oddiy JavaScript kodiga aylantiradi, bu esa ishlash tezligini ikki baravarga oshirishi mumkin. Hozirgi paytda, Instagram ushbu texnologiyadan foydalanmoqda va bu texnologiya Reactning kelgusi versiyalarida chiqariladi.

#️⃣ Server Components: Ko'p yillik rivojlanishdan so'ng, React server komponentlarini taqdim etdi, ulardan endi Next.js bilan foydalanish mumkin.

#️⃣ Actions: DOM elementlari bilan oʻzaro munosabatni oʻzgartirish uchun amallar oʻrnatiladi.

#️⃣ Document Metadata: dasturchilarga kamroq kod bilan ko'proq ish bajarishga imkon beradi.

#️⃣ Asset Loading: bu, aktivlarni fon rejimida yuklashga imkon beradi, bu ham ilovaning yuklanish vaqtini ham, foydalanuvchi tajribasini ham yaxshilaydi.

#️⃣ Web Components: React kodi endi bizga veb komponentlarni kiritishga imkon beradi.

#️⃣ Yangi React Hooks: Kodlash tajribasini oshirish uchun yangi imkoniyatlar.

use()
useFormStatus()
useFormState()
useOptimistic()

React 19 hali ham ishlab chiqish jarayonida.

🔗 React 19 beta haqida batafsil: https://react.dev/blog/2024/04/25/react-19

@frontend

#vue

💚 Vue 3 ilovasiga Google Maps’ni integratsiya qilish

1. Google Maps API kalitini olish
2. Vue Google Maps paketini o’rnatish
3. Vue Google Maps komponentini ishlatish

🔗 Batafsil maqolada o'qing

@frontend

#github #git

⚙️ Githubga loyihani yuklash:

1. Github o'zi nima?
2. Githubda ro'yxatdan o'tish
3. Kompyuterdan Gitni va unga bog'langan login parollarni o'chirib tashlash
4. Kompyuterga Gitni o'rnatish va undagi global sozlamalarni yangi profilga moslashtirish
5. Git asoslari
6. Git asoslarini demo loyiha asosida ishlatish

@frontend

#responsive

📱 Mobile FIRST

Saytingizni moslashuvchan (responsive) testlar uchun eng yaxshi chrome extension.

U 52 ta qurilma taklif etadi. Bu qurilmalar orasida Android & Google smartfonlari, Apple smartfonlari, planshetlar va maxsus qurilmalar kabi 16 ta model bor.

📱 O'rnatish

@frontend

#css

🎲 Saytingizni yanada jozibali qilish uchun bepul vositalar

1. Box-shadow examples
2. Checkboxes examples
3. Buttons examples
4. CSS shapes examples, click to copy

Frontendchilarga yuborib qo'yamiz 🚀

@frontend

#ui

👩‍💻 React uchun Headless UI v2.0

Headless UI kutubxonasining yangi versiyasi - v2.0 for React chiqdi!

Yangi qo'shilgan funksiyalar:

#️⃣ Built-in anchor positioning: Floating UI kutubxonasi Headless UI kutubxonasiga integratsiya qilindi.

#️⃣ New checkbox component: Yangi headless Checkbox komponenti qo’shildi.

#️⃣ HTML form components: HTML form komponentlari qo’shildi.

#️⃣ Improved hover, focus and active state detection: Hover, focus va faol holatni aniqlash takomillashtirildi.

#️⃣ Combobox list virtualization: Combobox ro’yxati virtualizatsiyasi qo’shildi.

#️⃣ Yangi veb-sayt va takomillashtirilgan hujjatlar

🖇️Yangilanish haqida batafsil

@frontend

#vscode

Plagin "px to rem"

Bu plagin px ni rem ga va aksincha aylantirish imkonini beradi.

Alt+Z Px - rem, rem - px.

🗓 Plagin: havola

@frontend

🌟 Iltimos, BOOST orqali kanalimizni qo'llab quvvatlang!

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

Error'ni zo'ri 😭

@frontend

#react

👩‍💻 react-pdf - Reactda pdf fayllarni yaratish

React-PDF kutubxonasi yordamida siz o’z loyihangizda PDF hujjatlarni yaratish, ko’rish va saqlash uchun komponentlarni ishlatishingiz mumkin.

React-PDF kutubxonasi quyidagi imkoniyatlarni beradi:

🔴PDF hujjatlarni yaratish uchun deklarativ API.
🔴Server va mijoz tomonida PDF hujjatlarni yaratish.
🔴CSS xususiyatlari va Flexbox layout orqali ularni stil berish uchun API.
🔴Hujjatni saqlash, oqish va DOM-da ko’rsatish.

npm install @react-pdf/renderer --save

⚙️ GitHub | 📄 Doc

@frontend

#javascript

ApexCharts.js - dinamik grafiklar yaratish 📊

ApexCharts.js – bu JavaScript kutubxonasi bo‘lib, u orqali interaktiv va chiroyli grafiklar yaratishingiz mumkin. U kuchli va foydalanishga juda oson!

Batafsil ma'lumot va qo‘llanma: apexcharts.com

@frontend

#vscode

🗓 2024 yilda mahsuldorligingizni oshirish uchun VS Code extension'lari ⚡️

Quyidagi havolalar orqali kirib tanishishingiz/o'rnatishingiz mumkin:

— Better Comments - koddagi sharhlarni barcha uchun tushunarli qilib yozishga yordam beradi.
— Bookmarks - kodlarni belgilash, xatcho'p yaratib beradi.
— Code Spell Checker - kod bazasida imlo xatolarini topish va tuzatish uchun asosiy imlo tekshirgich
— CodeSnap - kodning skrinshotlarini olish uchun.
— CodiumAI - sun'iy intellektga asoslangan bepul kodlar to'plami.
— Error Lens - nosozliklarni tuzatish va xatolarni oldini olish uchun ajoyib vosita.
— Git History - versiya boshqaruvi, Git tarixi, qidiruv ...
— GitLens - kuchli Git vositasi bo'lib, u juda ko'p xususiyatlarni bitta kengaytmaga jamlagan. Jamoa bilan ishlashda juda foydali.
— GitHub Copilot - ChatGPT bilan integratsiyalangan kuchli AI yordamchi ($10/oyiga)
— Icon Themes - vizuallikni yaxshilash uchun: Material Theme Icons, vscode-icons, file-icons.
— Indent Rainbow - chiziqlar orqali kod o'qilishini yaxshilaydi.
— Live Share - kodni real vaqtda boshqalar bilan hamkorlikda tahrirlash va disk raskadrovka qilish.
— Multiple Cursor Case Preserve - kodni tez tahrirlashga yordam beradi.
— Path Intellisense - dinamik ravishda fayl yo'llari va katalog nomlarini taklif qiladigan aqlli avtomatik to'ldirishga ega.
— Prettier - kodni formatlash.
— TODO Highlight - kodingizdagi TODO, FIXME va boshqa izohlarni ajratib ko'rsatadi.

Tanishlarga ham yuborib qo'ying✅

@frontend

#vue

Vue 3 loyihasiga xalqaro tillarni qo'shish (vue-i18n)

Bugungi kunda web-ilovalar global foydalanuvchilar uchun mo'ljallangan bo'lib, turli tillardagi qo'llab-quvvatlash juda muhim ahamiyatga ega. Vue 3 ilovangizga xalqaro tillarni qo'shish orqali siz kengroq auditoriyaga xizmat qilishingiz mumkin. Bu jarayonni "Vue I18n" yordamida oson amalga oshirish mumkin.

📱 Batafsil bu yerda o'qing

@frontend

⚡️ Tez orada ajoyib yangilik bor.

Tahmin qilib ko'ringchi 💬

🆕 Diqqat

Maqolalaringizni @frontend kanalida e'lon qilish imkoniyatini taklif etamiz.

Agar siz ham frontend sohasida foydali ma'lumotlarga ega bo'lsangiz yoki bu borada qiziqarli maqolalar yozgan bo'lsangiz boshqalar ham o'qib, foyda olishlarini istasangiz, maqolangizni bizga yuboring.

👤Maqolalar sizning ismingiz va zarur bo'lsa, aloqa ma'lumotlaringiz bilan birga e'lon qilinadi, shuning uchun sizning professional obro'ingiz oshadi va ko'proq kishilar siz bilan bog'lanish imkoniyatiga ega bo'ladi.

📝Post yuborish tartibi:

1️⃣ Postni tayyorlang.

2️⃣ Uni kanal adminiga yuboring.

3️⃣ Maqolangiz ko'rib chiqiladi va kanalga mos deb topilsa, muallif nomi bilan joylanadi.

🔎 Biz sifatli va dasturchilar uchun foydali kontentni qadrlaymiz. Har bir yuborilgan maqola diqqat bilan ko'rib chiqiladi.

Hurmat bilan @Frontend jamoasi.