# UzorZen - Premium Python Web Generator

> **Zamonaviy HTML/CSS/JS/Bootstrap sahifalar generatori**  
> *Created by RaKUZEN | Yoqubov Javohir*

[![Python](https://img.shields.io/badge/Python-3.7%2B-blue.svg)](https://python.org)
[![License](https://img.shields.io/badge/License-MIT-green.svg)](LICENSE)
[![Bootstrap](https://img.shields.io/badge/Bootstrap-5.3.0-purple.svg)](https://getbootstrap.com) 
[![Responsive](https://img.shields.io/badge/Responsive-Mobile%20First-cyan.svg)](#)
[![Animations](https://img.shields.io/badge/Animations-AOS%2B--Blue.svg)](#)

## 🚀 Zamonaviy Loyiha Ta'rifi

**UzorZen** — bu Python asosida yaratilgan **zamonaviy** va **yuqori sifatli** HTML/CSS/JS/Bootstrap sahifalar generatori bo'lib, u sodda buyruqlar orqali chiroyli, adaptiv va professional web sahifalar yaratishni avtomatlashtiradi.

### ✨ Takomillashtirilgan Xususiyatlar

- 🎨 **Glassmorphism Design** - Shaffof va blur effektlari bilan zamonaviy dizayn
- 🌈 **Gradient Backgrounds** - Chiroyli gradient fonlar
- ⚡ **AOS Animations** - Professional scroll animatsiyalari
- 🎭 **Particles.js** - Zarrachalar effektlari
- 📱 **Mobile First** - Mobil qurilmalar uchun optimallashtirilgan
- 🎯 **SEO Optimized** - Qidiruv tizimlari uchun optimallashtirilgan
- 🔍 **Analytics Ready** - Google Analytics integratsiyasi
- 🌙 **Dark Theme** - Qora mavru qo'llab-quvvatlashi
- 📊 **Counter Animations** - Sonli statistikalar animatsiyasi
- 💬 **Testimonials** - Mijoz izohlari bo'limi
- 🎮 **Interactive Elements** - Interaktiv komponentlar
- 🎨 **Custom CSS/JS** - Qo'shimcha stillar va skriptlar

## 📦 O'rnatish

```bash
# Asosiy kutubxonalarni o'rnatish
pip install uzorzen
```

## 🎯 Tez Boshlash

### Oddiy Misol

```python
from uzorzen import Page

# Zamonaviy sahifa yaratish
page = Page("Mening Zamonaviy Sahifam", theme="modern")
page.navbar("UzorZen", links=["Bosh sahifa", "Portfolio", "Contact"])
page.hero("Zamonaviy Web Sahifa!", "UzorZen bilan professional natija oling")
page.add_card("Xususiyat", "Professional dizayn va animations")
page.save("modern_page.html")
```

### Premium Features

```python
# Particles va animations bilan
page.hero(
    "Professional Web Site", 
    "Glassmorphism va premium animations",
    particles=True,
    background_image="https://example.com/hero.jpg"
)

# Statistics bo'limi
page.counter_section([
    {"value": 1000, "label": "Tayyor Sahifalar", "icon": "bi-graph-up"},
    {"value": 50, "label": "Template'lar", "icon": "bi-collection"}
])

# Testimonials
page.testimonial_section([
    {
        "quote": "Ajoyib xizmat!",
        "author": "Alisher",
        "role": "Dasturchi"
    }
])
```

## 🧩 Zamonaviy Komponentlar

### Asosiy Komponentlar

| Komponent | Tavsif | Misol |
|-----------|--------|-------|
| `navbar(transparent=True)` | Shaffof navbar | `page.navbar("Brand", transparent=True)`
| `hero(particles=True)` | Particles bilan hero | `page.hero("Title", particles=True)`
| `add_card(type="modern")` | Zamonaviy kartochka | `page.add_card("Title", "Desc", type="modern")`
| `counter_section()` | Statistika animatsiyasi | `page.counter_section([{"value": 100}])`
| `testimonial_section()` | Mijoz izohlari | `page.testimonial_section([...])`
| `modal()` | Premium modal | `page.modal("id", "Title", "Content")`

### Card Turlari

```python
# Modern card (glassmorphism)
page.add_card("Glassmorphism", "Tavsif", type="modern")

# Standard card
page.add_card("Standard", "Tavsif", type="default")

# Feature card
page.add_card("Xususiyat", "Tavsif", type="feature")

# Service card
page.add_card("Xizmat", "Tavsif", type="service")
```

## 🎨 Zamonaviy Template'lar

### Premium Landing Page

```python
from uzorzen import create_modern_landing_page

page = create_modern_landing_page()
page.save("premium_landing.html")
```

### Advanced Portfolio

```python
from uzorzen import create_advanced_portfolio

page = create_advanced_portfolio()
page.save("advanced_portfolio.html")
```

### Modern Dashboard

```python
from uzorzen import create_modern_dashboard

page = create_modern_dashboard()
page.save("modern_dashboard.html")
```

### Premium Login Page

```python
from uzorzen import create_advanced_login_page

page = create_advanced_login_page()
page.save("premium_login.html")
```

## 🛠 Premium Xususiyatlar

### Google Analytics

```python
# Analytics qo'shish
page.add_analytics("G-XXXXXXXXXX")  # Replace with your GA ID
```

### Particles Background

```python
# Zarrachalar fon
page.add_particles_background({
    "particles": {
        "number": {"value": 100},
        "size": {"value": 3},
        "color": {"value": "#667eea"}
    }
})
```

### SEO Optimizatsiya

```python
# Meta tags qo'shish
page.add_meta_tag("description", "Zamonaviy web sahifa")
page.add_meta_tag("keywords", "Python, web, generator")
```

### Custom CSS/JS

```python
# Qo'shimcha CSS
page.add_css("""
.custom-section {
    background: linear-gradient(45deg, #667eea, #764ba2);
    padding: 3rem 0;
}
""")

# Qo'shimcha JavaScript
page.add_js("""
document.addEventListener('DOMContentLoaded', function() {
    console.log('Zamonaviy sahifa yuklandi!');
});
""")
```

## 🎨 Mavra Sozlamalari

```python
# Default mavra
page = Page("Sahifa", theme="default")

# Zamonaviy mavra
page = Page("Sahifa", theme="modern")

# Qora mavra
page = Page("Sahifa", theme="dark")
```

## 🌟 Advanced Features

### 1. Glassmorphism Design

```python
# Glassmorphism card yaratish
modern_page.add_card(
    "Glassmorphism Card",
    "Shaffof va blur effektlari bilan zamonaviy kartochka",
    card_type="modern",
    # Bu kartochka glassmorphism effekti bilan yaratiladi
)
```

### 2. Particle Effects

```python
# Hero sektsiyasi particles bilan
page.hero(
    "Particle Background",
    "Zarrachalar effekti bilan jozibali sahifa",
    particles=True,
    # Particles.js avtomatik yuklanadi
)
```

### 3. Counter Animations

```python
# Animated statistics
page.counter_section([
    {"value": 1500, "label": "Sotilgan Mahsulotlar", "icon": "bi-cart"},
    {"value": 500, "label": "Baxtli Mijozlar", "icon": "bi-heart"},
    {"value": 99, "label": "Muvaffaqiyat Foizi", "icon": "bi-star"}
])
```

### 4. Testimonials

```python
# Customer testimonials
page.testimonial_section([
    {
        "quote": "UzorZen biznesimni tubdan o'zgartirdi!",
        "author": "Alisher Karimov", 
        "role": "Startup Founder",
        "avatar": "https://example.com/avatar1.jpg"
    },
    {
        "quote": "Professional va sifatli xizmat!",
        "author": "Madina Tohirova",
        "role": "E-Commerce Owner", 
        "avatar": "https://example.com/avatar2.jpg"
    }
])
```

## 🔥 Premium Animations

### CSS Animations

```python
page.add_css("""
.animate-float {
    animation: float 6s ease-in-out infinite;
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

.text-gradient {
    background: linear-gradient(135deg, #667eea, #764ba2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
""")
```

### JavaScript Animations

```python
page.add_js("""
// Mouse parallax effect
document.querySelectorAll('.parallax').forEach(element => {
    element.addEventListener('mousemove', (e) => {
        const x = e.clientX / window.innerWidth;
        const y = e.clientY / window.innerHeight;
        element.style.transform = 
            `translateX(${x * 20}px) translateY(${y * 20}px)`;
    });
});

// Typing effect
const typingElements = document.querySelectorAll('.typing-effect');
typingElements.forEach(element => {
    const text = element.textContent;
    element.textContent = '';
    
    let i = 0;
    const typeWriter = () => {
        if (i < text.length) {
            element.textContent += text.charAt(i);
            i++;
            setTimeout(typeWriter, 50);
        }
    };
    setTimeout(typeWriter, 500);
});
""")
```

## 📊 Performance & SEO

### Optimized Loading

```python
# Fayl saqlash optimizatsiyasi bilan
page.save("optimized.html", minify=True)

# Konfiguratsiyani eksport qilish
config = page.export_config("my_project_config.json")
```

### Google Analytics Integration

```python
# Analytics tracking
page.add_analytics("G-XXXXXXXXXX")  # Replace with your tracking ID
```

## 🎯 Real-World Examples

### 1. Corporate Website

```python
from uzorzen import create_modern_landing_page

# Corporate landing page
page = create_modern_landing_page()

# Custom company info
company_info = {
    "name": "TechCorp",
    "address": "Tashkent, Uzbekistan", 
    "phone": "+998 90 123 45 67",
    "email": "info@techcorp.com"
}

page.footer(
    "Professional IT xizmatlari va konsultatsiyalar",
    company_info=company_info
)

page.save("corporate_website.html")
```

### 2. E-Commerce Product Page

```python
from uzorzen import create_premium_product_page

# E-commerce page
page = create_premium_product_page()

# Custom product details
page.add_card(
    "Premium Widget",
    "Yuqori sifatli va professional widget",
    "https://example.com/product.jpg",
    {"text": "Sotib Olish", "style": "btn-success-modern"}
)

page.save("product_page.html")
```

### 3. Portfolio Showcase

```python
from uzorzen import create_advanced_portfolio

# Personal portfolio
page = create_advanced_portfolio()

# Add custom projects
for project in projects:
    page.add_card(project["title"], project["description"])

page.save("portfolio_showcase.html")
```

## 🚀 CLI Tool

```bash
# Zamonaviy sahifa yaratish
uzorzen create landing --output modern_site.html

# Portfolio yaratish  
uzorzen create portfolio --output my_portfolio.html

# Dashboard yaratish
uzorzen create dashboard --output admin_dashboard.html

# Custom sahifa yaratish
uzorzen create custom --title "Mening Sahifam" --output custom.html

# Mavjud komponentlarni ko'rish
uzorzen components

# Versiya ma'lumoti
uzorzen version
```

## 📄 License

MIT License - see [LICENSE](LICENSE) file for details.

## 📞 Support & Contact

### Get Help
- 📧 **Email**: rakuzenuz@gmail.com
- 💬 **Telegram**: [@UzMaxBoy](https://t.me/UzMaxBoy)
- 📱 **Instagram**: [@penzenuz](https://instagram.com/penzenuz)
- 🎥 **YouTube**: [@uzmaxboy](https://youtube.com/@uzmaxboy)

## 🌟 Acknowledgments

- **Bootstrap Team** - For the amazing framework
- **AOS Team** - For scroll animations
- **Particles.js Team** - For particle effects
- **Google Fonts** - For beautiful typography
- **Bootstrap Icons** - For comprehensive icon set

---

<div align="center">

**© 2025 UzorZen Premium Edition**

**Created by RaKUZEN | Yoqubov Javohir**

*Telegram: @UzMaxBoy | Instagram: penzenuz*