AI әзірлеу құралдары

AstroGlass AI негізіндегі әзірлеу жұмыс процестерін қолдауды қамтиды. Claude Code, Cursor, GitHub Copilot немесе кез келген басқа AI кодтау көмекшісін пайдалансаңыз да, жоба агенттерге архитектураны терең түсінуге мүмкіндік беретін конфигурация файлдарын қамтиды.

Не кіреді

.claude/
  commands/
    prune-themes.md      # Қажетсіз тақырыптарды хирургиялық жою
    add-locale.md        # Жаңа тіл құру
    switch-provider.md   # Орналастыру провайдерін ауыстыру
    mix-theme.md         # Бөлімдерден гибридті тақырып құру
    deploy.md            # Құрастыру және орналастыру
CLAUDE.md                # AI үшін жоба интеллектуалдық файлы

CLAUDE.md — Жоба интеллектуалдық файлы

Жоба түбіріндегі CLAUDE.md файлы AI агенттер үшін білім базасы болып қызмет етеді. Ол мыналарды қамтиды:

Архитектура шолуы — Тақырып жүйесі, компонент құрылымы, маршруттау
Негізгі конфигурация файлдарының орны — Тақырыптар, тілдер, палитралар, провайдерлерді қайдан табу
Жиі қолданылатын рецепттер — Жиі операциялар үшін қадамдық нұсқаулар
Файл құрылымы картасы — Аннотациялармен толық каталог ағашы
Маңызды ескертпелер — «Zod емес, Valibot пайдаланылады» сияқты ерекшеліктер

CLAUDE.md оқыған кез келген AI агент жобаның ұйымдастырылу тәсілін бірден түсініп, қауіпсіз өзгерістер енгізе алады.

💡

Барлық жерде жұмыс істейді

CLAUDE.md Claude Code арқылы тікелей танылады, бірақ Markdown пішімі оны кез келген AI құралы үшін пайдалы етеді. Cursor, Windsurf және Copilot та репозиторий түбірінде бұл файлдың болуынан пайда көреді.

Слэш-командалар

.claude/commands/ каталогы Claude Code-та слэш-командалар ретінде жұмыс істейтін промпт үлгілерін қамтиды. Әр команда AI-ды көп қадамды операция арқылы бағыттайды.

/prune-themes — Қажетсіз тақырыптарды жою

Ең қуатты команда. Ол themeRegistry.ts манифестін пайдаланып, қажетсіз тақырыптарға тиесілі барлық файлдарды хирургиялық дәлдікпен жояды.

Мысал: «Маған тек Liquid тақырыбы керек» → команда қалған 5 тақырып үшін ~200 файлды жояды, барлық конфигурация файлдарын жаңартады және құрастырудың сәтті өтетінін тексереді.

Әр тақырып үшін жойылатындар:

Бөлім компоненттері (.astro файлдары)
Компонент CSS файлдары
Тақырып пен төменгі бөлім нұсқалары
Тақырыпқа тән UI примитивтері
Скрипттер мен дизайн токендері
Barrel файлы және конфигурация жазбалары

ℹ️

Дизайн бойынша қауіпсіз

Команда src/config/themeRegistry.ts файлын жалғыз ақиқат көзі ретінде пайдаланады. Бұл файлда әр тақырыптың нақты файл манифесті бар, сондықтан ештеңе жіберілмейді және ортақ ресурстар жойылмайды.

/add-locale — Жаңа тіл қосу

Жаңа тілге қажет барлығын жасайды:

src/config/locales.ts ішінде тіл жазбасын құрады
Барлық аударма JSON файлдарын ағылшын тілінен жаңа тіл каталогына көшіреді
Барлық жолдық мәндерді аударады
Аударылған мазмұнмен блог және құжаттама каталогтарын құрады
src/utils/docs-nav.ts ішіне бүйір тақтасы навигация белгілерін қосады

/mix-theme — Гибридті тақырып құру

Өзіңіздің комбинацияңызды жасау үшін әр түрлі тақырыптардан бөлімдерді таңдаңыз:

Hero        → Liquid    (ағынды анимациялар)
About       → Glass     (шыны морфизм карточкалар)
Features    → Aurora    (градиент тор фондары)
Pricing     → Neo       (батыл, энергиялық стиль)
Testimonial → Minimal   (таза, фокусталған дизайн)

Команда пайдаланушы barrel файлын жасайды, тақырыпты тіркейді және тек қажетті CSS файлдарын қосады.

/switch-provider — Орналастыру провайдерін ауыстыру

Бір командамен Cloudflare Pages, Vercel және Netlify арасында ауысу:

Дұрыс Astro адаптерін орнату
Белсенді провайдер конфигурациясын жаңарту
Құрастыру скрипттерін реттеу
Құрастырудың сәттілігін тексеру

/deploy — Құрастыру және орналастыру

Орналастыру алдындағы толық конвейерді іске қосады:

TypeScript диагностикасы (pnpm check)
Линтинг (pnpm lint)
Пішімдеуді тексеру (pnpm format:check)
Өндірістік құрастыру (pnpm build)
Белсенді провайдерге орналастыру

Қалай жұмыс істейді

Тақырып тізілімі — Қауіпсіз операциялардың кілті

src/config/themeRegistry.ts файлы AI тақырып операцияларын қауіпсіз етеді. Ол әр тақырыпқа тиесілі барлық файлдардың толық манифестін қамтиды:

export const themeRegistry: Record<string, ThemeManifest> = {
  liquid: {
    barrel: 'src/components/sections/themes/liquid.ts',
    sections: [
      'src/components/sections/hero/HeroLiquid.astro',
      'src/components/sections/about/AboutLiquid.astro',
      // ... барлық бөлім компоненттері
    ],
    css: [...],
    header: [...],
    footer: [...],
    ui: [...],
    scripts: [],
    tokens: ['src/styles/tokens/liquid.css'],
    npmDeps: [],
  },
};

Конфигурация негізіндегі архитектура

Конфигурация	Басқарады
`themes.ts`	Қандай тақырыптар бар және қосылған
`themePresets.ts`	Әр тақырып лендинг бетіндегі бөлім тәртібі
`locales.ts`	Қандай тілдер белсенді
`palettes.ts`	Қол жетімді түс палитралары
`active-provider.ts`	Орналастыру мақсаты

AI агенттерімен жұмыс істеу кеңестері

CLAUDE.md-дан бастаңыз — Контекст алу үшін агентке оны бірінші оқытыңыз
Күрделі операциялар үшін слэш-командаларды пайдаланыңыз — Олар көп қадамды процедураларды дұрыс кодтайды
Тақырып тізіліміне сеніңіз — Ол тақырып файлдарының тиесілігінің беделді көзі
Өзгерістерден кейін pnpm check іске қосыңыз — TypeScript қателері мен жетіспейтін импорттарды анықтайды
Zod емес, Valibot — Егер агент валидация үшін Zod ұсынса, оны Valibot-қа бағыттаңыз