🌐 Web loyihalarda so‘rovlar bilan ishlaganingizda, siz sonlardan iborat status kodlarga ko‘zingiz tushgan bo‘lishi mumkin.

📡 Har bir so‘rovga javoban server maxsus 3 xonali kod yuboradi.
Bu kodlar orqali so‘rov qanday natija bergani haqida ma’lumot olishingiz mumkin.

📊 Barcha status kodlar 5 asosiy toifaga bo‘linadi:

⸻

🔵 1xx – Information
ℹ️ 100 – Continue
🔁 101 – Switching Protocols

⸻

🟢 2xx – Muvaffaqiyatli
✅ 200 – OK
🆕 201 – Created
📭 204 – No Content (Javob yo‘q, lekin muvaffaqiyatli)

⸻

🟡 3xx – Yo‘naltirish
📍 301 – Moved Permanently
🔄 302 – Temporary Redirect
📦 304 – Not Modified (Cache uchun)

⸻

🔴 4xx – Client xatoliklari
⚠️ 400 – Bad Request
🔒 401 – Unauthorized
⛔ 403 – Forbidden
❓ 404 – Not Found
🧪 422 – Validation Error
🚫 429 – Too Many Requests

⸻

⚫ 5xx – Server xatoliklari
💥 500 – Internal Server Error
🌐 502 – Bad Gateway
🛠 503 – Server Unavailable

#frontend #backend

📝 useEffectdan foydalanish usullari.

useEffect- bu komponentda ta'sir(effect)larni boshqarish uchun ishlatilinadigan React yordamchi funksiyasi hisoblanadi. Quyida ushbu yordamchi funksiyaning ishlatilish holatlarini ko'ramiz:

1-holat.

useEffect(() => {
  // logic in here
}, []);

Komponent ishga tushganida faqat 1 marta ishlaydi.

2-holat.

useEffect(() => {
  // logic in here
});

Har komponent yangilanganida ishlaydi. Bu state yoki props o'zgarishi bilan sodir bo'lishi mumkin.

3-holat.

useEffect(() => {
  // logic in here
  return () => {
    // handle component unmount
  };
}, []);

Komponent ishga tushgan payt ishlaydi va komponent unmount(aktiv emas) holatini tutib olish mumkin.

4-holat.

useEffect(() => {
  // logic in here
}, [someStateOrProps]);

Komponent ishga tushgan payt ishlaydi va berilgan state yoki propslardan biri o'zgargan payt ishlaydi.

Loyihada holatga qarab yuqoridagilarni to'g'ri ishlatish maqsadga muvofiq bo'ladi.😉

#react | Telegram Instagram

🚀 Prisma v7: Backend tezligi yangi bosqichda!

Next.js va Node.js dasturchilari uchun ajoyib yangilik. Prisma katta yangilanish chiqardi, tezlik va xavfsizlik bo'yicha katta yaxshilanish.

Agar siz loyihangizda Prismadan foydalansangiz, bu 3 ta yangi imkoniyatni albatta bilishingiz kerak! 👇


⚡️ 1. Relation Joins (Native JOINs)
*Endi "N+1" muammosi yoq!*

Oldin Prisma bog'langan ma'lumotlarni (masalan, User va uning Post'larini) olib kelish uchun bazaga bir nechta so'rov (query) yuborar edi. Bu esa katta loyihalarda sekin ishlashga olib kelardi.

🔥 Yangi yechim: Prisma v7 endi SQL JOIN lardan foydalanadi. Barcha ma'lumotlar bitta optimallashtirilgan so'rov bilan keladi.

// 3 barobar tezroq!
const users = await prisma.user.findMany({
  relationLoadStrategy: 'join', 
  include: { posts: true, profile: true },
});

🏎 2. Serverless Driver Adapters
*Vercel va Serverless uchun "Must-Have"*

Agar loyihangizni Vercel ga deploy qilsangiz, "Cold Start" (sekin yuklanish) muammosi hosil bo'lardi.

🔥 Yangi yechim: Endi Prisma og'ir "Binary engine" o'rniga yengil JavaScript driverlaridan (`pg`, neon, `planetscale`) foydalana oladi. Bu Next.js loyiha tezligini oshiradi! 🚀



🛡 3. TypedSQL
*Raw SQL yozish endi 100% xavfsiz!*

Ba'zan murakkab so'rovlar uchun qo'lda SQL yozishga to'g'ri keladi (`$queryRaw`). Lekin oldin natija qanday tipda kelishini bilmasdik.

🔥 Yangi yechim: Siz .sql fayl yozasiz, Prisma esa unga avtomatik TypeScript tiplarini yaratib beradi.

SELECT id, name, email FROM "user" WHERE "emailVerified" = true;

import { getUsers } from '@prisma/client/sql';

// TypeScript natijani aniq taniydi!
const users = await prisma.$queryRawTyped(getUsers());

#prisma #typescript

🖐🏻 Salom, do‘stlar!

Bir oz tanaffusdan keyin yana sizlar bilanman — energiya, yangi g‘oyalar va sifatli kontent bilan qaytdim ✨
Front-end magic, back-end logic ⚡

📌 Endi kanalda:
• Foydali IT + SMM maslahatlar
• Web dasturlash bo‘yicha mini darslar
• Dizayn va kontent yaratish bo‘yicha lifehacklar
• Amaliy loyihalar, motivatsiya va real tajribalar

🔥 Eng muhimi — kontent muntazam, sifatli va aynan siz uchun!

Sizlar bilan — @Mushtariydeveloper👩‍💻
Bugundan boshlab kuchli postlar ketma-ketligi boshlanadi 🚀

🚀 API nima?

API — bu web va mobil ilovalar o‘rtasidagi aloqa ko‘prigi 🌉
Ya’ni, frontend backend bilan API orqali gaplashadi.

📌 Misol:
Ilovaga kirdiz→ login qildiz→ ma’lumot serverdan API orqali keldi ✅

🔥 API bo‘lmasa:
— Login ishlamaydi
— To‘lov bo‘lmaydi
— Ma’lumot kelmaydi

🔴 API — web dasturlashning yuragi

Front-end magic, back-end logic. ✨
@Mushtariydeveloper

Student bu - hech bir fandan daftar tutmasa ham, 70 000 soʻmlik barsetka koʻtaradigan, ichida faqat avtobus uchun 2 000 soʻm olib yurishga moʻljallangan 50 000 soʻmga karmon sotib oladigan oliftadir...

Student bu - 6 oy umuman dars qilmasdan bir kecha-kunduz ichida 6 oylik konspektni yozishga ulguradigan professordir...

Student bu - hisobida bir senti boʻlmasa ham 1000 dollarlik ayfon koʻtarib yuradigan boyvachchadir...

Student bu - darsda oʻtirib ham quloqchinda qoʻshiq eshitib, ham konspekt yozib, ham telefonda telegramda oʻtiradigan Sezardir...

Student bu - atigi 280 000 soʻm stipendiya olishi uchun 8 million soʻm kontrakt toʻlay oladigan millionerdir...

Student bu - uydan futbolka va jinsida chiqib, dekanni yoniga koʻylak va galustukda kiradigan intellegentdir...

Student bu - butikda 100 dollarga koʻrgan kiyimini bozordan 203 600 soʻmga tushirib oladigan biznesmendir...

Student bu - oʻzi 1000 soʻmlik gumma yeb, sevgan qizini tugʻilgan kuniga 300 dona atirgul sovgʻa qila oladigan romantikdir...

Bizda qoling siz uchun hammasi
»»❤@Soginchimsany❤️««

Bundan kelib chiqib o'zimiz uchun quyidagicha xulosa qilsak bo'ladi:

- TypeScript endi standart tilga aylandi.
Barcha zamonaviy frontend framework'lar (React, Vue, Angular) default TypeScript bilan ishlaydi.

- Frontend + AI = normal holat
AI-first development. AI modellarini qanday samarali ishlatishni o'rganish kerak.(API, prompt engineering)

- Arxitektura va xavfsizlik qismlarini kuchli, chuqurroq o'rganish.

@frontend

🚀 WEB DASTURLASHNI 0 DAN BOSHLASH YO‘LI

✨ 1️⃣ HTML — Skelet
Saytning asosiy tuzilmasi.
📌 Taglar, form, image — shularni bilsang yetadi 🧱

✨ 2️⃣ CSS — Dizayn
Rang, joylashuv, responsiv ko‘rinish.
📌 Flexbox, Grid, Media Queries 🎨

✨ 3️⃣ JavaScript — Harakat
Saytga jon beradi.
📌 DOM, click event, Fetch API ⚡

✨ 4️⃣ Git & GitHub — Saqlash tizimi
📌 add → commit → push 🐙
Kodlaring yo‘qolmaydi + portfolio bo‘ladi.

✨ 5️⃣ Mini loyihalar (amaliyot)
📌 Todo App
📌 Weather App
📌 Calculator
📌 Responsive landing page 🧪

✨ 6️⃣ React — Zamonaviy frontend
📌 Component, useState, useEffect ⚛️

✨ 7️⃣ Next.js — Professional daraja
📌 Routing, API, server components 🏆

✨ 8️⃣ Portfolio
📌 5–6 ta kichik loyiha → portfolio → start! 💼

@Mushtariydeveloper

✨📱 RESPONSIVE DIZAYN NIMA?

Bugun sayt faqat kompyuter uchun emas 👇
📱 Telefon
💻 Noutbuk
📟 Planshet

👉 Responsive dizayn — saytning har bir qurilmada moslashib, chiroyli ko‘rinishi.

⸻

🌍 NIMA UCHUN MUHIM?

💡 Foydalanuvchilarning 70% telefondan kiradi
🚀 Google responsive saytlarni yuqoriga chiqaradi
🎯 UX yaxshilanadi — odam saytda ko‘proq qoladi

⸻

🛠 QANDAY QILINADI?

🎨 Flexbox — joylashuv
🧱 Grid — tartib
📐 Media Queries — ekran o‘lchamiga

@Mushtariydeveloper

🎓 Yangi sertifikatni qo‘lga kiritdim!

Bu natijaga erishish yo‘lim oson bo‘lmadi, lekin har bir qadam men uchun katta tajriba bo‘ldi. Shu yo‘lda meni qo‘llab-quvvatlagan, sabr-toqat bilan yo‘riq ko‘rsatgan barcha ustozlarimga cheksiz rahmat

Sizlarning bilim va maslahatlaringiz tufayli o‘zimni rivojlantirish va yangi cho‘qqilarga intilish imkoniga ega bo‘ldim. Bu faqat boshlanish, oldinga harakat qilamiz 🚀

Bilim olish yo‘lim davom etadi, yangi maqsadlar sari intilaman va o‘rganganlarimni amalda qo‘llashni davom ettiraman.

Front-end magic, back-end logic. ✨
@Mushtariydeveloper👩‍💻