A premium full-stack luxury supercar selling website built with HTML5, CSS3, JavaScript, PHP, and MySQL. Features stunning animations, responsive design, and a complete admin panel.

• Animated Hero Slider - Stunning car showcase with smooth transitions
• Responsive Design - Optimized for all devices (mobile, tablet, desktop)
• Advanced Animations - Hover effects, parallax scrolling, fade-in animations
• Car Filtering - Search and filter by brand, price, year, fuel type
• Car Details - Detailed car pages with image galleries
• Test Drive Booking - Interactive modal with form validation
• Contact Form - Professional contact page with validation
• Premium UI/UX - Dark luxury theme with gold accents

• RESTful API - Clean API endpoints for all operations
• Database Integration - Complete MySQL database with proper relationships
• Admin Panel - Secure dashboard for managing cars, requests, and messages
• Form Processing - Server-side validation and data sanitization
• Security - SQL injection prevention, input validation

• Car Management - Add, edit, delete cars with image uploads
• Test Drive Requests - View and manage customer requests
• Contact Messages - Handle customer inquiries
• Dashboard Statistics - Overview of system data
• Secure Authentication - Admin login system

• Frontend: HTML5, CSS3, JavaScript (ES6+)
• Backend: PHP 7.4+
• Database: MySQL 5.7+
• Server: XAMPP (Apache + MySQL + PHP)
• Icons: Font Awesome 6
• Fonts: Google Fonts (Inter, Playfair Display)

• XAMPP (or similar LAMP/WAMP stack)
• Web browser
• Text editor/IDE

1. Download XAMPP from https://www.apachefriends.org/
2. Install XAMPP and start Apache and MySQL services
3. Open phpMyAdmin at http://localhost/phpmyadmin

1. Create a new database called luxury_supercars
2. Import the SQL schema from database/schema.sql
3. The database will be populated with sample data automatically

1. Copy all project files to your XAMPP htdocs directory
2. Navigate to htdocs/luxury-supercars/ (or your chosen folder name)
3. Update database credentials in php/config.php if needed

• Frontend: http://localhost/luxury-supercars/
• Admin Panel: http://localhost/luxury-supercars/admin.html
• phpMyAdmin: http://localhost/phpmyadmin

Default Admin Login:

• Username: admin
• Password: admin123

luxury-supercars/
├── index.html              # Homepage
├── cars.html              # Car listing page
├── car-details.html       # Individual car details
├── contact.html           # Contact form page
├── admin.html             # Admin panel
├── css/
│   └── style.css          # Main stylesheet
├── js/
│   ├── script.js          # Main JavaScript
│   ├── cars.js            # Car listing functionality
│   ├── car-details.js     # Car details functionality
│   ├── contact.js         # Contact form functionality
│   └── admin.js           # Admin panel functionality
├── php/
│   ├── config.php         # Database configuration
│   └── api/
│       ├── cars.php       # Cars API endpoint
│       ├── test-drives.php # Test drives API
│       └── contact.php    # Contact messages API
├── database/
│   └── schema.sql         # Database schema and sample data
└── README.md              # This file

• Primary Black: #0A0A0A
• Secondary Dark: #1A1A1A
• Luxury Gold: #D4AF37
• Light Gray: #666666
• White: #FFFFFF

• Headings: Playfair Display (serif)
• Body Text: Inter (sans-serif)
• Weights: 300, 400, 500, 600, 700

• Fade-in on scroll
• Hover zoom effects
• Smooth transitions
• Parallax scrolling
• Loading animations

• GET - Retrieve all cars or specific car
• POST - Create new car (admin only)
• PUT - Update existing car (admin only)
• DELETE - Delete car (admin only)

• GET - Retrieve test drive requests (admin only)
• POST - Submit new test drive request
• PUT - Update request status (admin only)
• DELETE - Delete request (admin only)

• GET - Retrieve contact messages (admin only)
• POST - Submit new contact message
• PUT - Update message status (admin only)
• DELETE - Delete message (admin only)

• Mobile: < 768px
• Tablet: 768px - 1024px
• Desktop: > 1024px

• Lazy loading images
• Optimized CSS animations
• Efficient database queries
• Compressed assets
• Smooth scrolling

• SQL injection prevention
• Input sanitization
• XSS protection
• CSRF protection
• Admin authentication

• Chrome 70+
• Firefox 65+
• Safari 12+
• Edge 79+

1. Use the admin panel to add cars through the web interface
2. Or directly insert into the database via phpMyAdmin
3. Ensure image URLs are accessible

• Modify css/style.css for design changes
• Update CSS custom properties for color scheme changes
• Adjust animations in the keyframes section

• Add new API endpoints in the php/api/ directory
• Extend JavaScript functionality in respective JS files
• Add new database tables as needed

1. Database Connection Error

   • Check XAMPP MySQL service is running
   • Verify database credentials in php/config.php
   • Ensure database exists and is properly imported

2. Images Not Loading

   • Check image URLs are accessible
   • Verify image paths in database
   • Ensure proper file permissions

3. Admin Panel Not Working

   • Clear browser cache
   • Check JavaScript console for errors
   • Verify admin credentials

4. Forms Not Submitting

   • Check PHP error logs
   • Verify API endpoints are accessible
   • Ensure proper form validation

For support and questions:

• Check the troubleshooting section
• Review browser console for JavaScript errors
• Check PHP error logs in XAMPP
• Verify database connections and queries

The system comes with sample data including:

• 6 luxury supercars (Ferrari, Lamborghini, McLaren, etc.)
• Sample admin user
• Database structure with proper relationships

To update the system:

1. Backup your database
2. Replace files with new versions
3. Run any new SQL migrations
4. Clear browser cache

Enjoy your luxury supercar website! 🏎️✨