Коди тоза, рефакторинг ва деплой

01 Номҳо: кодро аз навиштан бештар мехонанд

Барои компютер фарқ надорад, ки тағйирёбандаро чӣ ном гузорем: a, x2 ё somoniForOnePlov. Аммо барномаро на танҳо компютер мехонад — онро шумо баъди як ҳафта, ҳамкори лоиҳа ва ёрдамчии ЗС мехонанд. Номи хуб аз шарҳ халос мекунад: аз он фавран фаҳмост, ки ин чист ва барои чӣ.

const d = 7;
const l = [5, 35, 15];
function proc(x) {
  return x * 11;
}
let flag = false;

const daysInWeek = 7;
const dishPrices = [5, 35, 15];
function convertUsdToSomoni(usd) {
  return usd * 11;
}
let isPaid = false;

Қоидаҳои номҳои хуб

• Бе ихтисорҳо, ки танҳо шумо медонед: cnt, usr, tmp. Панҷ ҳарфи зиёдатӣ — нархи арзон барои возеҳӣ. Истисно — маъмулан қабулшудаҳо: i дар давраи кӯтоҳ, id, url.
• Бе калимаҳои «партов»: data, info, temp, thing, list2. Аз худ бипурсед: «Кадом маълумот дақиқан?»
• Як калима — як мафҳум. Агар дар як ҷо getUser, дар ҷои дигар fetchOrder, ва дар сеюм loadProduct бошад — барои як навъи амал як феълро интихоб кунед ва ба он вафодор бошед.
• Дарозии ном аз «умр»-и тағйирёбанда вобаста аст. Тағйирёбанда барои се сатр метавонад кӯтоҳ бошад (item), ва барои тамоми файл намоён — муфассал (selectedDishId).
• Танҳо лотинӣ, забон — англисӣ. Шарҳҳо ва матнҳо барои корбарро бо тоҷикӣ менависем.

const items = [5, 35];
const isEmpty = items.length > 0;   // ✖ дар асл «холӣ нест»

if (isEmpty) {
  console.log("Корзина пуста");     // ← аммо сабад ҳамоно пур аст!
}

Муфассалтар хонед: learn.javascript.ru — Услуби код, learn.javascript.ru — Коди ниндзя (чӣ тавр набояд кард)

// 1
const d = 7;
// 2
const daysInWeek = 7;
// 3
function proc(x) { return x * 2; }
// 4
const isPaid = true;
// 5
const flag = false;   // дар ин ҷо «оё фармоиш пардохт шудааст» нигоҳ дошта мешавад
// 6
const students = ["Рустам", "Нилуфар"];
// 7
function getStudentCount(students) { return students.length; }
// 8
const data2 = [1, 2, 3];

const badNames = [/* рақамҳои номҳои бад */];
console.log(badNames.join(", "));

1, 3, 5, 8

const p = 25;
const n = 4;
const t = p * n;

console.log(`${price} × ${count} = ${total}`);

25 × 4 = 100

function check(a) {
  return a >= 18;
}

function calc(arr) {
  let s = 0;
  for (const x of arr) {
    s += x;
  }
  return s;
}

function fmt(n) {
  return n + " сомони";
}

console.log(isAdult(20), isAdult(15));
console.log(getTotal([5, 35, 15]));
console.log(formatPrice(getTotal([5, 35, 15])));

true false
55
55 сомони

02 Функсияҳои хурд ва бозгашти барвақтӣ

Қоидаи рақами як барои функсияҳо: як функсия — як вазифа. Агар шумо онро бо калимаи «ва» тавсиф кунед («маблағро ҳисоб мекунад ва тахфиф татбиқ мекунад ва чек чоп мекунад»), ин се функсия аст. Функсияи кӯтоҳро хондан, ном додан, санҷидан ва дар ҷои дигар истифода бурдан осонтар аст.

• Андоза. Нишондиҳанда — дар як экран ҷо мешавад, 10–20 сатр. На қонун, балки сигнал: агар варақ мезанед — вақти тақсим кардан расидааст.
• Параметрҳо. Ду–се — муқаррарӣ. Панҷ ва зиёд — сабаби андеша, ки оё объект додан лозим нест.
• Як сатҳи тафсилот. Функсияи боло нақл мекунад «чӣ рӯй дода истодааст» (validate → calc → render), ва тафсилот дар функсияҳои хурд пинҳонанд.

function processOrder(prices) {
  let sum = 0;
  for (const price of prices) {
    sum += price;
  }
  const discount = sum >= 100 ? sum / 10 : 0;
  console.log("К оплате: " + (sum - discount));
}

processOrder([40, 70, 20]);

function calcSum(prices) {
  let sum = 0;
  for (const price of prices) {
    sum += price;
  }
  return sum;
}

function calcDiscount(sum) {
  return sum >= 100 ? sum / 10 : 0;
}

function processOrder(prices) {
  const sum = calcSum(prices);
  const discount = calcDiscount(sum);
  console.log("К оплате: " + (sum - discount));
}

processOrder([40, 70, 20]);

Бозгашти барвақтӣ (guard clauses)

Вақте санҷишҳо ба дохили якдигар ҷойгир мешаванд, «тир»-и қавсҳо ҳосил мешавад: мантиқи асосӣ ба тарафи рост се сатҳ рафт, ва дар сар ҳамаи шартҳоро якбора нигоҳ доштан лозим меояд. Дору — бозгашти барвақтӣ: аввал ҳолатҳои бадро мебуранд ва фавран аз функсия мебароянд, ва мантиқи асосӣ дар як сатҳ мемонад.

function getFare(age, hasCard) {
  if (age >= 0) {
    if (hasCard) {
      if (age < 7) {
        return 0;
      } else {
        return 3;
      }
    } else {
      return 5;
    }
  } else {
    return -1;
  }
}

function getFare(age, hasCard) {
  if (age < 0) return -1;
  if (!hasCard) return 5;
  if (age < 7) return 0;
  return 3;
}

Ҳарду функсия як чизро бармегардонанд, аммо дуюмро аз боло ба поён мисли рӯйхати қоидаҳо мехонед. Пай бурдед? Калимаи else нест шуд: пас аз return он лозим нест, функсия аллакай тамом шудааст.

function divide(a, b) {
  if (b === 0) {
    console.log("Делить на ноль нельзя");   // хабар додем, аммо набаромадем!
  }
  return a / b;                             // ба ҳар ҳол тақсим мекунем
}

console.log(divide(10, 0));   // → Infinity, аммо мехостем қатъ шавем

Муфассалтар хонед: learn.javascript.ru — Функсияҳо, refactoring.guru — Рефакторинг

function getAccessMessage(age, hasTicket, isVip) {
  if (age >= 18) {
    if (hasTicket) {
      if (isVip) {
        return "Добро пожаловать в VIP-зал";
      } else {
        return "Добро пожаловать в зал";
      }
    } else {
      return "Купите билет";
    }
  } else {
    return "Только с 18 лет";
  }
}

console.log(getAccessMessage(20, true, true));
console.log(getAccessMessage(20, true, false));
console.log(getAccessMessage(20, false, true));
console.log(getAccessMessage(15, true, true));
console.log(getAccessMessage.toString().includes("else"));

Добро пожаловать в VIP-зал
Добро пожаловать в зал
Купите билет
Только с 18 лет
false

function printReceipt(prices) {
  let sum = 0;
  for (const price of prices) {
    sum += price;
  }
  let discount = 0;
  if (sum >= 100) {
    discount = sum * 0.1;
  }
  const total = sum - discount;
  console.log("Сумма: " + sum);
  console.log("Скидка: " + discount);
  console.log("Итого: " + total);
}

printReceipt([40, 70, 20]);
printReceipt([30, 20]);

console.log(calcSum([10, 20, 30]));
console.log(calcDiscount(200));
console.log(calcDiscount(50));

Сумма: 130
Скидка: 13
Итого: 117
Сумма: 50
Скидка: 0
Итого: 50
60
20
0

function divide(a, b) {
  if (b === 0) {
    console.log("Делить на ноль нельзя");
  }
  return a / b;
}

console.log(divide(10, 0));
console.log(divide(10, 2));

Делить на ноль нельзя
null
5

function getTicketPrice(age, isStudent, isWeekend) {
  let price;
  if (age < 0 || age > 120) {
    price = -1;
  } else {
    if (age < 7) {
      price = 0;
    } else {
      if (isStudent) {
        price = 2;
      } else {
        if (isWeekend) {
          price = 4;
        } else {
          price = 5;
        }
      }
    }
  }
  return price;
}

console.log(getTicketPrice(5, false, false));
console.log(getTicketPrice(20, true, false));
console.log(getTicketPrice(30, false, true));
console.log(getTicketPrice(30, false, false));
console.log(getTicketPrice(-3, false, false));
console.log(getTicketPrice(200, true, true));
console.log(getTicketPrice.toString().includes("else"));

0
2
4
5
-1
-1
false

03 DRY ва рақамҳои ҷодуӣ

DRY — Don't Repeat Yourself, «такрор накун». Порчаи кодро се бор нусха кардед — яъне ҳангоми ҳар ислоҳ бояд ҳар се нусхаро ёфта, ислоҳ кард. Яктоашро фаромӯш кунед — хатоеро мегиред, ки «гоҳ-гоҳ» зоҳир мешавад. Ҳал ҳамон аст, ки дар дарс дар бораи функсияҳо: як ҷое, ки навишта шудааст, ва бисёр ҷойҳое, ки даъват шудаанд.

console.log("Самбуса: " + 5 + " сомони");
console.log("Курутоб: " + 35 + " сомони");
console.log("Шакароб: " + 15 + " сомони");

function printPriceTag(name, price) {
  console.log(`${name}: ${price} сомони`);
}

const menu = [
  { name: "Самбуса", price: 5 },
  { name: "Курутоб", price: 35 },
  { name: "Шакароб", price: 15 },
];

for (const dish of menu) {
  printPriceTag(dish.name, dish.price);
}

Рақамҳои ҷодуӣ

Рақами ҷодуӣ — рақам (ё сатр) дар код, ки маънояш бе шарҳ нофаҳмо аст. * 11 чӣ маъно дорад? >= 300 чӣ? Пас аз як моҳ худатон ба ёд намеоред. Дору — собити номдор: қиматро ба боло аз файл баровардан ва ба он ном додан.

function deliveryCost(sum) {
  if (sum >= 300) return 0;
  return 25;
}

const FREE_DELIVERY_FROM = 300; // сомонӣ
const DELIVERY_PRICE = 25;      // сомонӣ

function deliveryCost(sum) {
  if (sum >= FREE_DELIVERY_FROM) return 0;
  return DELIVERY_PRICE;
}

• Собитҳоро БО_ҲАРФҲОИ_КАЛОН_ВА_ЗЕРХАТ менависем ва дар аввали файл ҷамъ мекунем — ҳамин тавр ҳамаи «танзимот»-и барнома намоён аст.
• Воҳиди ченакро ба ном ё шарҳ: TIMEOUT_MS, FREE_DELIVERY_FROM // сомонӣ.
• Лозим шуд қурб ё остонаро тағйир диҳед — дар як ҷо тағйир медиҳед.
• Ҷодуӣ нест: 0, 1, -1, 2 дар ҷойҳои возеҳ (i % 2, list.length - 1). Баровардани онҳо — аз ҳад зиёд.
• Сатрҳо-статусҳо низ ҷодуянд: ба ҷои "paid" дар даҳ ҷо const STATUS_PAID = "paid"-ро эълон кунед — хатои имлоӣ дар номи собит фавран гирифта мешавад, дар сатр — ҳаргиз.

Муфассалтар хонед: refactoring.guru — Иваз кардани рақами ҷодуӣ бо собит

function priceInSomoni(usd) {
  return usd * 11;
}

function deliveryCost(sum) {
  if (sum >= 300) return 0;
  return 25;
}

console.log(priceInSomoni(10));
console.log(deliveryCost(100));
console.log(deliveryCost(300));
console.log(typeof USD_RATE, typeof FREE_DELIVERY_FROM, typeof DELIVERY_PRICE);

110
25
0
number number number

const menu = [
  { name: "Самбуса", price: 5 },
  { name: "Курутоб", price: 35 },
  { name: "Шакароб", price: 15 },
];

const samsaPrice = 5;
console.log("Самбуса: " + samsaPrice + " сомони, с НДС " + (samsaPrice * 1.1).toFixed(2));
const kurutobPrice = 35;
console.log("Курутоб: " + kurutobPrice + " сомони, с НДС " + (kurutobPrice * 1.1).toFixed(2));
const shakarobPrice = 15;
console.log("Шакароб: " + shakarobPrice + " сомони, с НДС " + (shakarobPrice * 1.1).toFixed(2));

console.log(printPriceTag.length, typeof VAT_RATE);

Самбуса: 5 сомони, с НДС 5.50
Курутоб: 35 сомони, с НДС 38.50
Шакароб: 15 сомони, с НДС 16.50
2 number

function studentPrice(price) {
  const result = price - price * 20 / 100;
  return Math.round(result);
}

function seniorPrice(price) {
  const result = price - price * 30 / 100;
  return Math.round(result);
}

function childPrice(price) {
  const result = price - price * 50 / 100;
  return Math.round(result);
}

console.log(studentPrice(55), seniorPrice(55), childPrice(55));
console.log(applyDiscount(200, 25));
console.log(typeof STUDENT_DISCOUNT, typeof SENIOR_DISCOUNT, typeof CHILD_DISCOUNT);

44 39 28
150
number number number

04 Мантиқ ҷудо аз намоиш. Шарҳҳо

Дар ҳар барнома ду кори гуногун ҳаст: ҳисоб кардан (мантиқ: маҳсулотро филтр кардан, холи миёнаро ҳисоб кардан) ва нишон додан (намоиш: HTML ҷамъ кардан, ба консол баровардан). Вақте онҳо дар як функсия ҷамъ шудаанд, онро бе браузер санҷидан намешавад, аз нав истифода бурдан намешавад ва тағйир додан тарсовар аст: ба тарҳ даст занед — математикаро вайрон мекунед.

Схема: се нақш

1. Функсияи ҳисобкунӣ (getAffordableDishes, calcStats): маълумот мегирад, маълумот бармегардонад. Ба DOM даст намезанад, чоп намекунад, тағйирёбандаҳои берунро тағйир намедиҳад. Онро тавассути console.log осон санҷидан мумкин аст.
2. Функсияи намоиш (renderMenu, formatStats): маълумоти тайёр мегирад, сатр ё унсурҳо месозад. Чизе ҳисоб намекунад.
3. «Пайвандак» (коркунандаи ҳодиса, функсияи асосӣ): якумро даъват мекунад, натиҷаро ба дуюм медиҳад.

function showStats(grades) {
  let sum = 0;
  for (const grade of grades) sum += grade;
  console.log("Средний балл: " + sum / grades.length);
}

showStats([90, 55, 72]);

function calcAverage(grades) {
  let sum = 0;
  for (const grade of grades) sum += grade;
  return sum / grades.length;
}

function formatAverage(average) {
  return "Средний балл: " + average;
}

console.log(formatAverage(calcAverage([90, 55, 72])));
console.log(calcAverage([100, 50]));  // ҳисобро алоҳида санҷидан осон аст

Дар дарсҳо дар бораи DOM ва ҳодисаҳо шумо render() месохтед — ин маҳз ҳамон аст. Қоида дуртар меравад: дар React (дарсҳои 22–24) компонент маълумот мегирад ва онро тасвир мекунад, ва ҳисобҳо алоҳида зиндагӣ мекунанд.

Шарҳҳо: «барои чӣ»-ро шарҳ диҳед, на «чӣ»-ро

Он ки код чӣ кор мекунад, аз худи код намоён аст — агар номҳо хубанд. Аммо барои чӣ он чунин навишта шудааст, аз код ҳеҷ намоён нест. Маҳз ин ҷойи шарҳ аст: қоидаи тиҷоратӣ, роҳи гардиш, маҳдудияти ғайриоддӣ.

// i-ро ба 1 меафзоем
i++;

// агар нарх аз 100 зиёд бошад
if (price > 100) { ... }

// return total * 0.9;
return total;

// касса тангаҳои камтар аз
// 1 сомониро қабул намекунад, барои ҳамин боло мудаввар мекунем
const payment = Math.ceil(total);

// TODO(Мадина, то ҷумъа): иваз кардан
// ба дархост ба API, вақте ки он тайёр мешавад

• Коди шарҳшударо хориҷ кунед. Он файлро ифлос мекунад, ва дар Git (дарси 19) тамоми таърих нигоҳ дошта шудааст — дар ҳар лаҳза баргардонидан мумкин аст.
• Шарҳи кӯҳна аз надоштани он бадтар аст — он дурӯғ мегӯяд. Кодро тағйир медиҳед — шарҳи болои онро санҷед.
• Мехоҳед шарҳ диҳед, ки порчаи код чӣ кор мекунад? Аввал кӯшиш кунед, ки онро ба функсия бо номи хуб бароред — ном ба «шарҳ»-е табдил мешавад, ки кӯҳна намешавад.
• TODO — иҷозат аст, агар бо муаллиф ва мӯҳлат бошад. «Баъдтар ислоҳ мекунам»-и фаромӯшшуда солҳо кӯҳна мешавад.

Муфассалтар хонед: learn.javascript.ru — Шарҳҳо

/*
// 1
total = total + price; // нарх ба ҷамъбаст илова мекунем

// 2
const MAX_TRIES = 3; // пас аз 3 парол нодуруст вурудро мебандем — талаби хидмати амният

// 3
// return total * 0.9;

// 4
users.sort(byName); // корбаронро аз рӯи ном мураттаб мекунем

// 5
if (hour < 6) return "ночь"; // то соати 6-и пагоҳӣ масирҳо намераванд, барои ҳамин тарифи «шабона»

// 6
// TODO(Шаҳром, то ҷумъа): ба дархост ба API иваз кардан

// 7
let x = 5; // x ба панҷ баробар аст

// 8
// Функсия маҷмӯъро ҳисоб мекунад
function calcTotal(prices) { ... }
*/

const noise = [/* рақамҳо */];
console.log(noise.join(", "));

1, 3, 4, 7, 8

function showStats(grades) {
  let sum = 0;
  let best = 0;
  let passed = 0;
  for (const grade of grades) {
    sum += grade;
    if (grade > best) best = grade;
    if (grade >= 56) passed++;
  }
  console.log("Средний балл: " + sum / grades.length);
  console.log("Лучший: " + best);
  console.log("Сдали: " + passed + " из " + grades.length);
}

showStats([90, 55, 72, 38, 85]);

console.log(JSON.stringify(calcStats([60, 40])));
console.log(typeof formatStats, typeof PASS_SCORE);

Средний балл: 68
Лучший: 90
Сдали: 3 из 5
{"average":50,"best":60,"passedCount":1}
function number

<h3>Меню до 30 сомони</h3>
<ul id="menu"></ul>

const dishes = [
  { name: "Самбуса", price: 5 },
  { name: "Курутоб", price: 35 },
  { name: "Шакароб", price: 15 },
  { name: "Оши палав", price: 30 },
];
const menu = document.getElementById("menu");

// ҳама дар тӯда: ҳам филтр, ҳам нишонагузорӣ
for (const dish of dishes) {
  if (dish.price <= 30) {
    const li = document.createElement("li");
    li.textContent = dish.name + " — " + dish.price + " сомони";
    menu.append(li);
  }
}

// САНҶИШ — тағйир надиҳед
console.log(typeof getAffordableDishes, typeof renderMenu);
console.log(menu.children.length);
console.log(getAffordableDishes(dishes, 15).length);

function function
3
2

05 Рефакторинг: шаклро тағйир медиҳем, на рафторро

Рефакторинг — ин беҳтар кардани сохти код бе тағйири он чизе, ки кор мекунад. Барои корбар чизе тағйир наёфт: ҳамон тугмаҳо, ҳамон рақамҳо. Барои шумо ҳама чиз тағйир ёфт: код фаҳмотар шуд ва минбаъд инкишоф додани он осонтар аст. Калимаи асосӣ дар ин ҷо — «бе тағйир»: агар дар роҳ рафторро бешуурона тағйир додед, ин аллакай рефакторинг нест, балки хатои нав аст.

Давраи кории бехатар

1. Рафторро собит кунед. Пеш аз тағйир додани чизе, кодро иҷро кунед ва сабт кунед, ки барои якчанд вуруд чӣ чоп мекунад — аз ҷумла сарҳадӣ (0, холӣ, дақиқан остона). Инҳо «тестҳои» шумо ҳастанд.
2. Як қадами хурд: иваз кардем → иҷро кардем → баромад ҳамон. Собитро баровардем → иҷро кардем → ҳамон. Даҳ ислоҳи пай дар пай накунед.
3. Тартиби қадамҳо аз оддӣ ба мураккаб: номҳо → собитҳо → хориҷ кардани партов ва коди мурда → бозгашти барвақтӣ → ҷудо кардани функсияҳо → бартараф кардани такрорҳо → ҷудо кардани мантиқ ва баромад.
4. Вайрон шуд — бозгашт кунед ба ҳолати охирини корӣ. Дар Git ин як фармон аст; барои ҳамин пас аз ҳар қадами муваффақ commit мекунем (дарси 19), масалан rename vars in cart.js.
5. Ду кулоҳ. Ё шумо рефакторинг мекунед, ё хатоиро ислоҳ мекунед/функсия илова мекунед. Якбора — мумкин нест. Дар роҳ хаторо ёфтед — сабт кунед ва ба он бо commit-и алоҳида баргардед.

Мини-тестҳо дар як функсия

Барои санҷиши рефакторинг абзорҳои махсус лозим нестанд. Функсияи хурде кофист, ки ҷавобро бо интизоршаванда муқоиса мекунад:

function check(name, actual, expected) {
  console.log(`${actual === expected ? "OK  " : "FAIL"} ${name}`);
}

const isAdult = age => age >= 18;

check("18 — взрослый", isAdult(18), true);
check("17 — не взрослый", isAdult(17), false);
check("0 — не взрослый", isAdult(0), false);

Чек-листи ягонаи сифати код

То ки «тоза» маънои «чунон ки ба ман маъқул аст»-ро надошта бошад, мо чек-листи умумии 12 банд дорем — версияи пурраи чопӣ дар охири дарс. Бандҳои 1–8 дар бораи код, 9–12 дар бораи лоиҳа. Ҳоло ҳашти аввал лозиманд:

Муфассалтар хонед: refactoring.guru — Рефакторинг чист

/*
function calc(l) {
  let t = 0;
  console.log("calc даъват шуд");
  for (let i = 0; i < l.length; i++) {
    t = t + l[i].p * l[i].q;
  }
  if (t > 500) {
    t = t - t * 0.05;
  }
  return t;
}
*/

const violations = [/* рақамҳои бандҳо */];
console.log(violations.join(", "));

1, 5, 8

/*
function showProfile(user) {
  const box = document.createElement("div");   // div эҷод мекунем
  if (user) {
    if (user.name) {
      if (user.birthYear) {
        const age = 2026 - user.birthYear;
        box.textContent = user.name + ", синну сол: " + age;
        document.body.append(box);
      }
    }
  }
}
*/

const violations = [/* рақамҳои бандҳо */];
console.log(violations.join(", "));

4, 5, 6, 7

function f(a, c) {
  let r = 0;
  for (let i = 0; i < a.length; i++) {
    r += a[i].p * a[i].q;
  }
  if (c === "NAVRUZ") {
    r = r - r * 15 / 100;
  } else {
    if (c === "STUDENT") {
      r = r - r * 10 / 100;
    }
  }
  if (r < 300) {
    r = r + 25;
  }
  return Math.round(r);
}

const small = [{ price: 50, quantity: 2 }, { price: 120, quantity: 1 }];
const big = [{ price: 200, quantity: 3 }];

console.log(calcOrderTotal(small, ""));
console.log(calcOrderTotal(small, "NAVRUZ"));
console.log(calcOrderTotal(small, "STUDENT"));
console.log(calcOrderTotal(big, ""));
console.log(calcOrderTotal(big, "NAVRUZ"));
console.log(calcOrderTotal(big, "UNKNOWN"));
console.log(calcSubtotal(small));
console.log(typeof FREE_DELIVERY_FROM, typeof DELIVERY_PRICE, typeof PROMO_DISCOUNTS);
console.log(calcOrderTotal.toString().includes("else"));

245
212
223
600
510
600
220
number number object
false

const PASS_SCORE = 56;

function getGrade(score) {
  if (score > 86) return 5;
  if (score >= 71) return 4;
  if (score > PASS_SCORE) return 3;
  return 2;
}

function check(name, actual, expected) {
  console.log(`${actual === expected ? "OK  " : "FAIL"} ${name}`);
}

check("90 → 5", getGrade(90), 5);
check("86 → 5", getGrade(86), 5);
check("71 → 4", getGrade(71), 4);
check("56 → 3", getGrade(56), 3);
check("55 → 2", getGrade(55), 2);
check("0 → 2", getGrade(0), 2);

OK 90 → 5
OK 86 → 5
OK 71 → 4
OK 56 → 3
OK 55 → 2
OK 0 → 2

function report(students) {
  const names = [];
  for (let i = 0; i < students.length; i++) {
    if (students[i].visited >= 8) {
      names.push(students[i].name.toUpperCase());
    }
  }
  let total = 0;
  for (let i = 0; i < students.length; i++) {
    total = total + students[i].visited;
  }
  const avg = total / students.length;
  return names.join(", ") + " | среднее: " + avg;
}

const group = [
  { name: "Рустам", visited: 10 },
  { name: "Зарина", visited: 7 },
  { name: "Нилуфар", visited: 8 },
  { name: "Далер", visited: 4 },
];

console.log(report(group));
console.log(report([{ name: "Фарход", visited: 9 }]));
console.log(report([{ name: "Анора", visited: 3 }]));
console.log(typeof MIN_VISITS_FOR_EXCELLENT);
console.log([report, getExcellentNames, calcAverageVisits].some(fn => fn.toString().includes("for (")));

РУСТАМ, НИЛУФАР | среднее: 7.25
ФАРХОД | среднее: 9
| среднее: 3
number
false

06 Ҷамъбасти лоиҳа: npm run build

Дар дарси 17 шумо лоиҳаро дар Vite эҷод кардед ва npm run dev-ро иҷро кардед. Ин реҷаи таҳия аст: Vite файлҳоро «чунон ки ҳастанд» медиҳад, саҳифаро фавран навсозӣ мекунад ва ишораҳо барои таҳиягарро илова менамояд. Барои сайти ҳақиқӣ чунин реҷа мувофиқ нест — код фишурда нашудааст, зиёдатӣ аст, ва сервер танҳо дар ноутбуки шумо кор мекунад. Барои нашр ҷамъбаст (build) лозим аст.

Ҷамъбаст чӣ кор мекунад

1. Ҷамъ мекунад ҳамаи модулҳои шуморо (import/export) ба якчанд файл.
2. Минификатсия мекунад: фосилаҳо, шарҳҳоро хориҷ мекунад, номҳои тағйирёбандаҳоро кӯтоҳ мекунад. Файл якчанд маротиба хурдтар мешавад — саҳифа тезтар бор мешавад.
3. Истифоданашударо мепартояд (tree shaking): агар китобхонаро пайваст карда бошед, аммо як функсияро истифода баред, зиёдатӣ ба сайт намеафтад.
4. Ба номи файлҳо хеш илова мекунад (index-Ab12Cd34.js): код тағйир ёфт — ном иваз шуд, ва браузер версияи тозаро зеркашӣ мекунад, на кӯҳнаро аз кэш мегирад.
5. Натиҷаро ба папкаи dist/ мегузорад — маҳз онро ба хостинг медиҳанд.

npm install        # если ещё не ставили зависимости
npm run build      # запускает «vite build», результат — в папке dist/
npm run preview    # локальный сервер для готовой сборки: http://localhost:4173

Пас аз ҷамъбасти лоиҳаи хурд дар dist/ чӣ меистад:

dist/
├── index.html                  ← точка входа, ссылки на файлы из assets/
├── favicon.svg                 ← всё из папки public/ копируется как есть
└── assets/
    ├── index-Ab12Cd34.js       ← весь ваш JavaScript, сжатый
    └── index-Ef56Gh78.css      ← весь CSS, сжатый

Муфассалтар хонед: vite.dev — Ҷамъбаст барои продакшн

// A. Папкаи dist-ро бояд ба репозиторий commit кард.
// B. Дар dist файлҳои минификатсияшудаи JS ва CSS меистанд.
// C. npm run preview версияи маҳаллӣ ҷамъшудаи сайтро нишон медиҳад.
// D. Хеш дар номи файл (index-Ab12Cd34.js) лозим аст, то браузер пас аз навсозӣ версияи тозаро гирад.
// E. Агар дар реҷаи dev ҳама чиз кор кунад, ҷамъбаст ҳатман мегузарад.
// F. dist/index.html бо дукарата зеркунӣ аз папка боэътимод кушода мешавад.

const correct = [/* "A", "B" ... */];
console.log(correct.join(", "));

B, C, D

const files = ["src/Header.js", "src/footer.js", "src/utils/format.js", "public/Logo.png"];
const imports = ["src/header.js", "src/footer.js", "src/utils/Format.js", "public/Logo.png", "src/missing.js"];

function findCaseMismatches(files, imports) {
  // коди шумо
}

console.log(JSON.stringify(findCaseMismatches(files, imports)));

["src/header.js","src/utils/Format.js"]

07 Тағйирёбандаҳои муҳит ва сирҳо

Нишонии API дар компютери шумо яктост, дар версияи «ҷангии» сайт — дигар. Андозаи саҳифа, номи барнома, калид ба хидмати обуҳаво — ҳамаи инҳо танзимот ҳастанд, ки онҳоро ба код дӯхтан лозим нест. Онҳоро ба тағйирёбандаҳои муҳит мебароранд — файли алоҳида, ки ҳангоми оғоз ва ҷамъбаст хонда мешавад.

Дар Vite чӣ тавр кор мекунад

Дар решаи лоиҳа (дар паҳлӯи package.json) файли .env-ро эҷод кунед:

VITE_API_URL=https://dummyjson.com
VITE_PAGE_SIZE=12
VITE_APP_NAME=Лавка MakeFirstStep
DB_PASSWORD=не-попадёт-в-браузер

Дар код тавассути import.meta.env мехонем:

export const API_URL = import.meta.env.VITE_API_URL;
export const PAGE_SIZE = Number(import.meta.env.VITE_PAGE_SIZE);   // ҳамаи қиматҳо — сатрҳоянд!

console.log(import.meta.env.DB_PASSWORD);   // undefined: бе префикси VITE_ тағйирёбанда пинҳон аст
console.log(import.meta.env.MODE);          // "development" дар dev, "production" дар build
console.log(import.meta.env.DEV);           // true танҳо дар реҷаи таҳия

• Префикси VITE_ — ягона тағйирёбандаҳое, ки Vite ба коди браузерӣ медиҳад. Боқӣ ноаён мемонанд.
• Қиматҳо — ҳамеша сатрҳо. VITE_PAGE_SIZE=12 "12"-ро медиҳад, VITE_DEBUG=false бошад — сатри "false"-ро, ки дар шарт ростӣ ҳисоб мешавад! Худатон табдил диҳед: Number(...), value === "true".
• Пас аз таҳрири .env аз нав оғоз кунед npm run dev-ро — тағйирёбандаҳо ҳангоми оғоз хонда мешаванд.
• Дарунсохтҳо: import.meta.env.MODE, DEV, PROD, BASE_URL.

Кадом файлҳои .env мешаванд

Файли «реҷаи худӣ» .env-и умумиро мепӯшонад. Тағйирёбандаҳое, ки аллакай дар система ё дар хостинг муайян шудаанд, ҳамаро мепӯшонанд.

# macOS / Linux
grep -r "dummyjson" dist/assets

# Windows (PowerShell)
Select-String -Path dist\assets\*.js -Pattern "dummyjson"

Чӣ кор кардан, то ошкор нашавад

1. Файлҳои шахсӣ дар .gitignore: сатрҳои .env.local ва *.local. Бо фармони git status санҷед — файл дар рӯйхат набояд бошад.
2. Файли .env.example-ро эҷод кунед — нусхаи .env бо қиматҳои холӣ. Он ба Git меравад ва ба ҳамкор мегӯяд, ки кадом тағйирёбандаҳо лозиманд: VITE_API_URL=
3. Дар README нависед: «.env.example-ро ба .env нусха кунед ва пур намоед».
4. Дар хостинг қиматҳоро дар панел ворид мекунанд (Vercel — Settings → Environment Variables, GitHub — Settings → Secrets and variables), на дар репозиторий.
5. Агар калид тасодуфан ба commit афтод — онро дуздидашуда ҳисоб кунед: фавран бекор кунед ва дар хидмат нав бароред. Хориҷ кардани commit кофӣ нест: таърихи Git ва ботҳои GitHub-ро скан мекунанд, онро аллакай гирифта тавонистаанд.

node_modules
dist
.env.local
*.local

Муфассалтар хонед: vite.dev — Тағйирёбандаҳои муҳит ва реҷаҳо

const env = {
  VITE_API_URL: "https://api.example.com",
  VITE_APP_NAME: "Мой магазин",
  DB_PASSWORD: "x1",
  SECRET_KEY: "y2",
  MODE: "production",
};

function getPublicEnv(env) {
  // коди шумо
}

console.log(JSON.stringify(getPublicEnv(env)));

{"VITE_API_URL":"https://api.example.com","VITE_APP_NAME":"Мой магазин"}

const text = `
# адрес API
VITE_API_URL=https://dummyjson.com

VITE_APP_NAME="Лавка MakeFirstStep"
VITE_PAGE_SIZE = 12
VITE_FILTER=sort=asc
`;

function parseEnv(text) {
  // коди шумо
}

console.log(JSON.stringify(parseEnv(text)));

{"VITE_API_URL":"https://dummyjson.com","VITE_APP_NAME":"Лавка MakeFirstStep","VITE_PAGE_SIZE":"12","VITE_FILTER":"sort=asc"}

console.log(Boolean("false"));

function readFlag(value) {
  // коди шумо
}

function readNumber(value, fallback) {
  // коди шумо
}

console.log(readFlag("true"), readFlag("false"), readFlag(undefined));
console.log(readNumber("12", 6), readNumber(undefined, 6), readNumber("abc", 6), readNumber("", 6));

true
true false false
12 6 6 6

const lines = [
  'const API_URL = import.meta.env.VITE_API_URL;',
  'const apiKey = "sk_live_51Hh83jKd92hs";',
  'fetch(`${API_URL}/products`);',
  "const password = 'qwerty12345';",
  'const token = import.meta.env.VITE_TOKEN;',
  'const secret = "";',
  'const authToken = "Bearer eyJhbGciOiJI";',
  'const title = "My secret garden";',
];

function findSecrets(lines) {
  // коди шумо
}

console.log(findSecrets(lines).join(", "));

2, 4, 7

08 Деплой: Vercel ва GitHub Pages

Деплой — нашри сайт дар интернет, то ҳар кас онро аз рӯи истинод кушояд. То лоиҳа дар ноутбуки шумост, ин машқ аст. Вақте ки он истинод дорад — ин портфолио аст. Мо ду усули ройгонро барои сайтҳои статикӣ таҳлил мекунем (ва лоиҳаҳои шумо дар Vite — маҳз чунинанд).

Пеш аз деплой: чек-листи кӯтоҳ

• npm run build бе хато мегузарад, npm run preview сайти корӣ нишон медиҳад.
• Лоиҳа дар репозиторий дар GitHub меистад (дарси 19), шохаи бо коди корӣ фиристода шудааст: git push.
• Дар репозиторий .env.local ва сирҳо нестанд; .env.example ҳаст.
• Ҳарфи калон ва хурди номҳои файлҳо ва import-ҳо мувофиқат мекунад.

Усули 1. Vercel

Vercel худаш Vite-ро меёбад, худаш лоиҳаро ҷамъ мекунад ва пас аз ҳар git push сайтро навсозӣ мекунад. Барои навомӯз — кӯтоҳтарин роҳ.

1. vercel.com-ро кушоед ва бо тугмаи Continue with GitHub ворид шавед (тарифи Hobby барои лоиҳаҳои шахсӣ ройгон аст).
2. Add New… → Project-ро пахш кунед. Vercel репозиторийҳои шуморо нишон медиҳад: даркориро ёбед ва Import-ро пахш кунед (бори аввал дастрасӣ ба репозиторийҳоро иҷозат диҳед).
3. Дар экрани танзим санҷед: Framework Preset — Vite (худаш муайян мешавад), Build Command — npm run build, Output Directory — dist.
4. Environment Variables-ро кушоед ва тағйирёбандаҳоро аз .env-и худ илова кунед (масалан, VITE_API_URL) — яктоӣ: ном ва қимат. Файли .env-ро Vercel аз репозиторий намехонад.
5. Deploy-ро пахш кунед. Пас аз як дақиқа нишонии намуди номи-лоиҳа.vercel.app пайдо мешавад. Ин истиноди зиндаи шумост.
6. Минбаъд: ҳар git push ба шохаи асосӣ сайтро навсозӣ мекунад, ва ҳар шохаи дигар нишонии алоҳидаи пешнамоиш мегирад — қулай аст барои нишон додани таҳрирҳо пеш аз ҷамъкунӣ.

git add .
git commit -m "fix price format"
git push
# Vercel сам запустит npm run build и обновит сайт

Усули 2. GitHub Pages

Хостинги ройгон бевосита дар репозиторий (барои репозиторийҳои оммавӣ). Нишонӣ — https://логини-шумо.github.io/номи-репозиторий/. Ба қисми охирин диққат диҳед: сайт на дар реша, балки дар зерпапка зиндагӣ мекунад. Барои ҳамин ба Vite бояд гуфт, ки файлҳоро аз куҷо гирад — танзими base.

import { defineConfig } from "vite";

export default defineConfig({
  base: "/my-shop/",   // ← номи дақиқи репозиторий байни хатҳои моил
});

Бе base саҳифа холӣ бор мешавад: дар консол 404 ба /assets/index-….js мешавад, зеро браузер файлро дар решаи github.io меҷӯяд, на дар репозиторийи шумо. Дар код истиноди файлҳоро аз public/ тавассути import.meta.env.BASE_URL месозем, на "/logo.png"-ро бо даст менависем.

1. base-ро дар vite.config.js муайян кунед, npm run build ва npm run preview-ро иҷро кунед (нишонии пешнамоиш /my-shop/-ро дар бар мегирад).
2. Кодро ба GitHub фиристед: git push.
3. Дар репозиторий: Settings → Pages → дар майдони Source GitHub Actions-ро интихоб кунед.
4. Файли .github/workflows/deploy.yml-ро эҷод кунед (дар зер), commit кунед ва фиристед.
5. Ҷадвали Actions: тики сабзро интизор шавед. Нишонии сайт дар Settings → Pages пайдо мешавад.
6. Тағйирёбандаҳо лозиманд? Settings → Secrets and variables → Actions → Variables, ва дар workflow онҳоро ба қадами ҷамъбаст диҳед (ниг. env дар зер).

name: Deploy to GitHub Pages

on:
  push:
    branches: [main]
  workflow_dispatch:

permissions:
  contents: read
  pages: write
  id-token: write

concurrency:
  group: pages
  cancel-in-progress: true

jobs:
  deploy:
    runs-on: ubuntu-latest
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    steps:
      - uses: actions/checkout@v7
      - uses: actions/setup-node@v7
        with:
          node-version: lts/*
          cache: npm
      - run: npm ci
      - run: npm run build
        env:
          VITE_API_URL: ${{ vars.VITE_API_URL }}
      - uses: actions/configure-pages@v6
      - uses: actions/upload-pages-artifact@v5
        with:
          path: ./dist
      - id: deployment
        uses: actions/deploy-pages@v5

Рақамҳои версияи амалҳо (@v7, @v5…) бо мурури замон иваз мешаванд — пеш аз нусха кардан бо мисоли ҷорӣ дар vite.dev/guide/static-deploy муқоиса кунед. Ин муқаррарӣ аст: дастурҳои деплойро ҳамеша тозаашро кушодан лозим аст, на ба хотира (ва ба хотираи ЗС) такя кардан.

Чӣ интихоб кардан

Барои курс: лоиҳаи аввал — дар Vercel, дуюм — дар GitHub Pages. Ҳамин тавр шумо ҳарду равишро месанҷед, ва дар портфолио ду истиноди зинда мешавад.

Муфассалтар хонед: vite.dev — Деплойи сайти статикӣ, Vercel — Vite

function getBase(repoName) {
  // коди шумо
}

function assetUrl(base, path) {
  // коди шумо
}

console.log(getBase("my-shop"));
console.log(getBase("komilovsg.github.io"));
console.log(assetUrl("/my-shop/", "img/logo.png"));
console.log(assetUrl("/my-shop/", "/img/logo.png"));
console.log(assetUrl("/", "/favicon.svg"));

/my-shop/
/
/my-shop/img/logo.png
/my-shop/img/logo.png
/favicon.svg

// Вазъиятҳо:
// 1. Дар маҳал расми logo.png намоён аст, дар Vercel — не. Дар код "./Logo.png" навишта шудааст.
// 2. Сайт кушода шуд, аммо дархостҳо ба нишонии "undefined/products" мераванд.
// 3. GitHub Pages: саҳифа холӣ, дар консол 404 ба /assets/index-xxx.js.
// 4. Тағйирёбандаро ба панели Vercel илова кардем, аммо сайт қимати кӯҳнаро нишон медиҳад.
//
// Сабабҳо:
// A. base дар vite.config.js муайян нашудааст.
// B. Ҳарфи калон ва хурд дар номи файл мувофиқат намекунад.
// C. Тағйирёбандаи муҳит ба хостинг илова нашудааст.
// D. Пас аз илова кардани тағйирёбанда Redeploy накарданд.

const answers = [/* "?", "?", "?", "?" */];
console.log(answers.join(", "));

B, C, A, D

09 Блоки ЗС: ревьюи код ва README

Имрӯз ЗС дар ду нақш кор мекунад: ревьюер (кодатонро мехонад ва мушкилотро пай мебарад) ва ёрдамчии матнҳо (README ва тавсифи лоиҳа барои портфолио). Дар ҳарду ҳолат маҳорати асосӣ на «ҷавоб гирифтан», балки хубро аз бад ҷудо кардан аст: ЗС ҳам муфид, ҳам зарарнокро бо боварӣ маслиҳат медиҳад.

Ревью аз рӯи чек-лист: бад ва хуб

Формулаи промпти курс: контекст → вазифа → маҳдудиятҳо → формати ҷавоб → санҷиш.

Чаро промпти дуюм беҳтар кор мекунад: ЗС сатҳи шуморо медонад, рӯйхати мушаххаси меъёрҳоро гирифт, он чизеро, ки напурсидаанд, «беҳтар» карда наметавонад, ва ҷавобро шумо фавран бо рӯйхати худатон муқоиса карда метавонед.

Филтри маслиҳатҳо: қабул ё рад кардан

Ҳар маслиҳати ЗС аз панҷ савол мегузарад. Як «не» кофист — ва маслиҳатро қабул намекунем (ё мегузорем):

/*
function calcTotal(items, promo) {
  let total = 0;
  for (const item of items) {
    total += item.price * item.qty;
  }
  if (promo === "NAVRUZ") {
    total = total * 0.85;
  }
  if (total > 300) {
    total = total + 0;
  } else {
    total = total + 25;
  }
  return total;
}
*/

// Маслиҳатҳои ЗС:
// 1. Рақамҳои 0.85, 300 ва 25-ро ба собитҳои номдор бароред.
// 2. Давраи for...of-ро бо reduce иваз кунед — reduce ҳамеша аз давраҳо беҳтар аст.
// 3. Сатри «total = total + 0» ҳеҷ кор намекунад — онро хориҷ кунед.
// 4. Болои ҳар сатри функсия шарҳ илова кунед.
// 5. total-ро ба finalTotalAmountWithPromoAndDeliveryCalculated иваз кунед.
// 6. Ҳисоб аз рӯи промокодро ба функсияи алоҳидаи applyPromo бароред.
// 7. Тамоми бадани функсияро ба try/catch бипечонед, барои ҳолати хато.
// 8. lodash-ро пайваст кунед, то нархҳоро ҷамъ кунад.

const verdicts = [/* "A" ё "R" барои маслиҳатҳои 1–8 */];
console.log(verdicts.join(","));

A,R,A,R,R,A,R,R

/*
function getCheapProducts(products) {
  const result = [];
  for (let i = 0; i < products.length; i++) {
    if (products[i].price < 20) {
      result.push(products[i]);
    }
  }
  return result;
}
*/

// Маслиҳатҳои ЗС:
// 1. Давраро бо products.filter(...) иваз кунед, ва рақами 20-ро ба собити MAX_PRICE бароред.
// 2. Методи дарунсохти products.filterByPrice(20)-ро истифода баред — он ҳамонро тезтар мекунад.
// 3. «<»-ро ба «<=» иваз кунед: «то 20 сомонӣ» мантиқитар аст, ки сарҳад дохил шавад.
// 4. Нархҳоро аз сервер бор кунед, калидро бевосита ба функсия навишта: const KEY = "sk_live_...".
// 5. result-ро ба cheapProducts иваз кунед.
// 6. Пеш аз бозгардонидан маҳсулотро аз рӯи нарх бо тартиби афзоиш мураттаб кунед.
// 7. TypeScript ва Redux илова кунед — ҳамин тавр функсия боэътимодтар мешавад.

const verdicts = [/* "A", "T" ё "R" барои маслиҳатҳои 1–7 */];
console.log(verdicts.join(","));

A,R,T,R,A,T,R

function getShipping(sum, isMember) {
  if (isMember) return 0;
  if (sum >= 300) return 0;
  return 25;
}

function getShippingAI(sum, isMember) {
  return isMember || sum > 300 ? 0 : 25;
}

const inputs = [[100, false], [300, false], [300, true], [500, false], [0, true], [299.99, false]];

// коди шумо: давра аз рӯи inputs ва муқоиса

300 false: 0 → 25

README ва матн барои портфолио бо ЗС

README — чизи аввале аст, ки рекрутер дар саҳифаи репозиторий мебинад. Хуб аст, вақте ки он ба чор савол ҷавоб медиҳад: ин чист, бо чӣ сохта шудааст, чӣ тавр оғоз кардан, дар куҷо дидан. ЗС зуд скелетро ҷамъ мекунад, аммо қоида ҳаст: ЗС танҳо далелҳоеро мегирад, ки шумо ба ӯ додаед. Вагарна ӯ функсияҳоеро, ки нестанд, мекашад.

Дар матни ЗС чиро санҷидан лозим

• Функсияҳо ва технологияҳои андешидашуда. «Авторизатсия», «пойгоҳи додаҳо», «фарогирии тестҳо 95%» — агар дар лоиҳа нест, хат мезанем.
• Фармонҳо. Ҳар яки аз README-ро дар папкаи тоза иҷро кунед: npm install, npm run dev. Кор мекунад — мегузорем.
• Скриншот ва истинод ба демо — худатон мегузоред, ЗС онҳоро намедонад.
• Ибораҳои қолабӣ («ин лоиҳа маҳз … мебошад», «ҳалли муосир») — бо суханони худатон бознависед. Рекрутер овози одамро мешунавад, на шабакаи асабиро.
• Ростқавлӣ. Чӣ худатон кардед, ва чӣ бо ёрии ЗС — бевосита гуфтан мумкин аст. Касе интизор нест, ки шумо бе ёридиҳандагон навиштаед; интизоранд, ки шумо кодро мефаҳмед.

// Нусхаи пешакии README аз ЗС:
// 1. Ҷустуҷӯ аз рӯи номи маҳсулот ва баровардани саҳифагӣ.
// 2. Вуруд тавассути ҳисоби Google.
// 3. Оғоз: npm install, баъд npm run dev.
// 4. Маълумот дар пойгоҳи PostgreSQL нигоҳ дошта мешавад.
// 5. Нишонагузории мутобиқшаванда: сайтро дар телефон кушодан қулай аст.
// 6. Фарогирии автотестҳо — 95%.
// 7. Маълумот дар бораи маҳсулот аз dummyjson.com гирифта мешавад.

const invented = [/* рақамҳо */];
console.log(invented.join(", "));

2, 4, 6

10 Амал дар дарс: ревьюи ҳамсоя ва деплойи гурӯҳ

Нимаи дуюми дарс — гурӯҳӣ: шумо лоиҳаи ҳамсояро месанҷед ва беҳтар мекунед, баъд тамоми гурӯҳ лоиҳаҳои худро ба интернет мегузорад. Ин маҳз ҳамон чизест, ки дар гурӯҳи ҳақиқӣ рух медиҳад: code-review → таҳрирҳо → релиз.

Қисми A. Ревьюи лоиҳаи ҳамсоя (дар ҷуфтҳо)

1. Истиноди репозиторийҳоро мубодила кунед. Лоиҳаи ҳамсояро clone кунед: git clone истинод, баъд npm install ва npm run dev. Боварӣ ҳосил кунед, ки он оғоз мешавад.
2. Чек-листи чопӣ-ро (қисми 11) кушоед. Аз рӯи 12 банд гузаред ва дар сутуни «То» нишон гузоред.
3. 5–8 мулоҳиза-ро бо як формат сабт кунед: файл:сатр — банди № — чӣ нодуруст аст ва барои чӣ — чӣ тавр ислоҳ кардан. Мисол: src/cart.js:14 — банди 5 — рақами 300 бе ном, нофаҳмо аст, ки ин остонаи интиқол аст — ба FREE_DELIVERY_FROM баровардан.
4. Мулоҳизаҳо бояд хушмуомила ва мушаххас бошанд: «функсияи calc нофаҳмо номгузорӣ шудааст» — бад; «дар calc t-ро ба total иваз кунед, то намоён шавад, ки ҷамъ мекунем» — хуб. Кодро интиқод мекунем, на одамро.
5. Мулоҳизаҳоро бо овоз муҳокима кунед: муаллиф ҳақ дорад розӣ нашавад, агар фаҳмонад, ки барои чӣ.

Қисми B. Рефакторинг аз рӯи мулоҳизаҳо

1. Муаллиф шоха эҷод мекунад: git switch -c refactor/clean-code.
2. Аз рӯи мулоҳизаҳо яктоӣ мегузарад. Пас аз ҳар кадом: иҷро → ҳама мисли пештара кор мекунад → git commit -m "extract delivery constants" (паём — аз рӯи қоидаҳои дарси 19).
3. Санҷиши рафтор: барномаро кушоед ва ҳамон сенарияҳоро, ки пеш аз таҳрирҳо, гузаред (ҷустуҷӯ, саҳифабандӣ, хатои шабака). Чизе тағйир ёфт — бозгашт: git restore ..
4. Дар охир: npm run build бе хато. Баъд git push-и шоха.
5. Чек-листро такроран гузаред, сутуни «Пас»-ро пур кунед. Ҳадаф — на камтар аз 10 аз 12.

Қисми C. Деплойи ҳамаи лоиҳаҳои гурӯҳ

1. Лоиҳаи 1 → Vercel аз рӯи қадамҳои қисми 08. Вақти ҳадаф — 10 дақиқа. Нашуд? Логи ҷамъбастро хонед: хато қариб ҳамеша дар сатрҳои охирин нишон дода шудааст.
2. Лоиҳаи 2 → GitHub Pages: base, workflow, Settings → Pages. Онҳое, ки зудтар тамом карданд, ба ҳамсояҳо навбатӣ кумак мекунанд — шарҳ додан, на ба ҷои дигаре пахш кардан.
3. Санҷиши истинод: дар реҷаи инкогнито ва дар телефон кушоед, дар DevTools → Console хатои сурх набояд бошад, дар Network — ягон 404 нест.
4. Ҳамаи истинодҳо ба ҷадвали умумии гурӯҳ ворид мешаванд (формат: ном, лоиҳа, истинод ба сайт, истинод ба репозиторий).

Қисми D. README бо ЗС

1. Далелҳо-ро дар бораи лоиҳа омода кунед: чӣ кор мекунад, стек, фармонҳои оғоз, истинод ба демо.
2. Аз ЗС хоҳиш кунед, ки README-ро аз рӯи промпти қисми 09 ҷамъ кунад.
3. Аз рӯи рӯйхати «Чиро санҷидан» санҷед: андешаҳоро хат занед, фармонҳоро иҷро кунед, скриншот ва истинод илова кунед, ибораҳои қолабиро бознависед.
4. README.md-ро ба реша commit кунед ва фиристед.

11 Чек-листи сифати код (версияи чопӣ)

Як чек-лист барои тамоми гурӯҳ: аз рӯи он шумо лоиҳаҳои худ, лоиҳаҳои ҳамсояҳо ва (баъдтар) лоиҳаи ниҳоиро месанҷед. Саҳифаро чоп кунед (Ctrl + P дар Windows, Cmd + P дар macOS) — панел ва ишораҳо ҳангоми чоп пинҳон мешаванд, ҷадвал мемонад. Ё онро ба PDF нигоҳ доред.

Лоиҳа: ____________________

Муаллиф: ____________________

Ревьюер: ____________________

Сана: ______________

Ҳамагӣ: пеш аз рефакторинг ____ / 12, пас аз он ____ / 12.

Се мулоҳизаи асосии ревьюер:

1. ______________________________

2. ______________________________

3. ______________________________

12 Вазифаи хонагӣ

Вазифа: лоиҳаи хурди 2-ро рефакторинг кунед, ду лоиҳаро деплой кунед, README-ро ороиш диҳед ва истинодҳоро фиристед. Натиҷаи дарс — чек-листи пуршудаи сифати код ва истинодҳои зинда ба лоиҳаҳо.

1. То-ро баҳо диҳед. Лоиҳаи хурди 2-ро аз рӯи чек-листи қисми 11 пеш аз ҳар таҳрир гузаред. Натиҷаро (X аз 12) ва рӯйхати вайронкуниҳоро сабт кунед.
2. Рефакторинг кунед. Шохаи refactor/clean-code-ро эҷод кунед. На камтар аз панҷ commit-и бомаъно — ҳар кадом дар бораи як таҳрир («rename cart variables», «extract delivery constants», «split render from calc»). Рафтори барнома тағйир намеёбад.
3. Пас-ро баҳо диҳед. Чек-листро такрор кунед. Ҳадаф — на камтар аз 10 аз 12. Шохаро бо усули оддӣ ба асосӣ ҷамъ кунед (тавассути PR, мисли дарси 19).
4. Ду лоиҳаро деплой кунед. Лоиҳаи хурди 2 — дар Vercel; як лоиҳаи дигар (лоиҳаи хурди 1 ё ҳар кадом дигар) — дар GitHub Pages. Ҳарду истинод бояд бе хато дар консол кушода шаванд.
5. Сирҳо ва муҳит. Дар ҳарду репозиторий .env.example ҳаст, калидҳои воқеӣ нестанд, тағйирёбандаҳо (агар бошанд) дар хостинг муайян шудаанд.
6. README. Дар ҳар репозиторий: ин чист, стек, чӣ тавр оғоз кардан, скриншот, истинод ба демо, «минбаъд чӣ». Нусхаи пешакиро бо ЗС кардан мумкин аст, вале бо суханони худатон бознависед ва ҳамаи фармонҳоро санҷед.
7. Матн барои портфолио. 3–4 ҷумла дар бораи лоиҳаи хурди 2: вазифа, худатон чӣ кардед, стек, истинод.

Чӣ супурдан лозим

• Истинодҳо ба ду репозиторий ва ду истиноди зинда ба сайтҳо.
• Чек-листи пуршуда (сутунҳои «То» ва «Пас») бо ҳисоб.
• Дафтари рефакторинг: ҷадвал ҳадди аққал аз панҷ сатр — «банди чек-лист → чӣ тағйир додем → номи commit».
• Матн барои портфолио (дар README ё дар файли алоҳида).

Чӣ тавр баҳо медиҳем (0–10)