IlmHamroh
Dasturlash kitobi (eski nashr)/0-QISM — Tayyorgarlik7/7-dars17 daqiqa
Mundarija (29)

VS Code, Node.js va npm o'rnatish — dasturchi asboblari (0.7-bob)

0-QISM — TAYYORGARLIK · 7-mavzu (yakuniy)


1. Kirish va motivatsiya

Duradgor yog'ochni tushunadi, lekin asboblarsiz stol yasolmaydi. Siz kompyuterni (0.1–0.2), terminalni 0.3-bob, tarmoqni (0.4–0.5) va fikrlashni 0.6-bob o'rgandingiz — endi haqiqiy kod yozadigan ustaxonani qurish vaqti.

Bu bob — 0-QISMning so'nggi bobi va eng amaliysi. Bu yerda gap nazariyada emas, qo'l bilan o'rnatish va sozlashda. Bob oxiriga kelib, sizning mashinangizda professional dasturchiniki kabi to'liq ish muhiti bo'ladi:

  • VS Code — kod yozadigan muharrir (editor), to'g'ri kengaytmalar bilan.
  • Node.js — JavaScript'ni brauzerdan tashqarida ishlatadigan muhit (0.5: V8 esingizdami?).
  • npm — dunyodagi tayyor kod kutubxonalarini o'rnatadigan menejer.

Nega bu muhim? Chunki butun qolgan kitob shu uch asbobga tayanadi. Har bir React loyihasi, har bir backend, har bir misol — VS Code'da yoziladi, Node bilan ishga tushadi, npm bilan kutubxona oladi. Ustaxonani bir marta to'g'ri qursangiz — minglab soat tejaysiz.

Yaxshi xabar: ehtimol mashinangizda Node.js allaqachon o'rnatilgandir (node --version bilan tekshiramiz — agar v22 kabi natija chiqsa, bor). Agar o'rnatilmagan bo'lsa, xavotir olmang — 4.1-bo'limda qadamma-qadam o'rnatamiz. Har holatda ham bu bobni o'qiganda, biz mexanizmni tushunib, muhitni to'g'ri sozlaymiz.


2. Nazariya — chuqur tushuntirish

2.1. Kod muharriri (editor) vs IDE

  • Text editor (matn muharriri) — sodda; matn yozadi (masalan Notepad).
  • Code editor (kod muharriri) — kod uchun maxsus: rang berish (syntax highlighting), avto-to'ldirish, xato ko'rsatish. Masalan VS Code.
  • IDE (Integrated Development Environment) — "hammasi birga": editor + debugger + build + boshqalar (masalan WebStorm, Visual Studio).

VS Code texnik jihatdan editor, lekin kengaytmalar (extensions) bilan deyarli IDE darajasiga chiqadi. U bepul, tez, va veb-dasturchilar orasida eng keng tarqalgan — shuning uchun biz uni tanlaymiz.

Qiziq: VS Code'ning o'zi ham veb-texnologiyalarda (JS/TypeScript) yozilgan va Electron ustida ishlaydi. Ya'ni siz o'rganadigan stack bilan qurilgan dastur ichida o'sha stackni o'rganasiz.

2.2. Node.js nima va nega kerak?

Yodingizda bo'lsa (0.5-bob), JavaScript brauzer ichida V8 engine orqali bajariladi. Lekin JS faqat brauzerda — tugma bosish, sahifani o'zgartirish bilan cheklangan edi. Node.js aynan shu chegarani buzdi.

Node.js — bu V8 engine'ni brauzerdan chiqarib, alohida dastur qilib o'rab qo'ygan runtime (ishga tushirish muhiti). Natijada JavaScript endi:

  • fayl o'qiy/yoza oladi (0.2: fs),
  • server bo'la oladi (0.4: HTTP so'rovlarni qabul qiladi),
  • operatsion tizim bilan ishlay oladi (0.2: os, path),
  • ma'lumotlar bazasi bilan gaplasha oladi.
text
   BRAUZERDA JS              NODE.JS'DA JS
   ┌──────────────┐         ┌──────────────┐
   │  V8 engine    │         │  V8 engine    │
   │  + DOM, fetch │         │  + fs, http,  │
   │  (brauzer API)│         │  os, path...  │
   └──────────────┘         │  (Node API)   │
   sahifani boshqaradi      └──────────────┘
                            fayl, server, OS bilan ishlaydi

Mana shuning uchun JavaScript bilan butun stackni (frontend + backend) yozish mumkin — bu kitobning butun mantig'i shunga asoslangan. Bitta tilni chuqur o'rganib, hamma joyda ishlatasiz.

O'xshatish: brauzer — bu JS uchun "akvarium" (chiroyli, lekin chegaralangan: faqat sahifa). Node.js — JS'ni akvariumdan olib, "okean"ga qo'yish: endi u fayllar, serverlar, tarmoq bilan erkin ishlaydi.

2.3. npm — paket menejeri

npm (Node Package Manager) — Node bilan birga keladigan paket menejeri. U ikki narsa:

  1. Asbob (CLI) — terminaldan kutubxona o'rnatadi (npm install ...).
  2. Registry (ombor) — dunyodagi eng katta ochiq kod kutubxonalari to'plami (millionlab paket: Express, React, Lodash...).

Nega paket menejeri kerak? Hamma narsani o'zingiz yozish — g'ildirakni qaytadan ixtiro qilish. Sana formatlash, server yaratish, validatsiya — bularni minglab odam yozib, sinab, sayqal bergan. npm orqali ularni bir buyruq bilan olasiz:

bash
npm install express   # Express'ni (server kutubxonasi) loyihaga qo'shadi

O'xshatish: npm — bu dasturchilar uchun "App Store". Kerakli "ilova"ni (kutubxonani) qidirib, o'rnatasiz; u o'ziga kerakli boshqa narsalarni (dependencies) ham avtomatik olib keladi.

npx — o'rnatmasdan ishga tushirish. npm bilan birga npx ham keladi. U paketni doimiy o'rnatmasdan, bir martalik ishga tushiradi: paketni vaqtincha yuklab, bajarib, so'ng tashlab yuboradi. Bu yangi loyiha ochuvchi asboblar (scaffolding) uchun juda qulay:

bash
npm create vite@latest mening-app -- --template react-ts   # zamonaviy Vite shablonini ishga tushiradi

Muhim tarixiy eslatma: Ilgari ko'plab darsliklarda npx create-react-app ko'rsatilgan. Bugungi kunda Create React App (CRA) rasman eskirgan (deprecated) deb e'lon qilingan va React jamoasi uni ishlatmaslikni tavsiya qiladi. Zamonaviy dunyoda uning o'rnini Vite (chaqmoqdek tez, Rollup/esbuild asosida) yoki Next.js (13-QISM) egallagan.

Paket menejerlari: npm vs pnpm vs bun vs yarn. npm — yagona paket menejeri emas, lekin standart (Node bilan keladi). Zamonaviy industriyada esa bir nechta kuchli raqobatchilar bor:

Menejer Qisqacha xususiyati Qachon tanlanadi?
npm Node bilan birga keladi, o'rnatish shart emas. O'rganish va standart loyihalar uchun ideal boshlanish.
pnpm Diskni 3 baravargacha tejaydi (hard-links orqali barcha loyihalar uchun bitta global ombor ishlatadi) va "phantom dependencies" (o'zi e'lon qilmagan paketlarni chaqira olmaslik) xavfini yo'qotadi. Zamonaviy kompaniyalar, monorepolar (Turborepo) va katta jamoalarda 1-o'rindagi tanlov.
bun Zig tilida yozilgan, CPython/V8 o'rniga JavaScriptCore ishlatadi. Paketlarni npm'dan 4–10 barobar tezroq o'rnatadi. Runtime + paket menejeri + test runner. Maksimal tezlik va zamonaviy tajriba kerak bo'lganda.
yarn Facebook chiqargan; kesh tizimi yaxshi, lekin bugun ko'pchilik pnpm yoki npm'ga o'tmoqda. Eski loyihalarda saqlanib qolgan.

Tavsiya: Boshlanishida npmda qoling — u har qanday muhitda kafolatlangan ishlaydi. Loyihalaringiz ko'payib, diskda node_modules 50 GB joy ola boshlaganda esa bir buyruq bilan pnpmga o'tasiz (npm install -g pnpm). Mohiyat bir xil — har biri package.json bilan ishlaydi.

2.4. package.json — loyihaning "pasporti"

Har bir Node loyihasining markazida package.json fayli turadi (npm rasmiy hujjatlariga ko'ra). Bu — loyiha haqidagi barcha ma'lumotni saqlaydigan JSON fayl: nomi, versiyasi, qaysi kutubxonalarga bog'liqligi, qanday buyruqlar bilan ishga tushishi.

json
{
  "name": "mening-loyiham",        // loyiha nomi (majburiy)
  "version": "1.0.0",              // versiya (majburiy, semver — 2.6)
  "description": "Birinchi loyiham",
  "type": "module",               // ES Modules ishlatamiz (import/export — 2.14)
  "scripts": {                    // nomlangan buyruqlar (2.5)
    "start": "node index.js",
    "dev": "node --watch index.js"
  },
  "dependencies": {               // ishlash uchun kerak kutubxonalar
    "express": "^4.19.2"
  },
  "devDependencies": {            // faqat ishlab chiqishda kerak (test, lint)
    "nodemon": "^3.1.0"
  }
}

2.5. Scripts — buyruqlarni nomlash

scripts — package.jsonning eng foydali qismlaridan biri. U uzun terminal buyruqlariga qisqa nom beradi:

bash
npm run dev      # "scripts.dev" dagi buyruqni ishga tushiradi
npm start        # "start" maxsus — "run" siz ham ishlaydi
npm test         # "test" ham maxsus

Nega qulay? "Loyihani qanday ishga tushiraman?" degan savolga javob doim bitta joyda (package.json) bo'ladi. Yangi dasturchi loyihaga kelsa, npm run dev deydi — qanday murakkab buyruq ortida turganini bilishi shart emas (0.6: abstraction).

2.6. Versiyalash (semver) — qisqacha

Har paketning versiyasi uch sondan iborat: MAJOR.MINOR.PATCH (masalan 4.19.2):

  • MAJOR (4) — katta, mos kelmaydigan o'zgarish (eski kod buzilishi mumkin).
  • MINOR (19) — yangi imkoniyat, orqaga mos (eski kod ishlaydi).
  • PATCH (2) — xato tuzatish, mos.

package.jsondagi belgilar:

  • ^4.19.2 — 4.x.x ichidagi eng yangi (MAJOR o'zgarmaydi) — eng keng tarqalgan.
  • ~4.19.2 — 4.19.x ichidagi eng yangi (faqat PATCH).
  • 4.19.2 — aniq shu versiya.

(Buni 5.2-bobda chuqur ochamiz; hozir g'oyasini bilsangiz yetarli.)

2.7. node_modules va lock-fayl

  • node_modules/ — o'rnatilgan barcha kutubxonalar shu yerda yashaydi. U juda katta bo'lishi mumkin (minglab fayl) va dependencies dagi paketlarning o'z bog'liqliklarini ham o'z ichiga oladi. Shuning uchun uni hech qachon git'ga qo'ymaymiz (0.2, 4.5: .gitignore) — package.jsondan har kim qayta tiklaydi (npm install).
  • package-lock.json — o'rnatilgan paketlarning aniq versiyalarini qayd etadi, shunda har bir dasturchida bir xil versiya o'rnatiladi. Buni esa git'ga qo'shamiz.

2.8. Node versiya menejeri (nvm, fnm, volta) va .nvmrc

Turli loyihalar Node'ning turli versiyalarini talab qilishi mumkin (biri eski loyiha Node 18, boshqasi eng yangi Node 22). Har safar butun Node.js'ni qayta o'rnatmaslik uchun versiya menejeri ishlatiladi:

  • fnm (Fast Node Manager): Rust tilida yozilgan, o'ta tez va Windows, Mac, Linux uchun bir xil ishlaydi (winget install Schniz.fnm).
  • nvm (Node Version Manager): Linux/macOS standarti (nvm install 22 && nvm use 22).
  • Volta: JavaScript asboblari uchun o'ta qulay universal menejer.

Jamoaviy amaliyot — .nvmrc fayli: Katta jamoalarda barcha dasturchilar bir xil Node versiyasida ishlashi shart. Buning uchun loyiha ildizida .nvmrc fayli yaratilib, ichiga kerakli versiya yoziladi (masalan, 22.12.0). Shunda yangi dasturchi loyihaga kelib, shunchaki nvm use yoki fnm use desa, tizim avtomatik tarzda to'g'ri Node versiyasiga o'tadi. Bu "menda ishladi, senda ishlamadi" degan versiya nizolarini butunlay bartaraf etadi.


3. Sintaksis — asosiy npm buyruqlari

bash
node --version          # Node versiyasini ko'rsatadi (o'rnatilganini tekshirish)
npm --version           # npm versiyasi

npm init                # package.json yaratish (savollar bilan)
npm init -y             # package.json yaratish (barchasiga "ha" — tez)

npm install <paket>     # paketni o'rnatish + dependencies'ga qo'shish
npm install             # package.json'dagi BARCHA paketlarni o'rnatish
npm install -D <paket>  # devDependencies'ga (test/lint asboblari)
npm install -g <paket>  # GLOBAL o'rnatish (butun tizimga — ehtiyot bo'ling, 5-bo'lim)

npm uninstall <paket>   # paketni o'chirish
npm run <skript>        # scripts'dagi buyruqni ishga tushirish
npm start / npm test    # maxsus scriptlar (run'siz)

npx <paket>             # paketni o'rnatmasdan, bir martalik ishga tushirish (2.3)

4. Batafsil amaliy qadamlar

4.1. Node.js o'rnatish (agar yo'q bo'lsa)

Avval Node o'rnatilgan-o'rnatilmaganini tekshiramiz:

bash
node --version    # masalan: v22.17.0  → o'rnatilgan
npm --version     # masalan: 10.x.x

Agar command not found (0.3: PATH) chiqsa, o'rnatish kerak. Windows'da variantlar:

  • Eng oson: nodejs.org dan LTS (Long Term Support — barqaror) versiyani yuklab, o'rnatuvchi (installer) bilan o'rnatish.
  • winget bilan: winget install OpenJS.NodeJS.LTS
  • Versiya menejeri bilan (tavsiya, keyinroq): fnm yoki nvm-windows.

LTS vs Current: LTS — barqaror, uzoq qo'llab-quvvatlanadigan (production uchun). Current — eng yangi imkoniyatlar (sinov uchun). Doim LTSni tanlang.

4.2. VS Code o'rnatish va sozlash

  1. code.visualstudio.com dan yuklab o'rnatish.
  2. Muhim: o'rnatishda "Add to PATH" va "Open with Code" variantlarini belgilash — shunda terminaldan code . bilan papkani VS Code'da ochasiz.
bash
code .            # joriy papkani VS Code'da ochadi (0.3: "." — joriy papka)

Tavsiya etiladigan kengaytmalar (extensions):

Kengaytma Nima uchun
ESLint kod xatolarini real vaqtda ko'rsatadi (15.3)
Prettier kodni avtomatik chiroyli formatlaydi (15.3)
GitLens git tarixini kod yonida ko'rsatadi (4-QISM)
Error Lens xatoni aynan qator yonida yozadi
Path Intellisense fayl yo'llarini avto-to'ldiradi (0.2)
DotENV .env fayllariga rang beradi (5.8)
Thunder Client yoki REST Client API so'rovlarini sinash (0.4)

Kengaytma — yashirin kuch: kengaytma — bu VS Code'ga yangi qobiliyat qo'shadigan kichik plagin. Ularni chap paneldagi kvadratlar belgisi (yoki Ctrl+Shift+X) orqali qidirib o'rnatasiz. Ko'pini bir marta o'rnatib, butun kitob davomida ishlatasiz — keraksizini esa o'chirib qo'yish mumkin (tezlikni saqlash uchun).

VS Code ichidagi terminal. Alohida terminal dasturini ochishning hojati yo'q — VS Code'da terminal ichida joylashgan (0.3-bobdagi bash/PowerShell aynan shu yerda ishlaydi):

  • Ochish: Ctrl va backtick (` — Esc tugmasi ostidagi belgi) ni birga bosing, yoki menyudan Terminal → New Terminal.
  • U joriy ochilgan papkada ochiladi — ya'ni cd qilish shart emas, darrov npm install yozasiz.
  • Bir vaqtda bir nechta terminal ochib (masalan, biri serverni ishlatadi, ikkinchisi buyruq yozadi), ular orasida almashasiz.

Shu sabab amaliyot oddiy: code . bilan papkani ochasiz, so'ng terminalni ochib, kod va buyruqni bitta oynada boshqarasiz.

Professional dasturchi sirlari: .vscode/settings.json va .editorconfig

Har bir tajribali dasturchi o'z loyihasiga ikkita kichik konfiguratsiya fayli qo'shadi — bu kod yozishni zavqqa aylantiradi va jamoada tartib saqlaydi:

  1. .vscode/settings.json — faylni saqlagan zahoti kodni avtomatik tekislash (Prettier) va tartibga solish:
json
{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.codeActionsOnSave": {
    "source.organizeImports": "always"
  },
  "editor.tabSize": 2,
  "files.trimTrailingWhitespace": true
}

Foydasi: Ctrl+S ni bosishingiz bilan xunuk, qiyshiq kodlar bir zumda ideal tekislanadi, keraksiz bo'shliqlar tozalanadi va importlar chiroyli saralanadi.

  1. .editorconfig — har xil OS (Windows, Mac, Linux) ishlatuvchi jamoalarda qator oxirlari (CRLF vs LF) va tab/space buzilishining oldini oluvchi global standart:
ini
root = true

[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

4.3. Birinchi loyiha (qadamma-qadam)

bash
# 1. Papka yaratamiz va kiramiz (0.3: terminal)
mkdir birinchi-loyiha
cd birinchi-loyiha

# 2. package.json yaratamiz (2.4)
npm init -y

# 3. VS Code'da ochamiz
code .

VS Code'da index.js fayli yarating va ichiga yozing:

js
// index.js — birinchi Node dasturim
console.log("Salom, Node dunyosi!"); // terminalga matn chiqaradi (0.3: stdout)

// Node API'sini sinaymiz (0.2: os moduli)
const os = require("os");
console.log(`Tizim: ${os.platform()}, CPU yadrolari: ${os.cpus().length}`);

Terminalda ishga tushiring:

bash
node index.js
# Salom, Node dunyosi!
# Tizim: win32, CPU yadrolari: 8

4.4. Kutubxona o'rnatib ko'rish

bash
# Mashhur kutubxona — chalk (terminalga rangli matn) — o'rnatamiz
npm install chalk

# Endi node_modules/ va package.json o'zgarganini ko'r:
#  - package.json'da "dependencies": { "chalk": "^5.x.x" } paydo bo'ldi (2.4)
#  - node_modules/ papkasi yaratildi (2.7)
#  - package-lock.json yaratildi (2.7)

package.jsonda script qo'shamiz 2.5-bob:

json
{
  "scripts": {
    "start": "node index.js"
  }
}
bash
npm start    # endi "node index.js" o'rniga shu — qulayroq

4.5. .gitignore yaratish (0.2, 4.5 ga ko'prik)

bash
# .gitignore fayl yaratamiz (0.3: terminal)
# Ichiga yozamiz (node_modules'ni git'ga qo'shmaslik — 2.7)
text
node_modules/
.env
*.log

5. To'g'ri va noto'g'ri holatlar

1) node_modulesni git'ga qo'shish

text
❌ node_modules/ ni commit qilish (minglab fayl, juda katta — 2.7)
✅ .gitignore'ga node_modules/ qo'shish; package.json + lock yetadi

Nega: node_modules npm install bilan istalgan vaqt qayta tiklanadi. Uni saqlash — ombor (repo) ni keraksiz shishiradi.

2) Hamma narsani global (-g) o'rnatish

bash
# ❌ loyiha kutubxonasini global o'rnatish
npm install -g express   # noto'g'ri — loyihaga bog'liq emas, versiya chalkashligi

# ✅ loyiha kutubxonasi — lokal (loyiha ichida)
npm install express
# Global faqat CLI asboblari uchun (masalan: npm install -g nodemon)

3) package-lock.jsonni o'chirish/e'tiborsiz qoldirish

text
❌ package-lock.json'ni git'ga qo'shmaslik yoki o'chirish
✅ Uni commit qilish — hamma bir xil versiya oladi (2.7)

4) Node'ni sudo bilan global o'rnatish (Linux/macOS)

text
❌ sudo npm install -g ... → keyinroq ruxsat tartibsizligi (0.2: EACCES)
✅ Versiya menejeri (nvm/fnm) ishlating — sudo'siz, toza (2.8)

6. Keng tarqalgan xatolar va yechimlari

Xato 1 — 'node' is not recognized / command not found

Sababi: Node o'rnatilmagan yoki PATH'da yo'q (0.3-bob, 2.4). Yechimi: Node'ni qayta o'rnating (installer PATH'ni sozlaydi); terminalni qayta oching (PATH yangilanishi uchun); node --version bilan tekshiring.

Xato 2 — Cannot find module 'express'

text
Error: Cannot find module 'express'

Sababi: kutubxona o'rnatilmagan (node_modulesda yo'q — 2.7) yoki nom xato. Yechimi: npm install (barchasini tiklash) yoki npm install express (aynan o'shani); import nomi to'g'riligini tekshiring.

Xato 3 — EACCES: permission denied (global o'rnatishda)

Sababi: global papkaga yozish ruxsati yo'q (0.2: ruxsatlar). Yechimi: sudo o'rniga — nvm/fnm ishlating 2.8-bob; yoki lokal o'rnating.

Xato 4 — npm ERR! code ENOENT ... package.json

text
npm ERR! enoent ENOENT: no such file or directory, open '.../package.json'

Sababi: package.json yo'q papkada npm install ishlatdingiz (0.2: ENOENT). Yechimi: avval npm init -y, yoki to'g'ri papkaga cd qiling (pwd bilan tekshiring — 0.3).

Xato 5 — npm WARN ... deprecated yoki versiya nomuvofiqligi

Sababi: eski paket yoki Node versiyasi mos emas. Yechimi: ko'pincha ogohlantirish (warning) — ishlashga xalaqit bermaydi; jiddiy bo'lsa, paketni yangilang yoki Node LTS versiyasiga o'ting 2.8-bob.


7. Integratsiya — bu mavzu stack'ning qayerida uchraydi

Bu asboblar butun qolgan kitobda har kuni ishlatiladi:

  • Har bir loyiha: npm init, npm install, npm run dev — 1-QISMdan 16-QISMgacha.
  • Git 4.5-bob: .gitignoreda node_modules — shu bobda boshladik.
  • Node core, scripts (5.2, 5.3): package.json, semver, scripts — 5.2-bobda chuqur.
  • Express, NestJS, React, Next (5, 8, 11, 13): har biri npm paket sifatida o'rnatiladi.
  • Linting/formatting 15.3-bob: ESLint, Prettier — VS Code kengaytmalari + devDependencies.
  • Build asboblari (Vite, 11.3): npm scripts orqali ishlaydi.
  • CI/CD 10.5-bob: server'da ham npm install va npm run build — bir xil jarayon.
  • TypeScript 7.1-bob: npm install -D typescript, tsconfig — shu poydevorga quriladi.

8. Eng yaxshi amaliyotlar (best practices)

  • Node LTS versiyasini ishlating. Barqarorlik production uchun muhim 4.1-bob.
  • Versiya menejeri (nvm/fnm) o'rnating. Loyihalar orasida Node versiyasini oson almashtirasiz 2.8-bob.
  • node_modulesni doim .gitignorega qo'shing; package-lock.jsonni commit qiling 2.7-bob.
  • Loyiha kutubxonalarini lokal, CLI asboblarini global o'rnating (5-bo'lim).
  • VS Code'ni kengaytmalar bilan sozlang (ESLint, Prettier, GitLens — 4.2).
  • npm run bilan ishlang. Murakkab buyruqlarni scriptsda nomlang 2.5-bob.
  • code . ni o'rganing. Terminaldan papkani darrov VS Code'da ochasiz.
  • Yangi loyihada birinchi 3 qadam: npm init -y → .gitignore → git init (4-QISM). Buni odat qiling.

9. Amaliy loyiha: "Professional Ish Muhitini Qurish"

0-QISMni yakunlovchi loyiha: o'zingizga to'liq, professional dasturchi ish muhitini qurasiz va birinchi "haqiqiy" kichik dasturni ishga tushirasiz.

Maqsad

VS Code + Node + npm muhitini to'g'ri sozlab, paket o'rnatish, scripts yozish va .gitignore bilan ishlashni amalda mustahkamlash.

Talablar (requirements)

  1. Muhitni tekshiring: node --version va npm --version natijasini yozing. LTS ekaniga ishonch hosil qiling.
  2. VS Code'ni sozlang: 4.2-dagi kamida 4 ta kengaytmani o'rnating (ESLint, Prettier, GitLens, Error Lens).
  3. Loyiha yarating: salom-cli papkasini yarating, ichiga kiring, npm init -y, code ..
  4. Paket o'rnating: chalk (rangli matn) yoki figlet (ASCII katta harflar) ni o'rnating.
  5. Dastur yozing: index.jsda — foydalanuvchini ismi bilan rangli/chiroyli salomlaydigan kichik dastur. (Ismni process.argv dan oling — 0.3: terminal argumentlari.)
  6. Scripts qo'shing: package.jsonga start (dasturni ishga tushiradi) va greet (boshqacha salomlaydi) scriptlarini qo'shing 2.5-bob.
  7. .gitignore yarating: node_modules, .env ni qo'shing 2.7-bob.
  8. Hujjatlang: README.md yozing — loyiha nima qilishi va qanday ishga tushirish (npm install → npm start).
  9. (Bonus) npm install -D bilan biror dev-asbob o'rnatib, dependencies va devDependencies farqini package.jsonda ko'rsating.

Maslahatlar (hint)

  • Terminal argumenti: process.argv[2] — node index.js Ali da "Ali" (0.3, 0.4: misol 4 g'oyasi).
  • chalk: import chalk from "chalk" (ESM — package.jsonda "type": "module" qo'ying); console.log(chalk.green("matn")).
  • Argument berilmasa, standart ism ishlating ("Mehmon") — chegaraviy holat (0.6: edge case).
  • npm install dan keyin node_modules, package.json, package-lock.json qanday o'zgarganini ko'zat 2.7-bob.
  • README'da kod bloklarini markdown bilan yozing (bu kitob ham markdownda — 0.7 footer).

"Tayyor" mezonlari (acceptance criteria)

  • node/npm versiyalari yozilgan, LTS tasdiqlangan.
  • Kamida 4 ta VS Code kengaytmasi o'rnatilgan.
  • npm start dasturni ishga tushiradi va rangli/chiroyli salom chiqaradi.
  • Ism argument sifatida berilsa ishlaydi; berilmasa standart ism (edge case).
  • package.jsonda kamida 2 ta script bor va ishlaydi.
  • .gitignoreda node_modules bor.
  • README.md loyihani va ishga tushirish qadamlarini tushuntiradi.
  • (Bonus) devDependencies va dependencies farqi ko'rsatilgan.

Yechim kodi ataylab berilmagan — bu loyihani o'zingiz yozib ko'ring.


10. Xulosa — 0-QISM yakunlandi!

Bu bobda professional ish muhitini qurdik:

  • VS Code — kod muharriri, kengaytmalar bilan deyarli IDE; code . bilan ochiladi.
  • Node.js — V8'ni brauzerdan chiqargan runtime; JS endi fayl, server, OS bilan ishlaydi → full-stack mumkin.
  • npm — paket menejeri (CLI) + registry (ombor); npm install bilan tayyor kutubxonani olasiz.
  • package.json — loyiha pasporti (nom, versiya, dependencies, scripts). scripts — buyruqni nomlash. semver (^, ~) — versiya boshqaruvi.
  • node_modules — git'ga qo'ymaymiz (.gitignore); package-lock.json — qo'shamiz.

0-QISM (TAYYORGARLIK) — to'liq yakunlandi!

Siz endi quyidagilarni bilasiz:

  • 0.1 Kompyuter qanday ishlaydi (temir, binary, xotira)
  • 0.2 Operatsion tizimlar va fayl tizimi
  • 0.3 Terminal / buyruq qatori (bash)
  • 0.4 Internet va web (HTTP, DNS)
  • 0.5 Brauzer (rendering, JS engine)
  • 0.6 Algoritmik fikrlash va pseudokod
  • 0.7 Dasturchi asboblari (VS Code, Node, npm)

Bu — pullik bootcamplar o'tkazib yuboradigan, lekin senior dasturchini o'rtachasidan ajratadigan poydevor. Endi siz "sehr"ni emas, mexanizmni tushunasiz.

Keyingi bob — 1.1-bob: HTML — tuzilma, semantik teglar, formalar, jadval, media. Nazariya tugadi — endi haqiqiy kod yozishni boshlaymiz! Birinchi to'xtash — veb sahifaning skeleti: HTML. 0.5-bobda ko'rgan DOM — aynan HTML'dan quriladi; endi uni o'z qo'limiz bilan yozamiz.


Foydalanilgan rasmiy/ishonchli manbalar

  • nodejs.org — Node.js, npm kirish qo'llanmasi (LTS, runtime)
  • docs.npmjs.com — package.json, npm install, dependencies vs devDependencies
  • code.visualstudio.com — VS Code o'rnatish va kengaytmalar
  • semver.org — semantik versiyalash (MAJOR.MINOR.PATCH)
Ulashish:Telegram'da

O'qiganingizni mustahkamlang

Izohlar (0)

Izoh yozish uchun kiring.

  • Hozircha izoh yo'q. Birinchi bo'ling!
VS Code, Node.js va npm o'rnatish — dasturchi asboblari (0.7-bob) — IlmHamroh