Redux Boilerplate Generator
Bu VS Code eklentisi, tek bir komutla Redux ve React bileşen dosyalarını otomatik olarak oluşturur.
Özellikler
Bu eklenti aşağıdaki dosyaları otomatik olarak oluşturur:
- Redux Store, Slice ve Actions
- React Bileşenleri (Products, Admin, DetailProduct)
- Modal ve Form bileşenleri
- Gerekli CSS ve modül dosyaları
Kurulum
Geliştirici Modunda Çalıştırma
- Bu depoyu bilgisayarınıza klonlayın veya dosyaları indirin.
- Komut satırında aşağıdaki komutları çalıştırın:
cd redux-boilerplate-generator
npm install
code .
- VS Code açıldığında, F5 tuşuna basın veya "Run Extension" komutunu çalıştırın.
- Yeni açılan VS Code penceresinde bir klasör açın.
- Komut paletini açın (Ctrl+Shift+P veya Cmd+Shift+P) ve "Generate Redux Boilerplate" komutunu çalıştırın.
VSIX Paketi Olarak Kurulum
- Bu depoyu bilgisayarınıza klonlayın veya dosyaları indirin.
- Komut satırında aşağıdaki komutları çalıştırın:
cd redux-boilerplate-generator
npm install
npm run vscode:prepublish
npx vsce package
- Oluşturulan .vsix dosyasını VS Code'da şu yolla kurun:
- Extensions sekmesini açın
- "..." düğmesine tıklayın
- "Install from VSIX..." seçeneğini seçin
- Oluşturulan .vsix dosyasını seçin
Kullanım
- VS Code'da bir klasör açın (projenizin kökü).
- Komut paletini açın (Ctrl+Shift+P veya Cmd+Shift+P).
- "Generate Redux Boilerplate" komutunu çalıştırın.
- Dosyalar otomatik olarak oluşturulacaktır.
Oluşturulan Dosya Yapısı
├── redux/
│ ├── store.js
│ ├── productSlice.js
│ └── basketSlicer.js
├── components/
│ ├── modal/
│ │ ├── Modal.js
│ │ └── Modal.module.css
│ ├── Products/
│ │ └── Products.module.css
│ └── AddProduct/
│ ├── AddProduct.js
│ └── AddProduct.module.css
└── pages/
├── Products.js
├── Admin.js
├── DetailProduct.js
└── detailproduct.module.css
Gereksinimler
Bu eklentinin çalışabilmesi için projenizde aşağıdaki kütüphanelerin kurulu olması gerekir:
- react
- react-redux
- @reduxjs/toolkit
- axios
- react-router-dom
- formik
- yup
- react-bootstrap
- bootstrap
Lisans
MIT
| |
