first commit

2025-09-11 13:36:35 +08:00 · 2025-09-11 13:36:35 +08:00 · 0a14de61fd
commit 0a14de61fd
42 changed files with 19640 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example
--- a/README.md
+++ b/README.md
@ -0,0 +1,75 @@
+# Nuxt Minimal Starter
+
+Look at the [Nuxt documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `http://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
--- a/app.vue
+++ b/app.vue
@ -0,0 +1,8 @@
+<template>
+  <NuxtLayout>
+    <NuxtPage />
+  </NuxtLayout>
+</template>
+
+
+
--- a/assets/css/main.css
+++ b/assets/css/main.css
@ -0,0 +1,6 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+
+
--- a/components/ContactForm.vue
+++ b/components/ContactForm.vue
@ -0,0 +1,79 @@
+<template>
+  <form @submit.prevent="submitForm" action="https://formspree.io/f/xkgvgzal" method="POST">
+    <div class="space-y-6">
+      <div>
+        <label for="name" class="block text-sm font-medium text-gray-700 mb-2">Name</label>
+        <input
+          v-model="form.name"
+          type="text"
+          id="name"
+          name="name"
+          required
+          class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+        >
+      </div>
+      
+      <div>
+        <label for="email" class="block text-sm font-medium text-gray-700 mb-2">Email</label>
+        <input
+          v-model="form.email"
+          type="email"
+          id="email"
+          name="email"
+          required
+          class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+        >
+      </div>
+      
+      <div>
+        <label for="message" class="block text-sm font-medium text-gray-700 mb-2">Message</label>
+        <textarea
+          v-model="form.message"
+          id="message"
+          name="message"
+          rows="5"
+          required
+          class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+        ></textarea>
+      </div>
+      
+      <button
+        type="submit"
+        :disabled="isSubmitting"
+        class="w-full bg-blue-600 text-white py-3 px-6 rounded-lg hover:bg-blue-700 transition-colors disabled:opacity-50"
+      >
+        {{ isSubmitting ? 'Sending...' : 'Send Message' }}
+      </button>
+    </div>
+  </form>
+</template>
+
+<script setup>
+const form = reactive({
+  name: '',
+  email: '',
+  message: ''
+})
+
+const isSubmitting = ref(false)
+
+const submitForm = async (event) => {
+  isSubmitting.value = true
+  
+  try {
+    await $fetch('https://formspree.io/f/xkgvgzal', {
+      method: 'POST',
+      body: form
+    })
+    
+    Object.keys(form).forEach(key => form[key] = '')
+    alert('Message sent successfully!')
+  } catch (error) {
+    alert('Error sending message. Please try again.')
+  } finally {
+    isSubmitting.value = false
+  }
+}
+</script>
+
+
--- a/components/Footer.vue
+++ b/components/Footer.vue
@ -0,0 +1,54 @@
+<template>
+  <footer class="bg-gray-900 text-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
+        <div>
+          <div class="flex items-center space-x-2 mb-4">
+            <img src="/logo.svg" alt="ClueFlare" class="h-8 w-8">
+            <span class="text-xl font-bold">ClueFlare</span>
+          </div>
+          <p class="text-gray-400">{{ t('footer.description') }}</p>
+        </div>
+        
+        <div>
+          <h4 class="font-semibold mb-4">Services</h4>
+          <ul class="space-y-2 text-gray-400">
+            <li>AWS Proxy</li>
+            <li>Alibaba Cloud</li>
+            <li>Tencent Cloud</li>
+            <li>DigitalOcean</li>
+          </ul>
+        </div>
+        
+        <div>
+          <h4 class="font-semibold mb-4">Company</h4>
+          <ul class="space-y-2 text-gray-400">
+            <li><NuxtLink :to="localePath('/about')" class="hover:text-white transition-colors">About Us</NuxtLink></li>
+            <li><NuxtLink :to="localePath('/blog')" class="hover:text-white transition-colors">Blog</NuxtLink></li>
+            <li><NuxtLink :to="localePath('/contact')" class="hover:text-white transition-colors">Contact</NuxtLink></li>
+            <li><a href="/sitemap_index.xml" class="hover:text-white transition-colors" target="_blank">Sitemap</a></li>
+          </ul>
+        </div>
+        
+        <div>
+          <h4 class="font-semibold mb-4">{{ t('contact.title') }}</h4>
+          <div class="space-y-2 text-gray-400">
+            <p>{{ t('contact.telegram') }}: {{ t('contact.username') }}</p>
+            <p>{{ t('contact.whatsapp') }}: {{ t('contact.phone') }}</p>
+          </div>
+        </div>
+      </div>
+      
+      <div class="border-t border-gray-800 mt-12 pt-8 text-center text-gray-400">
+        <p>&copy; 2024 ClueFlare. {{ t('footer.rights') }}</p>
+      </div>
+    </div>
+  </footer>
+</template>
+
+<script setup>
+const { t } = useI18n()
+const localePath = useLocalePath()
+</script>
+
+
--- a/components/Header.vue
+++ b/components/Header.vue
@ -0,0 +1,131 @@
+<template>
+  <header class="sticky top-0 z-50 bg-white/80 backdrop-blur shadow-sm border-b">
+    <nav class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="flex justify-between h-16">
+        <div class="flex items-center">
+          <NuxtLink :to="localePath('/')" class="flex items-center space-x-2">
+            <img src="/logo.svg" alt="ClueFlare" class="h-8 w-8">
+            <span class="text-xl font-bold text-gray-900">ClueFlare</span>
+          </NuxtLink>
+        </div>
+        
+        <div class="hidden md:flex items-center space-x-8">
+          <NuxtLink 
+            v-for="item in navigation" 
+            :key="item.name"
+            :to="localePath(item.href)" 
+            class="text-gray-700 hover:text-blue-600 transition-colors duration-200"
+          >
+            {{ t(item.name) }}
+          </NuxtLink>
+        </div>
+        
+        <div class="flex items-center space-x-4">
+          <button
+            type="button"
+            class="inline-flex items-center justify-center rounded-md p-2 text-gray-600 hover:text-gray-900 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-blue-500 md:hidden"
+            @click="isMobileOpen = !isMobileOpen"
+            :aria-expanded="isMobileOpen.toString()"
+            aria-controls="mobile-menu"
+          >
+            <span class="sr-only">Open main menu</span>
+            <svg v-if="!isMobileOpen" class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5M3.75 17.25h16.5" />
+            </svg>
+            <svg v-else class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
+          <div class="flex items-center space-x-4">
+            <a 
+              href="https://t.me/pinnovatecloud" 
+              target="_blank"
+              class="flex items-center space-x-2 text-gray-600 hover:text-blue-600 transition-colors"
+            >
+              <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/>
+              </svg>
+              <span class="hidden lg:inline text-sm">{{ t('contact.username') }}</span>
+            </a>
+            
+            <a 
+              href="https://wa.me/19174029875" 
+              target="_blank"
+              class="flex items-center space-x-2 text-gray-600 hover:text-green-600 transition-colors"
+            >
+              <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347"/>
+              </svg>
+              <span class="hidden lg:inline text-sm">{{ t('contact.phone') }}</span>
+            </a>
+          </div>
+          
+          <LanguageSwitcher />
+        </div>
+      </div>
+      
+      <div 
+        id="mobile-menu"
+        class="md:hidden"
+        v-if="isMobileOpen"
+      >
+        <div class="space-y-1 pb-3 pt-2">
+          <NuxtLink 
+            v-for="item in navigation" 
+            :key="item.name + '-mobile'"
+            :to="localePath(item.href)" 
+            class="block px-3 py-2 text-base font-medium text-gray-700 hover:text-blue-600 hover:bg-gray-50 rounded-md"
+            @click="closeMobile()"
+          >
+            {{ t(item.name) }}
+          </NuxtLink>
+        </div>
+        <div class="border-t border-gray-200 pt-3 pb-4 flex items-center justify-between px-3">
+          <div class="flex items-center space-x-4">
+            <a 
+              href="https://t.me/pinnovatecloud" 
+              target="_blank"
+              class="flex items-center space-x-2 text-gray-600 hover:text-blue-600 transition-colors"
+            >
+              <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/>
+              </svg>
+            </a>
+            <a 
+              href="https://wa.me/19174029875" 
+              target="_blank"
+              class="flex items-center space-x-2 text-gray-600 hover:text-green-600 transition-colors"
+            >
+              <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347"/>
+              </svg>
+            </a>
+          </div>
+          <div>
+            <LanguageSwitcher />
+          </div>
+        </div>
+      </div>
+    </nav>
+  </header>
+</template>
+
+<script setup>
+const { t } = useI18n()
+const localePath = useLocalePath()
+
+const navigation = [
+  { name: 'nav.home', href: '/' },
+  { name: 'nav.about', href: '/about' },
+  { name: 'nav.blog', href: '/blog' },
+  { name: 'nav.contact', href: '/contact' }
+]
+
+const isMobileOpen = ref(false)
+
+const closeMobile = () => {
+  isMobileOpen.value = false
+}
+</script>
+
+
--- a/components/LanguageSwitcher.vue
+++ b/components/LanguageSwitcher.vue
@ -0,0 +1,45 @@
+<template>
+  <div class="relative">
+    <button 
+      @click="isOpen = !isOpen"
+      class="flex items-center space-x-1 px-3 py-2 text-sm font-medium text-gray-700 hover:text-gray-900 focus:outline-none"
+    >
+      <span>{{ currentLocale?.name }}</span>
+      <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
+      </svg>
+    </button>
+    
+    <div 
+      v-if="isOpen"
+      class="absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1 z-50"
+    >
+      <button
+        v-for="locale in availableLocales"
+        :key="locale.code"
+        @click="switchLanguage(locale.code)"
+        class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 w-full text-left"
+      >
+        {{ locale.name }}
+      </button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const { locale, locales } = useI18n()
+const switchLocalePath = useSwitchLocalePath()
+
+const isOpen = ref(false)
+const availableLocales = locales.value
+const currentLocale = computed(() => 
+  availableLocales.find(l => l.code === locale.value)
+)
+
+const switchLanguage = async (newLocale) => {
+  await navigateTo(switchLocalePath(newLocale))
+  isOpen.value = false
+}
+</script>
+
+
--- a/content.config.ts
+++ b/content.config.ts
@ -0,0 +1,28 @@
+import {defineContentConfig, defineCollection, z } from '@nuxt/content'
+
+export default defineContentConfig({
+  collections: {
+  blog: defineCollection({
+    type: 'page',
+    source: '**',
+    schema: z.object({
+      title: z.string(),
+      description: z.string().optional(),
+      date: z.string().or(z.date()).optional(),
+      locale: z.string().optional()
+    })
+  }),
+  news: defineCollection({
+    type: 'page',
+    source: 'content/**/news',
+    schema: z.object({
+      title: z.string(),
+      description: z.string().optional(),
+      date: z.string().or(z.date()).optional(),
+      locale: z.string().optional()
+    })
+  })
+  }
+})
+
+
--- a/content/en/blog/aws-guide.md
+++ b/content/en/blog/aws-guide.md
@ -0,0 +1,70 @@
+---
+title: "Complete AWS Setup Guide"
+description: "Step-by-step guide to setting up your first AWS account and services"
+date: "2024-01-20"
+slug: "aws-guide"
+locale: "en"
+---
+
+# Complete AWS Setup Guide
+
+Amazon Web Services (AWS) is the world's most comprehensive and broadly adopted cloud platform. This guide will walk you through setting up your first AWS account and configuring essential services.
+
+## Getting Started with AWS
+
+### 1. Create Your AWS Account
+
+The first step is to create an AWS account. Visit [aws.amazon.com](https://aws.amazon.com) and click "Create an AWS Account."
+
+### 2. Choose Your Region
+
+Select the AWS region closest to your users for optimal performance. Popular regions include:
+- US East (N. Virginia)
+- US West (Oregon)
+- Europe (Ireland)
+- Asia Pacific (Singapore)
+
+### 3. Set Up Billing Alerts
+
+Configure billing alerts to monitor your spending and avoid unexpected charges.
+
+## Essential AWS Services
+
+### Compute Services
+- **EC2**: Virtual servers in the cloud
+- **Lambda**: Serverless compute service
+- **ECS**: Container management service
+
+### Storage Services
+- **S3**: Object storage service
+- **EBS**: Block storage for EC2 instances
+- **EFS**: Managed file system
+
+### Database Services
+- **RDS**: Managed relational databases
+- **DynamoDB**: NoSQL database service
+- **ElastiCache**: In-memory caching service
+
+## Security Best Practices
+
+1. Enable Multi-Factor Authentication (MFA)
+2. Use IAM roles and policies
+3. Enable CloudTrail for audit logging
+4. Configure VPC security groups properly
+
+## Cost Optimization Tips
+
+- Use Reserved Instances for predictable workloads
+- Implement auto-scaling policies
+- Monitor usage with AWS Cost Explorer
+- Use Spot Instances for flexible workloads
+
+## Next Steps
+
+Once you've completed the basic setup, consider exploring:
+- AWS Well-Architected Framework
+- Infrastructure as Code with CloudFormation
+- Monitoring with CloudWatch
+- Security with AWS Security Hub
+
+Our platform provides seamless access to AWS services with enhanced security and performance optimization.
--- a/content/en/blog/cloud-security.md
+++ b/content/en/blog/cloud-security.md
@ -0,0 +1,129 @@
+---
+title: "Cloud Security Best Practices"
+description: "Essential security measures to protect your cloud infrastructure and data"
+date: "2024-01-25"
+slug: "cloud-security"
+locale: "en"
+---
+
+# Cloud Security Best Practices
+
+Security in the cloud is a shared responsibility between you and your cloud provider. This comprehensive guide covers essential security practices to protect your cloud infrastructure.
+
+## Understanding the Shared Responsibility Model
+
+### Cloud Provider Responsibilities
+- Physical security of data centers
+- Hardware and software infrastructure
+- Network and host operating systems
+
+### Your Responsibilities
+- Data encryption and access control
+- Application security
+- Identity and access management
+- Network security configuration
+
+## Essential Security Measures
+
+### 1. Identity and Access Management (IAM)
+
+**Multi-Factor Authentication (MFA)**
+- Enable MFA for all user accounts
+- Use hardware tokens for high-privilege accounts
+- Implement conditional access policies
+
+**Principle of Least Privilege**
+- Grant minimum necessary permissions
+- Regular access reviews and audits
+- Use role-based access control (RBAC)
+
+### 2. Data Protection
+
+**Encryption at Rest**
+- Enable encryption for all storage services
+- Use customer-managed keys when possible
+- Implement key rotation policies
+
+**Encryption in Transit**
+- Use TLS 1.2 or higher for all communications
+- Implement certificate management
+- Use VPN or private connections for sensitive data
+
+### 3. Network Security
+
+**Virtual Private Clouds (VPC)**
+- Isolate resources in private subnets
+- Use Network Access Control Lists (NACLs)
+- Implement security groups properly
+
+**Firewall Configuration**
+- Block unnecessary ports and protocols
+- Use application-level firewalls
+- Regular security rule reviews
+
+## Monitoring and Compliance
+
+### Security Monitoring
+- Implement continuous monitoring
+- Use Security Information and Event Management (SIEM)
+- Set up automated threat detection
+
+### Compliance Frameworks
+- SOC 2 Type II
+- ISO 27001
+- PCI DSS (for payment processing)
+- GDPR (for EU data)
+
+## Incident Response Planning
+
+### Preparation
+- Develop incident response procedures
+- Train your security team
+- Maintain updated contact lists
+
+### Detection and Analysis
+- Monitor security events in real-time
+- Use automated threat detection
+- Implement log analysis tools
+
+### Response and Recovery
+- Isolate affected systems
+- Preserve evidence for analysis
+- Communicate with stakeholders
+- Restore services securely
+
+## Cloud Provider Security Features
+
+### AWS Security
+- AWS Security Hub
+- AWS GuardDuty
+- AWS Config
+- AWS CloudTrail
+
+### Azure Security
+- Azure Security Center
+- Azure Sentinel
+- Azure Policy
+- Azure Monitor
+
+### Google Cloud Security
+- Security Command Center
+- Cloud Security Scanner
+- Cloud Asset Inventory
+- Cloud Audit Logs
+
+## Best Practices Summary
+
+1. **Always encrypt sensitive data**
+2. **Implement strong access controls**
+3. **Monitor and audit everything**
+4. **Keep systems updated**
+5. **Train your team regularly**
+6. **Have a response plan**
+7. **Test your security measures**
+
+## Conclusion
+
+Cloud security requires a proactive approach and continuous attention. By implementing these best practices and staying informed about emerging threats, you can significantly reduce your security risks and protect your valuable data and applications.
+
+Remember, security is not a one-time setup but an ongoing process that evolves with your business and the threat landscape.
--- a/content/en/blog/cost-optimization.md
+++ b/content/en/blog/cost-optimization.md
@ -0,0 +1,194 @@
+---
+title: "Cloud Cost Optimization Strategies"
+description: "Proven methods to reduce cloud spending while maintaining performance and reliability"
+date: "2024-01-30"
+slug: "cost-optimization"
+locale: "en"
+---
+
+# Cloud Cost Optimization Strategies
+
+Cloud computing offers incredible scalability and flexibility, but costs can quickly spiral out of control without proper management. This guide provides proven strategies to optimize your cloud spending while maintaining performance and reliability.
+
+## Understanding Cloud Costs
+
+### Common Cost Drivers
+- **Compute Resources**: Virtual machines, containers, and serverless functions
+- **Storage**: Data storage, backups, and archival
+- **Networking**: Data transfer, load balancers, and CDN
+- **Database Services**: Managed databases and caching
+- **Monitoring and Logging**: Observability tools and services
+
+### Hidden Costs to Watch
+- Data transfer between regions
+- Idle resources running 24/7
+- Over-provisioned instances
+- Unused storage volumes
+- Premium support tiers
+
+## Right-Sizing Your Resources
+
+### 1. Instance Optimization
+
+**Analyze Current Usage**
+- Monitor CPU, memory, and network utilization
+- Identify underutilized resources
+- Use cloud provider cost analysis tools
+
+**Choose Appropriate Instance Types**
+- General purpose for balanced workloads
+- Compute optimized for CPU-intensive tasks
+- Memory optimized for data processing
+- Storage optimized for I/O intensive applications
+
+### 2. Auto-Scaling Implementation
+
+**Horizontal Scaling**
+- Scale out during peak demand
+- Scale in during low usage periods
+- Use predictive scaling for known patterns
+
+**Vertical Scaling**
+- Adjust instance sizes based on actual needs
+- Implement automated scaling policies
+- Monitor performance metrics continuously
+
+## Storage Optimization
+
+### 1. Storage Tier Management
+
+**Hot Storage**
+- Frequently accessed data
+- High-performance SSDs
+- Higher cost per GB
+
+**Warm Storage**
+- Occasionally accessed data
+- Standard SSDs
+- Balanced cost and performance
+
+**Cold Storage**
+- Rarely accessed data
+- HDDs or archival storage
+- Lowest cost per GB
+
+### 2. Data Lifecycle Policies
+
+**Automated Transitions**
+- Move data between storage tiers
+- Implement retention policies
+- Delete unnecessary data
+
+**Backup Optimization**
+- Compress backup data
+- Use incremental backups
+- Implement cross-region replication only when needed
+
+## Reserved Instances and Savings Plans
+
+### 1. Reserved Instances (RIs)
+
+**Benefits**
+- Up to 75% savings compared to on-demand
+- Predictable costs for stable workloads
+- Capacity reservations
+
+**Best Practices**
+- Analyze usage patterns before purchasing
+- Start with smaller commitments
+- Use convertible RIs for flexibility
+
+### 2. Savings Plans
+
+**Compute Savings Plans**
+- Flexible across instance families
+- Automatic application to usage
+- Up to 66% savings
+
+**EC2 Instance Savings Plans**
+- Specific to EC2 instances
+- Higher savings potential
+- Less flexibility than compute plans
+
+## Serverless and Container Optimization
+
+### 1. Serverless Functions
+
+**Cost Benefits**
+- Pay only for execution time
+- No idle resource costs
+- Automatic scaling
+
+**Optimization Tips**
+- Minimize cold start times
+- Optimize function memory allocation
+- Use provisioned concurrency for predictable workloads
+
+### 2. Container Optimization
+
+**Resource Limits**
+- Set appropriate CPU and memory limits
+- Use resource requests and limits
+- Monitor actual usage vs. requests
+
+**Image Optimization**
+- Use minimal base images
+- Remove unnecessary packages
+- Implement multi-stage builds
+
+## Monitoring and Governance
+
+### 1. Cost Monitoring Tools
+
+**Cloud Provider Tools**
+- AWS Cost Explorer
+- Azure Cost Management
+- Google Cloud Billing
+
+**Third-Party Solutions**
+- CloudHealth by VMware
+- Cloudability
+- Spot.io
+
+### 2. Budget Alerts and Controls
+
+**Budget Alerts**
+- Set spending thresholds
+- Configure multiple alert levels
+- Send notifications to stakeholders
+
+**Access Controls**
+- Implement IAM policies for cost management
+- Require approval for large purchases
+- Regular cost reviews and approvals
+
+## Best Practices Summary
+
+### Immediate Actions
+1. **Audit current spending** - Identify waste and optimization opportunities
+2. **Implement monitoring** - Set up cost tracking and alerts
+3. **Right-size resources** - Match instance types to actual needs
+4. **Enable auto-scaling** - Automate resource adjustments
+
+### Long-term Strategies
+1. **Reserved capacity planning** - Commit to stable workloads
+2. **Architecture optimization** - Design for cost efficiency
+3. **Regular reviews** - Monthly cost analysis and optimization
+4. **Team training** - Educate teams on cost implications
+
+### Cost Optimization Checklist
+
+- [ ] Implement comprehensive monitoring
+- [ ] Right-size all compute resources
+- [ ] Enable auto-scaling policies
+- [ ] Optimize storage tiers
+- [ ] Purchase reserved instances for stable workloads
+- [ ] Set up budget alerts and controls
+- [ ] Regular cost reviews and optimization
+- [ ] Train teams on cost awareness
+
+## Conclusion
+
+Cloud cost optimization is an ongoing process that requires continuous monitoring, analysis, and adjustment. By implementing these strategies and maintaining cost awareness across your organization, you can significantly reduce your cloud spending while maintaining or improving performance and reliability.
+
+Remember, the goal is not just to reduce costs, but to optimize the value you get from your cloud investment. Focus on efficiency, not just cost reduction.
--- a/content/en/blog/getting-started.md
+++ b/content/en/blog/getting-started.md
@ -0,0 +1,29 @@
+---
+title: "Getting Started with Cloud Services"
+description: "Learn how to choose the right cloud provider for your business needs"
+date: "2024-01-15"
+slug: "getting-started"
+locale: "en"
+---
+
+# Getting Started with Cloud Services
+
+Cloud computing has revolutionized how businesses operate, offering scalable, cost-effective solutions for companies of all sizes. This guide will help you understand the basics of cloud services and how to choose the right provider.
+
+## What is Cloud Computing?
+
+Cloud computing delivers computing services—including servers, storage, databases, networking, software, analytics, and intelligence—over the Internet ("the cloud") to offer faster innovation, flexible resources, and economies of scale.
+
+## Choosing the Right Provider
+
+When selecting a cloud provider, consider factors such as:
+
+- **Performance and Reliability**
+- **Security Features**
+- **Pricing Structure**
+- **Geographic Coverage**
+- **Support Quality**
+
+Our platform makes it easy to compare and access multiple cloud providers through a single interface.
+
+
--- a/content/zh-hans/blog/aws-guide.md
+++ b/content/zh-hans/blog/aws-guide.md
@ -0,0 +1,70 @@
+---
+title: "AWS 完整设置指南"
+description: "逐步指导您设置第一个 AWS 账户和服务"
+date: "2024-01-20"
+slug: "aws-guide"
+locale: "zh-hans"
+---
+
+# AWS 完整设置指南
+
+Amazon Web Services (AWS) 是世界上功能最全面、应用最广泛的云平台。本指南将引导您设置第一个 AWS 账户并配置基本服务。
+
+## 开始使用 AWS
+
+### 1. 创建 AWS 账户
+
+第一步是创建 AWS 账户。访问 [aws.amazon.com](https://aws.amazon.com) 并点击"创建 AWS 账户"。
+
+### 2. 选择您的区域
+
+选择最接近您用户的 AWS 区域以获得最佳性能。热门区域包括：
+- 美国东部（弗吉尼亚北部）
+- 美国西部（俄勒冈）
+- 欧洲（爱尔兰）
+- 亚太地区（新加坡）
+
+### 3. 设置账单提醒
+
+配置账单提醒以监控您的支出并避免意外费用。
+
+## 基本 AWS 服务
+
+### 计算服务
+- **EC2**：云中的虚拟服务器
+- **Lambda**：无服务器计算服务
+- **ECS**：容器管理服务
+
+### 存储服务
+- **S3**：对象存储服务
+- **EBS**：EC2 实例的块存储
+- **EFS**：托管文件系统
+
+### 数据库服务
+- **RDS**：托管关系数据库
+- **DynamoDB**：NoSQL 数据库服务
+- **ElastiCache**：内存缓存服务
+
+## 安全最佳实践
+
+1. 启用多因素身份验证 (MFA)
+2. 使用 IAM 角色和策略
+3. 启用 CloudTrail 进行审计日志记录
+4. 正确配置 VPC 安全组
+
+## 成本优化技巧
+
+- 为可预测的工作负载使用预留实例
+- 实施自动扩展策略
+- 使用 AWS Cost Explorer 监控使用情况
+- 为灵活的工作负载使用 Spot 实例
+
+## 下一步
+
+完成基本设置后，考虑探索：
+- AWS 良好架构框架
+- 使用 CloudFormation 进行基础设施即代码
+- 使用 CloudWatch 进行监控
+- 使用 AWS Security Hub 进行安全
+
+我们的平台通过增强的安全性和性能优化提供对 AWS 服务的无缝访问。
--- a/content/zh-hans/blog/cloud-security.md
+++ b/content/zh-hans/blog/cloud-security.md
@ -0,0 +1,129 @@
+---
+title: "云安全最佳实践"
+description: "保护您的云基础设施和数据的基本安全措施"
+date: "2024-01-25"
+slug: "cloud-security"
+locale: "zh-hans"
+---
+
+# 云安全最佳实践
+
+云安全是您和云提供商之间的共同责任。本综合指南涵盖保护云基础设施的基本安全实践。
+
+## 理解共同责任模型
+
+### 云提供商责任
+- 数据中心的物理安全
+- 硬件和软件基础设施
+- 网络和主机操作系统
+
+### 您的责任
+- 数据加密和访问控制
+- 应用程序安全
+- 身份和访问管理
+- 网络安全配置
+
+## 基本安全措施
+
+### 1. 身份和访问管理 (IAM)
+
+**多因素身份验证 (MFA)**
+- 为所有用户账户启用 MFA
+- 为高权限账户使用硬件令牌
+- 实施条件访问策略
+
+**最小权限原则**
+- 授予最小必要权限
+- 定期访问审查和审计
+- 使用基于角色的访问控制 (RBAC)
+
+### 2. 数据保护
+
+**静态加密**
+- 为所有存储服务启用加密
+- 尽可能使用客户管理的密钥
+- 实施密钥轮换策略
+
+**传输中加密**
+- 对所有通信使用 TLS 1.2 或更高版本
+- 实施证书管理
+- 对敏感数据使用 VPN 或私有连接
+
+### 3. 网络安全
+
+**虚拟私有云 (VPC)**
+- 在私有子网中隔离资源
+- 使用网络访问控制列表 (NACLs)
+- 正确实施安全组
+
+**防火墙配置**
+- 阻止不必要的端口和协议
+- 使用应用程序级防火墙
+- 定期审查安全规则
+
+## 监控和合规
+
+### 安全监控
+- 实施持续监控
+- 使用安全信息和事件管理 (SIEM)
+- 设置自动威胁检测
+
+### 合规框架
+- SOC 2 Type II
+- ISO 27001
+- PCI DSS（用于支付处理）
+- GDPR（用于欧盟数据）
+
+## 事件响应规划
+
+### 准备
+- 制定事件响应程序
+- 培训您的安全团队
+- 维护更新的联系人列表
+
+### 检测和分析
+- 实时监控安全事件
+- 使用自动威胁检测
+- 实施日志分析工具
+
+### 响应和恢复
+- 隔离受影响的系统
+- 为分析保留证据
+- 与利益相关者沟通
+- 安全地恢复服务
+
+## 云提供商安全功能
+
+### AWS 安全
+- AWS Security Hub
+- AWS GuardDuty
+- AWS Config
+- AWS CloudTrail
+
+### Azure 安全
+- Azure Security Center
+- Azure Sentinel
+- Azure Policy
+- Azure Monitor
+
+### Google Cloud 安全
+- Security Command Center
+- Cloud Security Scanner
+- Cloud Asset Inventory
+- Cloud Audit Logs
+
+## 最佳实践总结
+
+1. **始终加密敏感数据**
+2. **实施强访问控制**
+3. **监控和审计一切**
+4. **保持系统更新**
+5. **定期培训您的团队**
+6. **制定响应计划**
+7. **测试您的安全措施**
+
+## 结论
+
+云安全需要主动方法和持续关注。通过实施这些最佳实践并了解新兴威胁，您可以显著降低安全风险并保护您宝贵的数据和应用程序。
+
+记住，安全不是一次性设置，而是随着您的业务和威胁环境而发展的持续过程。
--- a/content/zh-hans/blog/getting-started.md
+++ b/content/zh-hans/blog/getting-started.md
@ -0,0 +1,29 @@
+---
+title: "云服务入门指南"
+description: "了解如何为您的业务需求选择合适的云服务提供商"
+date: "2024-01-15"
+slug: "getting-started"
+locale: "zh-hans"
+---
+
+# 云服务入门指南
+
+云计算已经彻底改变了企业的运营方式，为各种规模的公司提供了可扩展、经济高效的解决方案。本指南将帮助您了解云服务的基础知识以及如何选择合适的提供商。
+
+## 什么是云计算？
+
+云计算通过互联网（"云"）提供计算服务——包括服务器、存储、数据库、网络、软件、分析和智能——以提供更快的创新、灵活的资源和规模经济。
+
+## 选择合适的提供商
+
+在选择云提供商时，请考虑以下因素：
+
+- **性能和可靠性**
+- **安全功能**
+- **定价结构**
+- **地理覆盖**
+- **支持质量**
+
+我们的平台让您可以通过单一界面轻松比较和访问多个云提供商。
+
+
--- a/content/zh-hant/blog/aws-guide.md
+++ b/content/zh-hant/blog/aws-guide.md
@ -0,0 +1,70 @@
+---
+title: "AWS 完整設置指南"
+description: "逐步指導您設置第一個 AWS 帳戶和服務"
+date: "2024-01-20"
+slug: "aws-guide"
+locale: "zh-hant"
+---
+
+# AWS 完整設置指南
+
+Amazon Web Services (AWS) 是世界上功能最全面、應用最廣泛的雲端平台。本指南將引導您設置第一個 AWS 帳戶並配置基本服務。
+
+## 開始使用 AWS
+
+### 1. 創建 AWS 帳戶
+
+第一步是創建 AWS 帳戶。訪問 [aws.amazon.com](https://aws.amazon.com) 並點擊「創建 AWS 帳戶」。
+
+### 2. 選擇您的區域
+
+選擇最接近您用戶的 AWS 區域以獲得最佳性能。熱門區域包括：
+- 美國東部（維吉尼亞北部）
+- 美國西部（俄勒岡）
+- 歐洲（愛爾蘭）
+- 亞太地區（新加坡）
+
+### 3. 設置帳單提醒
+
+配置帳單提醒以監控您的支出並避免意外費用。
+
+## 基本 AWS 服務
+
+### 計算服務
+- **EC2**：雲端中的虛擬伺服器
+- **Lambda**：無伺服器計算服務
+- **ECS**：容器管理服務
+
+### 儲存服務
+- **S3**：物件儲存服務
+- **EBS**：EC2 實例的塊儲存
+- **EFS**：託管檔案系統
+
+### 資料庫服務
+- **RDS**：託管關聯式資料庫
+- **DynamoDB**：NoSQL 資料庫服務
+- **ElastiCache**：記憶體快取服務
+
+## 安全最佳實踐
+
+1. 啟用多因素身份驗證 (MFA)
+2. 使用 IAM 角色和策略
+3. 啟用 CloudTrail 進行審計日誌記錄
+4. 正確配置 VPC 安全群組
+
+## 成本優化技巧
+
+- 為可預測的工作負載使用保留實例
+- 實施自動擴展策略
+- 使用 AWS Cost Explorer 監控使用情況
+- 為靈活的工作負載使用 Spot 實例
+
+## 下一步
+
+完成基本設置後，考慮探索：
+- AWS 良好架構框架
+- 使用 CloudFormation 進行基礎設施即程式碼
+- 使用 CloudWatch 進行監控
+- 使用 AWS Security Hub 進行安全
+
+我們的平台通過增強的安全性和性能優化提供對 AWS 服務的無縫訪問。
--- a/content/zh-hant/blog/cloud-security.md
+++ b/content/zh-hant/blog/cloud-security.md
@ -0,0 +1,129 @@
+---
+title: "雲端安全最佳實踐"
+description: "保護您的雲端基礎設施和資料的基本安全措施"
+date: "2024-01-25"
+slug: "cloud-security"
+locale: "zh-hant"
+---
+
+# 雲端安全最佳實踐
+
+雲端安全是您和雲端提供商之間的共同責任。本綜合指南涵蓋保護雲端基礎設施的基本安全實踐。
+
+## 理解共同責任模型
+
+### 雲端提供商責任
+- 資料中心的實體安全
+- 硬體和軟體基礎設施
+- 網路和主機作業系統
+
+### 您的責任
+- 資料加密和存取控制
+- 應用程式安全
+- 身份和存取管理
+- 網路安全配置
+
+## 基本安全措施
+
+### 1. 身份和存取管理 (IAM)
+
+**多因素身份驗證 (MFA)**
+- 為所有用戶帳戶啟用 MFA
+- 為高權限帳戶使用硬體令牌
+- 實施條件存取策略
+
+**最小權限原則**
+- 授予最小必要權限
+- 定期存取審查和審計
+- 使用基於角色的存取控制 (RBAC)
+
+### 2. 資料保護
+
+**靜態加密**
+- 為所有儲存服務啟用加密
+- 盡可能使用客戶管理的金鑰
+- 實施金鑰輪換策略
+
+**傳輸中加密**
+- 對所有通訊使用 TLS 1.2 或更高版本
+- 實施憑證管理
+- 對敏感資料使用 VPN 或私有連接
+
+### 3. 網路安全
+
+**虛擬私有雲 (VPC)**
+- 在私有子網路中隔離資源
+- 使用網路存取控制清單 (NACLs)
+- 正確實施安全群組
+
+**防火牆配置**
+- 阻止不必要的埠和協定
+- 使用應用程式級防火牆
+- 定期審查安全規則
+
+## 監控和合規
+
+### 安全監控
+- 實施持續監控
+- 使用安全資訊和事件管理 (SIEM)
+- 設置自動威脅檢測
+
+### 合規框架
+- SOC 2 Type II
+- ISO 27001
+- PCI DSS（用於支付處理）
+- GDPR（用於歐盟資料）
+
+## 事件回應規劃
+
+### 準備
+- 制定事件回應程序
+- 培訓您的安全團隊
+- 維護更新的聯絡人清單
+
+### 檢測和分析
+- 即時監控安全事件
+- 使用自動威脅檢測
+- 實施日誌分析工具
+
+### 回應和恢復
+- 隔離受影響的系統
+- 為分析保留證據
+- 與利益相關者溝通
+- 安全地恢復服務
+
+## 雲端提供商安全功能
+
+### AWS 安全
+- AWS Security Hub
+- AWS GuardDuty
+- AWS Config
+- AWS CloudTrail
+
+### Azure 安全
+- Azure Security Center
+- Azure Sentinel
+- Azure Policy
+- Azure Monitor
+
+### Google Cloud 安全
+- Security Command Center
+- Cloud Security Scanner
+- Cloud Asset Inventory
+- Cloud Audit Logs
+
+## 最佳實踐總結
+
+1. **始終加密敏感資料**
+2. **實施強存取控制**
+3. **監控和審計一切**
+4. **保持系統更新**
+5. **定期培訓您的團隊**
+6. **制定回應計劃**
+7. **測試您的安全措施**
+
+## 結論
+
+雲端安全需要主動方法和持續關注。通過實施這些最佳實踐並了解新興威脅，您可以顯著降低安全風險並保護您寶貴的資料和應用程式。
+
+記住，安全不是一次性設置，而是隨著您的業務和威脅環境而發展的持續過程。
--- a/content/zh-hant/blog/getting-started.md
+++ b/content/zh-hant/blog/getting-started.md
@ -0,0 +1,27 @@
+---
+title: "雲端服務入門指南"
+description: "了解如何為您的業務需求選擇合適的雲端服務提供商"
+date: "2024-01-15"
+slug: "getting-started"
+locale: "zh-hant"
+---
+
+# 雲端服務入門指南
+
+雲端運算已經徹底改變了企業的營運方式，為各種規模的公司提供了可擴展、經濟高效的解決方案。本指南將幫助您了解雲端服務的基礎知識以及如何選擇合適的提供商。
+
+## 什麼是雲端運算？
+
+雲端運算通過互聯網（"雲"）提供運算服務——包括伺服器、儲存、資料庫、網路、軟體、分析和智能——以提供更快的創新、靈活的資源和規模經濟。
+
+## 選擇合適的提供商
+
+在選擇雲端提供商時，請考慮以下因素：
+
+- **性能和可靠性**
+- **安全功能**
+- **定價結構**
+- **地理覆蓋**
+- **支援品質**
+
+我們的平台讓您可以通過單一介面輕鬆比較和訪問多個雲端提供商。
--- a/i18n.config.ts
+++ b/i18n.config.ts
@ -0,0 +1,21 @@
+export default defineI18nConfig(() => ({
+  legacy: false,
+  locale: 'en',
+  fallbackLocale: 'en',
+  messages: {
+    en: {
+      blog: { description: 'Latest insights and guides on cloud services' }
+    },
+    'zh-hans': {
+      blog: { description: '云服务最新洞察和指南' }
+    },
+    'zh-hant': {
+      blog: { description: '雲端服務最新洞察和指南' }
+    },
+    zh: {
+      blog: { description: '云服务最新洞察和指南' }
+    }
+  }
+}))
+
+
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@ -0,0 +1,62 @@
+{
+  "nav": {
+    "home": "Home",
+    "about": "About",
+    "blog": "Blog",
+    "news": "News",
+    "contact": "Contact"
+  },
+  "hero": {
+    "title": "Professional Cloud Service Solutions",
+    "subtitle": "Connect to world-class cloud providers with ease and reliability",
+    "cta": "Explore Services"
+  },
+  "services": {
+    "title": "Cloud Providers",
+    "aws": {
+      "title": "Amazon Web Services",
+      "description": "Industry-leading cloud platform with comprehensive services"
+    },
+    "alibaba": {
+      "title": "Alibaba Cloud International",
+      "description": "Global cloud computing services from China's tech giant"
+    },
+    "tencent": {
+      "title": "Tencent Cloud",
+      "description": "Reliable cloud infrastructure for businesses worldwide"
+    }
+  },
+  "contact": {
+    "title": "Contact Us",
+    "telegram": "Telegram",
+    "whatsapp": "WhatsApp",
+    "username": "{'@'}pinnovatecloud",
+    "phone": "+1 9174029875"
+  },
+  "footer": {
+    "description": "Your trusted partner for cloud service solutions",
+    "rights": "All rights reserved."
+  },
+  "blog": {
+    "title": "Blog",
+    "description": "Latest insights and guides on cloud services",
+    "readMore": "Read More",
+    "backToBlog": "Back to Blog"
+  },
+  "errors": {
+    "404": {
+      "title": "Page Not Found",
+      "message": "The page you're looking for doesn't exist.",
+      "translation": "Translation Missing",
+      "translationMessage": "This article is not available in the selected language.",
+      "backHome": "Back to Home"
+    }
+  },
+  "seo": {
+    "title": "ClueFlare - Professional Cloud Service Proxy",
+    "description": "Connect to AWS, Alibaba Cloud, Tencent Cloud and more through our reliable proxy services.",
+    "keywords": "cloud services, AWS proxy, Alibaba Cloud, Tencent Cloud, cloud computing"
+  }
+}
+
+
--- a/i18n/locales/zh-hans.json
+++ b/i18n/locales/zh-hans.json
@ -0,0 +1,62 @@
+{
+  "nav": {
+    "home": "首页",
+    "about": "关于",
+    "blog": "博客",
+    "news": "资讯",
+    "contact": "联系我们"
+  },
+  "hero": {
+    "title": "专业云服务解决方案",
+    "subtitle": "轻松可靠地连接世界级云服务提供商",
+    "cta": "探索服务"
+  },
+  "services": {
+    "title": "云服务提供商",
+    "aws": {
+      "title": "亚马逊云服务",
+      "description": "行业领先的综合云平台服务"
+    },
+    "alibaba": {
+      "title": "阿里云国际",
+      "description": "来自中国科技巨头的全球云计算服务"
+    },
+    "tencent": {
+      "title": "腾讯云",
+      "description": "为全球企业提供可靠的云基础设施"
+    }
+  },
+  "contact": {
+    "title": "联系我们",
+    "telegram": "Telegram",
+    "whatsapp": "WhatsApp",
+    "username": "{'@'}pinnovatecloud",
+    "phone": "+1 9174029875"
+  },
+  "footer": {
+    "description": "您可信赖的云服务解决方案合作伙伴",
+    "rights": "版权所有。"
+  },
+  "blog": {
+    "title": "博客",
+    "description": "云服务最新洞察和指南",
+    "readMore": "阅读更多",
+    "backToBlog": "返回博客"
+  },
+  "errors": {
+    "404": {
+      "title": "页面未找到",
+      "message": "您要查找的页面不存在。",
+      "translation": "翻译缺失",
+      "translationMessage": "此文章没有所选语言的版本。",
+      "backHome": "返回首页"
+    }
+  },
+  "seo": {
+    "title": "ClueFlare - 专业云服务代理平台",
+    "description": "通过我们可靠的代理服务连接AWS、阿里云、腾讯云等云服务商。",
+    "keywords": "云服务, AWS代理, 阿里云, 腾讯云, 云计算"
+  }
+}
+
+
--- a/i18n/locales/zh-hant.json
+++ b/i18n/locales/zh-hant.json
@ -0,0 +1,62 @@
+{
+  "nav": {
+    "home": "首頁",
+    "about": "關於",
+    "blog": "部落格",
+    "news": "資訊",
+    "contact": "聯絡我們"
+  },
+  "hero": {
+    "title": "專業雲端服務解決方案",
+    "subtitle": "輕鬆可靠地連接世界級雲端服務提供商",
+    "cta": "探索服務"
+  },
+  "services": {
+    "title": "雲端服務提供商",
+    "aws": {
+      "title": "亞馬遜雲端服務",
+      "description": "業界領先的綜合雲端平台服務"
+    },
+    "alibaba": {
+      "title": "阿里雲國際",
+      "description": "來自中國科技巨頭的全球雲端運算服務"
+    },
+    "tencent": {
+      "title": "騰訊雲",
+      "description": "為全球企業提供可靠的雲端基礎設施"
+    }
+  },
+  "contact": {
+    "title": "聯絡我們",
+    "telegram": "Telegram",
+    "whatsapp": "WhatsApp",
+    "username": "{'@'}pinnovatecloud",
+    "phone": "+1 9174029875"
+  },
+  "footer": {
+    "description": "您可信賴的雲端服務解決方案合作夥伴",
+    "rights": "版權所有。"
+  },
+  "blog": {
+    "title": "部落格",
+    "description": "雲端服務最新洞察和指南",
+    "readMore": "閱讀更多",
+    "backToBlog": "返回部落格"
+  },
+  "errors": {
+    "404": {
+      "title": "頁面未找到",
+      "message": "您要查找的頁面不存在。",
+      "translation": "翻譯缺失",
+      "translationMessage": "此文章沒有所選語言的版本。",
+      "backHome": "返回首頁"
+    }
+  },
+  "seo": {
+    "title": "ClueFlare - 專業雲端服務代理平台",
+    "description": "透過我們可靠的代理服務連接AWS、阿里雲、騰訊雲等雲端服務商。",
+    "keywords": "雲端服務, AWS代理, 阿里雲, 騰訊雲, 雲端運算"
+  }
+}
+
+
--- a/layouts/default.vue
+++ b/layouts/default.vue
@ -0,0 +1,36 @@
+<template>
+  <div class="min-h-screen bg-gray-50 flex flex-col">
+    <Header />
+    <main class="pt-16 flex-1">
+      <slot />
+    </main>
+    <Footer />
+  </div>
+  </template>
+
+<script setup>
+import Header from '~/components/Header.vue'
+import Footer from '~/components/Footer.vue'
+import { useI18n } from 'vue-i18n'
+
+
+const { t, locale } = useI18n()
+
+useSeoMeta({
+  title: () => t('seo.title'),
+  ogTitle: () => t('seo.title'),
+  description: () => t('seo.description'),
+  ogDescription: () => t('seo.description'),
+  keywords: () => t('seo.keywords'),
+  ogImage: '/logo.svg',
+  twitterCard: 'summary_large_image'
+})
+
+useHead({
+  htmlAttrs: {
+    lang: locale
+  }
+})
+</script>
+
+
--- a/locales/en.json
+++ b/locales/en.json
@ -0,0 +1,12 @@
+{
+  "nav": {"home": "Home","about": "About","blog": "Blog","news": "News","contact": "Contact"},
+  "hero": {"title": "Professional Cloud Service Solutions","subtitle": "Connect to world-class cloud providers with ease and reliability","cta": "Explore Services"},
+  "services": {"title": "Cloud Providers","aws": {"title": "Amazon Web Services","description": "Industry-leading cloud platform with comprehensive services"},"alibaba": {"title": "Alibaba Cloud International","description": "Global cloud computing services from China's tech giant"},"tencent": {"title": "Tencent Cloud","description": "Reliable cloud infrastructure for businesses worldwide"}},
+  "contact": {"title": "Contact Us","telegram": "Telegram","whatsapp": "WhatsApp","username": "@pinnovatecloud","phone": "+1 9174029875"},
+  "footer": {"description": "Your trusted partner for cloud service solutions","rights": "All rights reserved."},
+  "blog": {"title": "Blog","description": "Latest insights and guides on cloud services","readMore": "Read More","backToBlog": "Back to Blog"},
+  "errors": {"404": {"title": "Page Not Found","message": "The page you're looking for doesn't exist.","translation": "Translation Missing","translationMessage": "This article is not available in the selected language.","backHome": "Back to Home"}},
+  "seo": {"title": "ClueFlare - Professional Cloud Service Proxy","description": "Connect to AWS, Alibaba Cloud, Tencent Cloud and more through our reliable proxy services.","keywords": "cloud services, AWS proxy, Alibaba Cloud, Tencent Cloud, cloud computing"}
+}
+
+
--- a/locales/zh-hans.json
+++ b/locales/zh-hans.json
@ -0,0 +1,12 @@
+{
+  "nav": {"home": "首页","about": "关于","blog": "博客","news": "资讯","contact": "联系我们"},
+  "hero": {"title": "专业云服务解决方案","subtitle": "轻松可靠地连接世界级云服务提供商","cta": "探索服务"},
+  "services": {"title": "云服务提供商","aws": {"title": "亚马逊云服务","description": "行业领先的综合云平台服务"},"alibaba": {"title": "阿里云国际","description": "来自中国科技巨头的全球云计算服务"},"tencent": {"title": "腾讯云","description": "为全球企业提供可靠的云基础设施"}},
+  "contact": {"title": "联系我们","telegram": "Telegram","whatsapp": "WhatsApp","username": "@pinnovatecloud","phone": "+1 9174029875"},
+  "footer": {"description": "您可信赖的云服务解决方案合作伙伴","rights": "版权所有。"},
+  "blog": {"title": "博客","description": "云服务最新洞察和指南","readMore": "阅读更多","backToBlog": "返回博客"},
+  "errors": {"404": {"title": "页面未找到","message": "您要查找的页面不存在。","translation": "翻译缺失","translationMessage": "此文章没有所选语言的版本。","backHome": "返回首页"}},
+  "seo": {"title": "ClueFlare - 专业云服务代理平台","description": "通过我们可靠的代理服务连接AWS、阿里云、腾讯云等云服务商。","keywords": "云服务, AWS代理, 阿里云, 腾讯云, 云计算"}
+}
+
+
--- a/locales/zh-hant.json
+++ b/locales/zh-hant.json
@ -0,0 +1,12 @@
+{
+  "nav": {"home": "首頁","about": "關於","blog": "部落格","news": "資訊","contact": "聯絡我們"},
+  "hero": {"title": "專業雲端服務解決方案","subtitle": "輕鬆可靠地連接世界級雲端服務提供商","cta": "探索服務"},
+  "services": {"title": "雲端服務提供商","aws": {"title": "亞馬遜雲端服務","description": "業界領先的綜合雲端平台服務"},"alibaba": {"title": "阿里雲國際","description": "來自中國科技巨頭的全球雲端運算服務"},"tencent": {"title": "騰訊雲","description": "為全球企業提供可靠的雲端基礎設施"}},
+  "contact": {"title": "聯絡我們","telegram": "Telegram","whatsapp": "WhatsApp","username": "@pinnovatecloud","phone": "+1 9174029875"},
+  "footer": {"description": "您可信賴的雲端服務解決方案合作夥伴","rights": "版權所有。"},
+  "blog": {"title": "部落格","description": "雲端服務最新洞察和指南","readMore": "閱讀更多","backToBlog": "返回部落格"},
+  "errors": {"404": {"title": "頁面未找到","message": "您要查找的頁面不存在。","translation": "翻譯缺失","translationMessage": "此文章沒有所選語言的版本。","backHome": "返回首頁"}},
+  "seo": {"title": "ClueFlare - 專業雲端服務代理平台","description": "透過我們可靠的代理服務連接AWS、阿里雲、騰訊雲等雲端服務商。","keywords": "雲端服務, AWS代理, 阿里雲, 騰訊雲, 雲端運算"}
+}
+
+
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@ -0,0 +1,70 @@
+export default defineNuxtConfig({
+  compatibilityDate: '2025-09-05',
+  devtools: { enabled: true },
+  modules: [
+    '@nuxtjs/tailwindcss',
+    '@nuxt/content',
+    '@nuxtjs/i18n',
+    '@nuxtjs/seo'
+  ],
+  site: {
+    url: 'http://clueflare.com',
+    name: 'ClueFlare',
+    description: 'Professional Cloud Service Proxy Platform',
+    defaultLocale: 'en'
+  },
+  i18n: {
+    locales: [
+      { code: 'en', language: 'en-US', name: 'English', file: 'en.json' },
+      { code: 'zh-hans', language: 'zh-CN', name: '简体中文', file: 'zh-hans.json' },
+      { code: 'zh-hant', language: 'zh-TW', name: '繁體中文', file: 'zh-hant.json' }
+    ],
+    langDir: 'locales/',
+    defaultLocale: 'en',
+    strategy: 'prefix',
+    detectBrowserLanguage: {
+      useCookie: true,
+      cookieKey: 'i18n_redirected',
+      redirectOn: 'root'
+    },
+    vueI18n: './i18n.config.ts'
+  },
+  content: {
+    // 移除 locales 配置，让 Content 模块自动检测
+  },
+  experimental: {
+    scanPageMeta: false   // 关闭静态属性预扫描
+  },
+  nitro: {
+    prerender: {
+      routes: ['/sitemap.xml', '/robots.txt']
+    }
+  },
+  css: ['~/assets/css/main.css'],
+  vite: {
+    server: {
+      hmr: {
+        overlay: false
+      }
+    }
+  },
+  app: {
+    head: {
+      charset: 'utf-8',
+      viewport: 'width=device-width, initial-scale=1',
+      link: [
+        { rel: 'icon', type: 'image/svg+xml', href: '/favicon.svg' },
+        { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
+        { rel: 'apple-touch-icon', href: '/favicon.svg' }
+      ],
+      script: [
+        {
+          id: 'chatway',
+          src: 'https://cdn.chatway.app/widget.js?id=FgIgGSxRD2i8',
+          async: true
+        }
+      ]
+    }
+  }
+})
+
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,26 @@
+{
+  "name": "nuxt-app",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "build": "nuxt prepare && nuxt build",
+    "dev": "nuxt prepare && nuxt dev",
+    "generate": "nuxt prepare && nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
+  },
+  "dependencies": {
+    "@nuxt/content": "^3.6.3",
+    "@nuxtjs/i18n": "^10.0.6",
+    "@nuxtjs/seo": "^3.1.0",
+    "@vueuse/nuxt": "^13.9.0",
+    "better-sqlite3": "^12.2.0",
+    "nuxt": "^4.1.1",
+    "vue": "^3.5.20",
+    "vue-router": "^4.5.1"
+  },
+  "devDependencies": {
+    "@nuxt/devtools": "^2.6.3",
+    "@nuxtjs/tailwindcss": "^6.14.0"
+  }
+}
--- a/pages/404.vue
+++ b/pages/404.vue
@ -0,0 +1,25 @@
+<template>
+  <div class="min-h-screen flex items-center justify-center bg-gray-50">
+    <div class="text-center">
+      <div class="mb-8">
+        <h1 class="text-9xl font-bold text-gray-300">404</h1>
+        <h2 class="text-2xl font-semibold text-gray-900 mb-4">{{ t('errors.404.title') }}</h2>
+        <p class="text-gray-600 mb-8">{{ t('errors.404.message') }}</p>
+      </div>
+      
+      <NuxtLink 
+        :to="localePath('/')"
+        class="inline-block bg-blue-600 text-white px-6 py-3 rounded-lg hover:bg-blue-700 transition-colors"
+      >
+        {{ t('errors.404.backHome') }}
+      </NuxtLink>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const { t } = useI18n()
+const localePath = useLocalePath()
+</script>
+
+
--- a/pages/about.vue
+++ b/pages/about.vue
@ -0,0 +1,26 @@
+<template>
+  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
+    <h1 class="text-4xl font-bold text-gray-900 mb-8">{{ t('nav.about') }}</h1>
+    
+    <div class="prose prose-lg max-w-none">
+      <h2>About ClueFlare</h2>
+      <p>ClueFlare is your trusted partner for cloud service solutions, providing seamless access to world-class cloud providers including AWS, Alibaba Cloud, Tencent Cloud, and more.</p>
+      
+      <h3>Our Mission</h3>
+      <p>We simplify cloud computing by offering reliable proxy services that connect businesses to the best cloud infrastructure providers worldwide.</p>
+      
+      <h3>Why Choose Us?</h3>
+      <ul>
+        <li>Professional cloud service expertise</li>
+        <li>Multi-provider support</li>
+        <li>24/7 customer support</li>
+        <li>Competitive pricing</li>
+        <li>Easy integration</li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const { t } = useI18n()
+</script>
--- a/pages/blog/[slug].vue
+++ b/pages/blog/[slug].vue
@ -0,0 +1,67 @@
+<template>
+  <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
+    <div v-if="post" class="prose prose-lg max-w-none">
+      <div class="mb-8">
+        <h1 class="text-4xl font-bold text-gray-900 mb-4">{{ post.title }}</h1>
+        <div class="flex items-center justify-between text-gray-600 mb-6">
+          <time>{{ formatDate(post.date) }}</time>
+          <LanguageSwitcher />
+        </div>
+      </div>
+      
+      <ContentRenderer v-if="post" :value="post" />
+    </div>
+    
+    <div v-else class="text-center py-20">
+      <h1 class="text-2xl font-bold text-gray-900 mb-4">{{ t('errors.404.translation') }}</h1>
+      <p class="text-gray-600 mb-6">{{ t('errors.404.translationMessage') }}</p>
+      <NuxtLink 
+        :to="localePath('/blog')"
+        class="inline-block bg-blue-600 text-white px-6 py-3 rounded-lg hover:bg-blue-700 transition-colors"
+      >
+        {{ t('blog.backToBlog') }}
+      </NuxtLink>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const { t, locale } = useI18n()
+const route = useRoute()
+const localePath = useLocalePath()
+// console.log(locale.value)
+// const { data: post } = await useAsyncData(
+//   () => `blog-item-${locale.value}-${route.params.slug}`,
+//   async () => {
+//    return await queryCollection('blog').where('path', '=', route.path ).first()
+//   },{ watch: [locale], }
+// )
+console.log(route.path)
+const { data: post } = await useAsyncData(
+  `blog-item-${locale.value}-${route.params.slug}`,
+  async () => {
+    const localizedPath = localePath(`/blog/${route.params.slug}`)
+    return await queryCollection('blog').where('path', '=', localizedPath).first()
+  },
+  { watch: [locale] }
+)
+
+const formatDate = (date) => {
+  return new Date(date).toLocaleDateString(locale.value, {
+    year: 'numeric',
+    month: 'long',
+    day: 'numeric'
+  })
+}
+
+if (post) {
+  useSeoMeta({
+    title: post.title,
+    description: post.description,
+    ogTitle: post.title,
+    ogDescription: post.description
+  })
+}
+</script>
+
+
--- a/pages/blog/index.vue
+++ b/pages/blog/index.vue
@ -0,0 +1,69 @@
+<template>
+  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
+    <h1 class="text-4xl font-bold text-gray-900 mb-8">{{ t('blog.title') }}</h1>
+    
+    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+      <article 
+        v-for="blog in blog" 
+        :key="blog.path"
+        class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow"
+      >
+        <div class="p-6">
+          <h2 class="text-xl font-semibold mb-3">
+            <NuxtLink 
+              :to="blog.path"
+              class="hover:text-blue-600 transition-colors"
+            >
+              {{ blog.title }}
+            </NuxtLink>
+          </h2>
+          <p class="text-gray-600 mb-4">{{ blog.description }}</p>
+          <div class="flex justify-between items-center text-sm text-gray-500">
+            <time>{{ formatDate(blog.date) }}</time>
+            <NuxtLink 
+              :to="blog.path"
+              class="text-blue-600 hover:text-blue-700 font-medium"
+            >
+              {{ t('blog.readMore') }} →
+            </NuxtLink>
+          </div>
+        </div>
+      </article>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const { t, locale } = useI18n()
+const { data: blog } = await useAsyncData('blog', async () => 
+{
+  return await queryCollection('blog').where('locale', '=', locale.value).all()
+}, {
+  watch: [locale], // Refetch when locale changes
+})
+
+
+const formatDate = (date) => {
+  if (!date) return ''
+  let d = new Date(date)
+  if (Number.isNaN(d.getTime()) && typeof date === 'string') {
+    // 兼容 YYYY-MM-DD 等未带时区的日期
+    d = new Date(`${date}T00:00:00Z`)
+  }
+  if (Number.isNaN(d.getTime())) return ''
+  return d.toLocaleDateString(locale.value, {
+    year: 'numeric',
+    month: 'long',
+    day: 'numeric'
+  })
+}
+
+if (blog) {
+  useSeoMeta({
+    title: t('blog.title'),
+    description: t('blog.description'),
+  })
+}
+</script>
+
+
--- a/pages/contact.vue
+++ b/pages/contact.vue
@ -0,0 +1,42 @@
+<template>
+  <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
+    <h1 class="text-4xl font-bold text-gray-900 mb-8 text-center">{{ t('contact.title') }}</h1>
+    
+    <div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
+      <div>
+        <h2 class="text-2xl font-semibold mb-6">Get in Touch</h2>
+        <div class="space-y-4">
+          <div class="flex items-center space-x-3">
+            <svg class="w-6 h-6 text-blue-600" fill="currentColor" viewBox="0 0 24 24">
+              <path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/>
+            </svg>
+            <div>
+              <p class="font-medium">{{ t('contact.telegram') }}</p>
+              <p class="text-gray-600">{{ t('contact.username') }}</p>
+            </div>
+          </div>
+          
+          <div class="flex items-center space-x-3">
+            <svg class="w-6 h-6 text-green-600" fill="currentColor" viewBox="0 0 24 24">
+              <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347"/>
+            </svg>
+            <div>
+              <p class="font-medium">{{ t('contact.whatsapp') }}</p>
+              <p class="text-gray-600">{{ t('contact.phone') }}</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      
+      <div>
+        <ContactForm />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const { t } = useI18n()
+</script>
+
+
--- a/pages/index.vue
+++ b/pages/index.vue
@ -0,0 +1,66 @@
+<template>
+  <div>
+    <section class="bg-gradient-to-br from-blue-50 to-indigo-100 py-20">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h1 class="text-4xl md:text-6xl font-bold text-gray-900 mb-6">
+          {{ t('hero.title') }}
+        </h1>
+        <p class="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
+          {{ t('hero.subtitle') }}
+        </p>
+        <NuxtLink 
+          :to="localePath('/about')"
+          class="inline-block bg-blue-600 text-white px-8 py-3 rounded-lg text-lg font-semibold hover:bg-blue-700 transition-colors"
+        >
+          {{ t('hero.cta') }}
+        </NuxtLink>
+      </div>
+    </section>
+
+    <section class="py-20">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <h2 class="text-3xl font-bold text-center text-gray-900 mb-12">
+          {{ t('services.title') }}
+        </h2>
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+          <div class="bg-white p-8 rounded-lg shadow-md border hover:shadow-lg transition-shadow">
+            <div class="w-12 h-12 bg-orange-500 rounded-lg mb-4 flex items-center justify-center">
+              <svg class="w-6 h-6 text-white" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
+              </svg>
+            </div>
+            <h3 class="text-xl font-semibold mb-3">{{ t('services.aws.title') }}</h3>
+            <p class="text-gray-600">{{ t('services.aws.description') }}</p>
+          </div>
+
+          <div class="bg-white p-8 rounded-lg shadow-md border hover:shadow-lg transition-shadow">
+            <div class="w-12 h-12 bg-blue-500 rounded-lg mb-4 flex items-center justify-center">
+              <svg class="w-6 h-6 text-white" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
+              </svg>
+            </div>
+            <h3 class="text-xl font-semibold mb-3">{{ t('services.alibaba.title') }}</h3>
+            <p class="text-gray-600">{{ t('services.alibaba.description') }}</p>
+          </div>
+
+          <div class="bg-white p-8 rounded-lg shadow-md border hover:shadow-lg transition-shadow">
+            <div class="w-12 h-12 bg-green-500 rounded-lg mb-4 flex items-center justify-center">
+              <svg class="w-6 h-6 text-white" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
+              </svg>
+            </div>
+            <h3 class="text-xl font-semibold mb-3">{{ t('services.tencent.title') }}</h3>
+            <p class="text-gray-600">{{ t('services.tencent.description') }}</p>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</template>
+
+<script setup>
+const { t } = useI18n()
+const localePath = useLocalePath()
+</script>
+
+
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/favicon.svg
+++ b/public/favicon.svg
@ -0,0 +1,6 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect width="32" height="32" rx="8" fill="#2563EB"/>
+  <path d="M16 6C19.866 6 23 9.134 23 13C23 16.866 19.866 20 16 20C12.134 20 9 16.866 9 13C9 9.134 12.134 6 16 6Z" fill="white"/>
+  <circle cx="16" cy="25" r="3" fill="white"/>
+  <path d="M13 17L16 20L19 17" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/public/favicon.txt
+++ b/public/favicon.txt
@ -0,0 +1,18 @@
+Favicon转换指导：
+
+1. 使用在线工具将 public/logo.svg 转换为 favicon.ico：
+   - 访问 https://realfavicongenerator.net/
+   - 上传 public/logo.svg 文件
+   - 选择生成 16x16 和 32x32 像素的 ICO 格式
+   - 下载生成的 favicon.ico 文件
+   - 替换当前的 public/favicon.ico
+
+2. 或者使用其他在线转换工具：
+   - https://convertio.co/svg-ico/
+   - https://www.favicon-generator.org/
+
+3. 当前已配置：
+   - public/favicon.svg (SVG格式，现代浏览器支持)
+   - nuxt.config.ts 中已添加 favicon 链接配置
+
+
--- a/public/logo.svg
+++ b/public/logo.svg
@ -0,0 +1,8 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect width="32" height="32" rx="8" fill="#2563EB"/>
+  <path d="M16 6C19.866 6 23 9.134 23 13C23 16.866 19.866 20 16 20C12.134 20 9 16.866 9 13C9 9.134 12.134 6 16 6Z" fill="white"/>
+  <circle cx="16" cy="25" r="3" fill="white"/>
+  <path d="M13 17L16 20L19 17" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
+
+
--- a/tailwind.config.js
+++ b/tailwind.config.js
@ -0,0 +1,18 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    './app.vue',
+    './components/**/*.{vue,js,ts}',
+    './layouts/**/*.{vue,js,ts}',
+    './pages/**/*.{vue,js,ts}',
+    './plugins/**/*.{js,ts}',
+    './nuxt.config.{js,ts}'
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}
+
+
+
--- a/tsconfig.json
+++ b/tsconfig.json
@ -0,0 +1,18 @@
+{
+  // https://nuxt.com/docs/guide/concepts/typescript
+  "files": [],
+  "references": [
+    {
+      "path": "./.nuxt/tsconfig.app.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.server.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.shared.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.node.json"
+    }
+  ]
+}