Juda ham zamonaviy, 3D elementlar va Python backend bilan yaratilgan professional portfolio veb-sayt. Bu loyiha backend dasturchilar uchun maxsus mo'ljallangan bo'lib, ma'lumotlarni saqlash va boshqarish imkoniyatiga ega.
- 3D Animatsiyalar - Three.js yordamida yaratilgan 3D background
- Glassmorphism - Zamonaviy shisha effektlari
- Gradient Ranglar - Chiroyli gradient ranglar va glow effektlari
- Responsive Design - Barcha qurilmalarda chiroyli ko'rinish
- 3D Particle System - Harakatlanuvchi 3D zarralar
- Typing Animation - Dinamik yozish animatsiyasi
- Scroll-triggered Animations - GSAP bilan yaratilgan animatsiyalar
- 3D Card Tilt - Sichqoncha bilan boshqariladigan 3D kartalar
- Parallax Effects - Chuqurlik effektlari
- Python Flask - Kuchli backend framework
- SQLite Database - Ma'lumotlarni saqlash
- Admin Panel - Loyihalarni boshqarish
- Contact Form - Xabarlarni ma'lumotlar bazasida saqlash
- API Endpoints - RESTful API
- Mobile First - Mobil qurilmalarga moslashgan
- Fast Loading - Optimized kod va resurslar
- SEO Friendly - Search engine optimizatsiya
- Accessibility - Barcha foydalanuvchilar uchun
- HTML5 - Semantic markup
- CSS3 - Modern CSS with Grid, Flexbox, Animations
- JavaScript ES6+ - Modern JavaScript features
- Three.js - 3D graphics library
- GSAP - Professional animations
- Font Awesome - Icons
- Python 3.13 - Latest Python version
- Flask - Lightweight web framework
- SQLAlchemy - Database ORM
- Flask-Login - User authentication
- SQLite - Lightweight database
portfolio/
βββ app.py # Flask backend
βββ requirements.txt # Python dependencies
βββ portfolio.db # SQLite database
βββ templates/
β βββ index.html # Main template
βββ static/
β βββ css/
β β βββ style.css # Modern CSS styles
β βββ js/
β β βββ main.js # 3D animations & interactions
β βββ images/ # Static images
βββ README.md # Project documentation
git clone [repository-url]
cd portfoliopython3 -m venv venv
source venv/bin/activate # Linux/Mac
# yoki
venv\Scripts\activate # Windowspip install -r requirements.txtpython app.pyhttp://localhost:5000
- 3D floating elements
- Typing animation
- Interactive buttons
- Particle effects
- Professional description
- Tech stack showcase
- Interactive code editor
- 3D profile card
- Animated timeline
- Work history
- Technologies used
- Interactive markers
- 3D project cards
- Hover effects
- Technology tags
- Live/GitHub links
- Animated progress bars
- Category organization
- Interactive icons
- Proficiency levels
- Working contact form
- Database storage
- Social media links
- Interactive elements
Admin paneliga kirish uchun:
http://localhost:5000/admin/login
Default credentials:
- Username:
admin - Password:
admin123
- Loyihalarni boshqarish
- Ko'nikmalarni tahrirlash
- Xabarlarni ko'rish
- Ma'lumotlarni yangilash
- 100+ floating particles
- Mouse interaction
- Smooth animations
- Performance optimized
- 3D tilt effect
- Hover animations
- Glass morphism
- Dynamic shadows
- Real-time particle movement
- Color transitions
- Size variations
- Opacity changes
- User - Admin foydalanuvchilar
- Project - Loyihalar ma'lumoti
- Skill - Ko'nikmalar va darajalar
- Contact - Xabarlar
- Experience - Ish tajribasi
- Education - Ta'lim ma'lumoti
GET /api/projects- Loyihalar ro'yxatiGET /api/skills- Ko'nikmalar ro'yxatiPOST /api/contact- Xabar yuborish
- Scroll-triggered animations
- Stagger effects
- Smooth transitions
- Performance optimized
- Keyframe animations
- Transform effects
- Transition properties
- Hover states
- Typing effect
- Counter animations
- Parallax scrolling
- 3D transformations
- Desktop: 1200px+
- Tablet: 768px - 1199px
- Mobile: 320px - 767px
- Touch-friendly interactions
- Optimized 3D performance
- Simplified animations
- Mobile navigation
-
HTML Template (
templates/index.html)- Ism va lavozim
- Tavsif va ma'lumotlar
- Aloqa ma'lumotlari
-
CSS Styles (
static/css/style.css)- Ranglar va gradientlar
- Animatsiya tezliklari
- Dizayn elementlari
-
JavaScript (
static/js/main.js)- 3D elementlar
- Animatsiya parametrlari
- Interaktivlik
Admin panel orqali yoki to'g'ridan-to'g'ri database faylini tahrirlash orqali:
# app.py da yangi ma'lumot qo'shish
with app.app_context():
new_project = Project(
title="Yangi Loyiha",
description="Loyiha haqida ma'lumot",
technologies="Python, Flask, SQLite",
category="Backend"
)
db.session.add(new_project)
db.session.commit()- Lazy loading
- Image optimization
- Code minification
- Efficient animations
- Meta tags
- Structured data
- Semantic HTML
- Fast loading
- CSRF protection
- Input validation
- SQL injection prevention
- XSS protection
--primary-color: #00d4ff; /* Asosiy rang */
--secondary-color: #ff6b35; /* Ikkilamchi rang */
--accent-color: #7209b7; /* Accent rang */
--text-primary: #ffffff; /* Asosiy matn */
--text-secondary: #b0b0b0; /* Ikkilamchi matn */- Primary gradient:
#00d4ffto#7209b7 - Secondary gradient:
#ff6b35to#f7931e - Accent gradient:
#7209b7to#ff6b35
Agar savollaringiz bo'lsa yoki yordam kerak bo'lsa:
- Email: izzatulloh@example.com
- Telegram: @username
- GitHub: github.com/username
Bu loyiha MIT litsenziyasi ostida tarqatiladi.
- Repository'ni fork qiling
- Feature branch yarating (
git checkout -b feature/AmazingFeature) - O'zgarishlarni commit qiling (
git commit -m 'Add some AmazingFeature') - Branch'ga push qiling (
git push origin feature/AmazingFeature) - Pull Request yarating
Eslatma: Bu portfolio zamonaviy texnologiyalar va 3D elementlar bilan yaratilgan bo'lib, backend dasturchilar uchun maxsus mo'ljallangan. O'z ehtiyojlaringizga moslashtirib, professional portfolio yarating! π