Claude Code orqali Astro sayti: papkadan e’lon qilishgacha

Biror marta ham kod yozmagan odam Claude Code orqali Astro’da sayt yaratishi mumkin. Men qo‘lda kod yozishni ancha oldin to‘xtatganman; hammasini AI yordamida so‘zlar bilan qilaman va Astro’da sayt yaratish ham xuddi shunday ishlaydi: sizga nima kerakligini tushuntirasiz, Claude esa kodni siz uchun yozadi.

Muammo odatda sayt yaratishning o‘zida emas, balki yo‘lning bo‘laklarga bo‘linganida. Bir maqolada o‘rnatish tushuntiriladi, boshqasida buyruqlar, uchinchisida e’lon qilish yoritiladi, ammo to‘liq yo‘l xayolda yaxlit ko‘rinishga kelmaydi. Bu yerda men sizni bo‘sh papkadan internetda havola orqali ochiladigan saytga olib boraman: nimalarni o‘rnatish, loyihani boshlash uchun qaysi buyruqdan foydalanish, Claude Code orqali sahifalarni qanday yaratish va natijani qanday qilib bepul e’lon qilish. Men Astro’ning rasmiy hujjatlariga tayanaman.

Xizmat bilan ishlash haqida — Ailoot hujjatlarida.

Boshlashdan oldin nimalar kerak?#

Astro’ning o‘zi oldindan hech narsa yuklab olishingizni talab qilmaydi — u keyingi bosqichdagi buyruq orqali yuklab olinadi. Ammo hammasi ishlaydigan muhit kerak. Astro boshlash jarayonini shunday ta’riflaydi — sizga uchta narsa kerak:

Keling, bularning har biri amalda nimani anglatishini ko‘rib chiqamiz:

1. Node.js — bu dastur bo‘lmasa, Astro ham, vibe-coding vositalarining aksariyati ham ishlamaydi. Uni nodejs.org saytidan yuklab oling va oddiy ilova kabi o‘rnating. Hujjatlardagi versiya raqami vaqt o‘tishi bilan yangilanadi, shuning uchun boshlashdan oldin Astro’ning o‘rnatish sahifasiga kirib, talabni tekshiring. Juft raqamli versiya (22, 24) kerak; toq raqamli versiyadan (23, 25) qochgan ma’qul.
2. VS Code — Microsoft’ning bepul muharriri. Unda loyiha papkasini ochasiz, Claude Code ham shu yerda ishlaydi va kodni yozadi.
3. Terminal — buyruqlar kiritiladigan oyna. Uni alohida o‘rnatishingiz shart emas: u VS Code menyusidan ochiladi, quyidagi barcha buyruqlarni shu yerda kiritasiz.

Agar Claude Code’ni allaqachon o‘rnatib, biror narsa yaratgan bo‘lsangiz, bularning hammasi sizda bor va bu bosqichni o‘tkazib yuborishingiz mumkin. Bo‘lmasa, Claude Code’ni qanday o‘rnatish haqida alohida qo‘llanmam bor.

Astro loyihasini bitta buyruq bilan qanday yaratasiz?#

Loyihaning o‘zi shu yerdan boshlanadi va buning uchun atigi bitta buyruq kerak. Terminalni ochib, quyidagini kiriting:

npm create astro@latest

O‘rnatish yordamchisi ishga tushadi. Hujjatlarda u haqida shunday deyilgan:

Yordamchi dastur bosqichlardan o‘tishga yo‘l ko‘rsatadi va bir nechta savol beradi: loyiha papkasiga qanday nom berish, qaysi shablondan boshlash va bog‘liqliklarni darhol o‘rnatish kerakmi. Har bir savol uchun standart variantni tanlashingiz mumkin — birinchi saytingiz uchun bo‘sh yoki minimal shablon yetarli. Bog‘liqliklarni o‘rnatish haqidagi savolga “yo‘q” deb javob bergan bo‘lsangiz, keyinroq loyiha papkasi ichida npm install buyrug‘ini bajarib, ularni qo‘lda o‘rnating.

Yordamchi dastur ishini tugatgach, loyiha yaratilganini ko‘rsatadi va keyingi qadamni — loyiha papkasiga o‘tishni tavsiya qiladi:

cd your-project-name

Loyihani yaratish uchun shu kifoya. Uning ichida saytning tayyor asosiy tuzilmasi bor: sahifani yaratishda foydalaniladigan bir nechta fayl va papka. Ularni qo‘lda tahrirlashingiz shart emas, ammo nimalar qayerda ekanini bilib qo‘yish foydali. Astro faqat bitta papkani majburiy deb hisoblaydi:

Boshqacha aytganda, src/pages — sayt sahifalari joylashadigan papka: bosh sahifa, “biz haqimizda” sahifasi va aloqa sahifalari. src/components (sarlavha va tugmalar kabi qayta ishlatiladigan qismlar), src/layouts (sahifalar uchun umumiy tuzilma) hamda tasvir va fayllar saqlanadigan public papkasi odatda yaqin joylashadi. Tuzilmani yodlab olishingiz shart emas — sahifalar src/pages ichida joylashishini eslab qoling va Claude’dan “aloqa sahifasini qo‘sh” deb so‘raganda shu papkani nazarda tuting.

Claude Code orqali saytning o‘zini qanday yaratasiz?#

Asosiy tuzilma tayyor; endi uning asosida saytingiz yaratiladi va ishni Claude Code davom ettiradi. VS Code’da loyiha papkasini oching, Claude Code’ni ishga tushiring va nimalar kerakligini so‘z bilan tasvirlang. U src/pages va yaqin papkalardagi fayllarni o‘zi tahrirlaydi — siz unga vazifalar berasiz va natijani ko‘rasiz.

Tajribamga ko‘ra, kichik bosqichlarda ishlash eng yaxshi natija beradi. “Menga kompaniya sayti yarat” kabi bitta ulkan so‘rov oxirida tuzatish qiyin bo‘lgan chalkashlikka olib keladi. Shuning uchun uni qisqa va aniq vazifalarga bo‘lib, bittadan bering:

1. “Bosh sahifa yarat: katta sarlavha, nima bilan shug‘ullanishim haqida bir-ikki jumla va aloqa sahifasiga olib boradigan tugma bo‘lsin.”
2. “Uchta bo‘lim ro‘yxati bor xizmatlar sahifasini qo‘sh.”
3. “Telefon raqami va Telegram havolasi bo‘lgan aloqa sahifasini qo‘sh.”
4. “Dizaynni o‘zgartir: och rangli fon va katta, o‘qilishi oson shrift bo‘lsin.”

Keyingi bosqichga o‘tishdan oldin har bir qadamni tekshiring — bu xato qachon chiqqanini aniqlash va ortga qaytishni osonlashtiradi. Kichik vazifalar nima uchun ishonchliroq va AIni qanday yo‘naltirish haqida kontekst muhandisligi mavzusida so‘z boradi: vazifa va loyiha tuzilmasi qanchalik aniq bo‘lsa, natija shunchalik oldindan taxmin qilinadigan bo‘ladi.

Astro buning uchun AIdan foydalanishga qulay tuzilma beradi: sahifa mazmuni dizayndan ajratilgan, sahifalar esa umumiy qoidalarga muvofiq yaratiladi. Shu tuzilma tufayli Claude kamroq chalkashadi va bir joyni tahrir qilayotganda yonidagi narsalarni buzib qo‘yish ehtimoli kamayadi. Agar Claude to‘satdan fayllaringizni ko‘rmay qolsa yoki mavzuga aloqasiz javob bersa, Claude Code nima uchun loyiha fayllarini ko‘ra olmasligi haqidagi qo‘llanmani ko‘ring.

Astro — AI bilan ishlashdagi qurilish qismlaridan biri, xolos. Claude’ga ishonarli tuyuladigan taxminlarga qaytmasdan kerakli narsani izchil yaratishda yordam berish uchun loyihangizning to‘liq sozlamasi quyidagilarni o‘z ichiga oladi: AI klon + Second Brain + kontekst muhandisligi.

Saytni e’lon qilishdan oldin qanday ko‘rib chiqish mumkin?#

Saytni hammaga ko‘rsatishdan oldin uni o‘z kompyuteringizda ko‘rib chiqasiz. Buning uchun Astro’da ishlab chiqish serveri bor — u saytni kompyuteringizda jonli ko‘rsatadi. Uni loyiha papkasi ichida, terminalda quyidagi buyruq bilan ishga tushiring:

npm run dev

Astro mahalliy ko‘rib chiqish sahifasini ishga tushiradi va manzilni terminalda ko‘rsatadi. Standart manzil — localhost:4321. Manzilni nusxalab, brauzeringizda oching, shunda saytingizni ko‘rasiz. Hozircha bu manzilni faqat siz ocha olasiz — tashqaridagilar kira olmaydi; bu sizning qoralamangiz.

Qulay tomoni shundaki, ko‘rib chiqish jarayoni jonli: Claude faylni tahrirlaydi, brauzerdagi sahifa o‘zi yangilanadi, qo‘lda qayta yuklash shart emas. Bu tez ishlash imkonini beradi — Claude’dan so‘rang, brauzerda ko‘ring, tuzatish kiriting, yana ko‘ring; saytni sayqallash bosqichi shu. Natijadan mamnun bo‘lsangiz, uni internetda e’lon qiling.

Astro saytini qanday qilib bepul internetga joylash mumkin?#

Tayyor saytni boshqa odamlar havola orqali ochishi uchun uni biror joyga joylashingiz kerak. Eng oson bepul yo‘l GitHub orqali: avval loyiha kodini repozitoriyga yuklang, keyin saytni yig‘ib e’lon qiladigan hosting xizmatini ulang. Tartib quyidagicha:

1. GitHub’da repozitoriy yarating. Repozitoriy — loyiha fayllarini yuboradigan onlayn kod ombori. Claude Code bunga tabiiy tildagi ko‘rsatmalar orqali yordam beradi: undan “loyihani yangi GitHub repozitoriysiga yukla” deb so‘rang, u buyruqlarni taklif qiladi. GitHub’dan oldin foydalanmagan bo‘lsangiz, ro‘yxatdan o‘tish va tizimga kirish bo‘yicha ko‘rsatmalarni yoningizda saqlang.
2. Hosting xizmatini ulang. Xizmatlardan biriga (Netlify, Vercel) kiring, GitHub hisobingiz orqali tizimga kiring va repozitoriyni tanlang. Astro hujjatlarida bu usul shunday tasvirlanadi: hosting xizmati repozitoriyni kuzatib boradi, saytni yig‘adi va e’lon qiladi.
3. Yig‘ish sozlamalarini tekshiring. Odatda hosting xizmati Astro’ni taniydi va kerakli qiymatlarni o‘zi to‘ldiradi. Agar ularni qo‘lda kiritish so‘ralsa, hujjatlardagi yig‘ish buyrug‘i astro build (yoki npm run build), tayyor sayt esa dist papkasiga joylanadi.
4. “E’lon qilish” tugmasini bosing. Xizmat saytni yig‘ib, site-name.netlify.app kabi havolani beradi. Istalgan odam saytni shu manzilda ochishi mumkin.

Repozitoriyni hosting xizmatiga ulash haqida hujjatlarda aynan shunday yozilgan:

Shundan keyin e’lon qilish avtomatik bo‘ladi: repozitoriyga yangi o‘zgarish yuboring, sayt o‘zi qayta yig‘ilib yangilanadi; boshqa hech narsani bosish shart emas.

Yana bir bepul variant bor — GitHub Pages. Unda sayt GitHub’ning o‘z vositalari yordamida to‘g‘ridan-to‘g‘ri repozitoriydan e’lon qilinadi. Astro’da buning uchun rasmiy boshlang‘ich shablon mavjud:

Bu variantda sayt your-name.github.io/repository-name kabi manzilda ochiladi, keyinroq unga o‘z domeningizni ulashingiz mumkin. Bu yerda ham sozlashni Claude Code orqali bajarsa bo‘ladi: vazifani so‘z bilan tasvirlang, u kerakli faylni tayyorlaydi.

Astro saytini yaratish qancha turadi?#

Endi pul haqida gaplashamiz. Astro — bepul, ochiq kodli vosita; uning uchun alohida to‘lov yo‘q. Asosiy hosting xizmatlari ham bepul variantlarni taklif qiladi: GitHub Pages, shuningdek Netlify va Vercel’ning boshlang‘ich tariflari odatda yengil Astro sayti uchun yetarli (bepul tariflarda trafik cheklovlari bor, ammo ular odatda oddiy vizitka sayti yoki landing page uchun yetadi).

Amalda, ehtimol, ikki narsaga pul to‘lashingiz mumkin, lekin bu ham har doim emas. Birinchisi — sayt yaratishda foydalanadigan AI vositasi. Ikkinchisi — name.netlify.app kabi manzil o‘rniga oladigan o‘z domeningiz; bu ixtiyoriy va yiliga uncha qimmat emas. “Sayt yaratish va internetda e’lon qilish” yo‘lini faqat Claude uchun to‘lab yakunlashingiz mumkin.

Astro saytlari va Claude Code haqida yana nimalarni so‘rashadi?#

Vibe-coding uchun to‘liq sozlama: AI klon + Second Brain + kontekst muhandisligi.

Ailoot bilan tanishing.