Skip to content

Latest commit

 

History

History
218 lines (163 loc) · 7.76 KB

File metadata and controls

218 lines (163 loc) · 7.76 KB
 W E B F O R G E

webforge-cli

Tayyor veb-loyihalarni soniyalarda yaratish uchun interaktiv CLI

npm version license node downloads website

English | Русский | O'zbek


Shablon, freymvork, stilizatsiya, holat boshqaruvi, paradigma, routing, i18n va mavzuni tanlang — layoutlar, mavzu almashtirish, til almashtirish va real demo-kontent bilan to'liq sozlangan ko'p sahifali SPA oling.


Tez boshlash

npx @beknurakhmed/webforge-cli

Yoki global o'rnating:

npm i -g @beknurakhmed/webforge-cli
webforge-cli my-app

Nima olasiz

┌  webforge-cli  — loyiha shablon generatori
│
◆  Loyiha nomi          →  my-app
◆  Shablon turi         →  E-commerce
◆  Freymvork            →  React
◆  Paradigma            →  Funksional
◆  Stilizatsiya         →  Tailwind CSS
◆  Holat boshqaruvi     →  Zustand
◆  Routing              →  Ha
◆  Xalqarolashtirish    →  Ha (EN / RU / UZ)
◆  Mavzu                →  Qorong'i
◆  Qo'shimcha vositalar →  TypeScript, ESLint, Prettier
│
◇  Loyiha muvaffaqiyatli yaratildi!
│
│  Keyingi qadamlar:
│    cd my-app
│    npm install
│    npm run dev
│
└  Omadli kodlash!

Shablonlar

Shablon Tavsif Sahifalar
Landing Page Marketing sahifasi: hero, xususiyatlar, CTA Bitta sahifa
E-commerce Mahsulot katalogi, savatcha, mahsulot kartasi Bosh sahifa, Mahsulot, Savatcha
CRM Kontaktlar, bitimlar, savdo voronkasi Dashboard, Kontaktlar, Bitimlar, Sozlamalar
Dashboard KPI kartalar, grafiklar, jadvallar Umumiy, Analitika, Foydalanuvchilar, Sozlamalar
Blog Maqolalar, kategoriyalar, muallif sahifalari Bosh sahifa, Maqola, Kategoriya, Haqida
Portfolio Loyihalar, ko'nikmalar, aloqa formasi Bosh sahifa, Loyihalar, Men haqimda, Aloqa

Freymvorklar

Freymvork Yig'uvchi Versiya Routing
React Vite React 19 react-router-dom v7
Vue Vite Vue 3.5 vue-router v4
Angular Angular CLI Angular 19 @angular/router
Vanilla Vite TypeScript Maxsus hash router
Next.js Next.js v15 App Router (fayl asosida)
Nuxt Nuxt v3 Fayl asosida routing

Stilizatsiya — 8 ta variant

Stilizatsiya Mos freymvorklar
Tailwind CSS React, Vue, Angular, Vanilla, Next.js, Nuxt
SCSS React, Vue, Angular, Vanilla, Next.js, Nuxt
CSS Modules React, Vue, Vanilla, Next.js, Nuxt
Styled Components React, Next.js
Material UI (MUI) React, Next.js
Chakra UI React, Next.js
Ant Design React, Vue, Next.js
Angular Material Angular

Har bir stilizatsiya varianti haqiqiy stilizatsiya qilingan komponentlar yaratadi — faqat dependency o'rnatish emas. Tailwind utility-klasslar ishlatadi, SCSS o'zgaruvchilar va joylashtirish, MUI sx propslar va h.k.

Holat boshqaruvi

Kutubxona Mos freymvorklar
Redux Toolkit React, Next.js
Zustand React, Next.js
MobX React, Next.js
Pinia Vue, Nuxt
RxJS Angular
NgRx Angular

Kodlash paradigmasi

  • Funksional — hooklar, composablelar, toza funksiyalar, signallar
  • SOLID OOP — klasslar, servislar, dependency injection, OOP patternlar

Routing

Barcha freymvorklar ixtiyoriy ko'p sahifali routing, layoutlar va navigatsiyani qo'llab-quvvatlaydi:

Freymvork Router Pattern
React react-router-dom v7 BrowserRouter + Layout bilan Outlet
Vue vue-router v4 createRouter + RouterView
Angular @angular/router provideRouter + router-outlet
Vanilla Maxsus hash router ~30 qator hash-router
Next.js App Router Fayl asosida routing (o'rnatilgan)
Nuxt Nuxt Router Fayl asosida routing (o'rnatilgan)

Xalqarolashtirish (i18n)

O'rnatilgan til almashtirgich EN / RU / UZ tarjimalari va localStorage'da saqlash bilan. Har bir freymvork idiomatik amalga oshirish oladi — React hook, Vue composable, Angular servis va h.k.

Mavzu

Standart mavzu sifatida Yorug' yoki Qorong'ini tanlang. Mavzu almashtirgich komponent va CSS o'zgaruvchilari bilan to'liq ishlaydi. Mavzu tanlovi localStorage'da saqlanadi.

Angular rejimi

Angular ishlatganda ikkita variant mavjud:

  • Standalone (standart) — zamonaviy standalone komponentlar
  • NgModules — an'anaviy modulli arxitektura

Arxitektura

webforge-cli qatlamli overlay tizimi ishlatadi:

Qatlam 1    Freymvork bazasi         (React / Vue / Angular / ...)
Qatlam 1.5  Angular rejimi           (Standalone / NgModules)
Qatlam 2    Shablon overlay          (Landing / E-commerce / CRM / ...)
Qatlam 3    Paradigma varianti       (Funksional / OOP)
Qatlam 4    Stilizatsiya konfiguratsiyasi (Tailwind / SCSS / MUI / ...)
Qatlam 5    Stilizatsiya komponentlari   (Tanlangan stil uchun komponentlar)
Qatlam 6    Holat boshqaruvi         (Redux / Zustand / Pinia / ...)
Qatlam 7    Routing                  (Freymvork uchun router + sahifalar)
Qatlam 8    Xalqarolashtirish        (i18n servis + til almashtirgich)
Qatlam 9    Mavzu                    (CSS o'zgaruvchilari + mavzu almashtirgich)
Qatlam 10   Qo'shimcha vositalar     (TypeScript / ESLint / Prettier)

Har bir qatlam oldingi qatlam ustiga fayllarni ko'chiradi. Dependency'lar package.jsonga avtomatik birlashtiriladi.

Jami kombinatsiyalar: 6 shablon x 6 freymvork x 8 stil x 7 holat x 2 paradigma x 2 routing x 2 i18n x 2 mavzu = 32 000+ noyob loyiha

Misollar

# React + E-commerce + Tailwind + Zustand + Routing + i18n + Qorong'i mavzu
npx @beknurakhmed/webforge-cli
# → my-store → E-commerce → React → Functional → Tailwind CSS → Zustand → Routing ✓ → i18n ✓ → Dark

# Vue + Dashboard + SCSS + Pinia
npx @beknurakhmed/webforge-cli
# → admin → Dashboard → Vue → Functional → SCSS → Pinia → Routing ✓ → i18n ✗ → Light

# Next.js + Blog + Ant Design + i18n
npx @beknurakhmed/webforge-cli
# → my-blog → Blog → Next.js → Functional → Ant Design → None → Routing ✓ → i18n ✓ → Light

# Angular + CRM + NgModules + Angular Material + NgRx
npx @beknurakhmed/webforge-cli
# → crm-app → CRM → Angular (NgModules) → SOLID OOP → Angular Material → NgRx → Routing ✓ → i18n ✗ → Dark

Talablar

  • Node.js >= 18.0.0

Ishlab chiqish

git clone https://github.com/beknurakhmed/webforge-cli.git
cd webforge-cli
npm install
npm run build
node dist/index.js
Skript Tavsif
npm run build tsup orqali yig'ish
npm run dev Kuzatish rejimi
npm start CLI ishga tushirish
npm run typecheck TypeScript tekshiruvi

Muallif

Beknur — Frontend dasturchi va Software Engineer

Litsenziya

MIT © 2026 Beknur