Initial commit - Deal Plus Tech Astro Website
✅ 53 pages (34 products + corporate) ✅ All logo images ✅ Nginx Dockerfile (production-ready) ✅ PDPA compliant (cookie consent) ✅ Modern design with Kanit font ✅ Line + Phone buttons on products Built: 2026-03-13
This commit is contained in:
Kunthawat Greethong
271
DEPLOYMENT.md
Normal file
271
DEPLOYMENT.md
Normal file
@@ -0,0 +1,271 @@
|
||||
# Deployment Guide - Deal Plus Tech Astro Website
|
||||
|
||||
## 📋 Pre-Deployment Checklist
|
||||
|
||||
- [ ] All pages build successfully (`npm run build`)
|
||||
- [ ] Images copied to `public/images/`
|
||||
- [ ] Environment variables configured
|
||||
- [ ] Umami Analytics set up
|
||||
- [ ] Admin password changed from default
|
||||
- [ ] Cookie consent tested
|
||||
- [ ] Mobile responsiveness verified
|
||||
- [ ] SEO meta tags on all pages
|
||||
|
||||
## 🚀 Deployment Steps
|
||||
|
||||
### Step 1: Initialize Git Repository
|
||||
|
||||
```bash
|
||||
cd dealplustech-astro
|
||||
git init
|
||||
git add .
|
||||
git commit -m "Initial commit - Deal Plus Tech migration to Astro"
|
||||
```
|
||||
|
||||
### Step 2: Push to Gitea
|
||||
|
||||
```bash
|
||||
# Add remote (replace with your actual Gitea URL)
|
||||
git remote add origin https://git.moreminimore.com/{username}/dealplustech-astro.git
|
||||
|
||||
# Push to main
|
||||
git push -u origin main
|
||||
```
|
||||
|
||||
### Step 3: Deploy on Easypanel
|
||||
|
||||
1. **Login to Easypanel**: https://panelwebsite.moreminimore.com
|
||||
|
||||
2. **Create New Project**:
|
||||
- Project Name: `dealplustech`
|
||||
- Click "Create Project"
|
||||
|
||||
3. **Create New Service**:
|
||||
- Service Name: `dealplustech-astro`
|
||||
- Select "Git Repository"
|
||||
- Repository: `dealplustech-astro`
|
||||
- Branch: `main`
|
||||
|
||||
4. **Configure Build**:
|
||||
- Build Command: `npm run build`
|
||||
- Output Directory: `dist`
|
||||
- Port: `80`
|
||||
- Node Version: `20`
|
||||
|
||||
5. **Environment Variables**:
|
||||
```
|
||||
UMAMI_WEBSITE_ID=xxx-xxx-xxx
|
||||
ADMIN_PASSWORD=YourSecurePassword123!
|
||||
NODE_ENV=production
|
||||
```
|
||||
|
||||
6. **Deploy**:
|
||||
- Click "Deploy"
|
||||
- Wait for build to complete (~2-3 minutes)
|
||||
- Check deployment status
|
||||
|
||||
### Step 4: Verify Deployment
|
||||
|
||||
1. **Check Website**:
|
||||
- Visit your Easypanel URL
|
||||
- Test homepage
|
||||
- Test product pages (Thai URLs)
|
||||
- Test contact page
|
||||
|
||||
2. **Test Cookie Consent**:
|
||||
- Clear browser cookies
|
||||
- Reload page
|
||||
- Verify consent banner appears
|
||||
- Test accept/reject buttons
|
||||
|
||||
3. **Test Analytics**:
|
||||
- Accept analytics cookies
|
||||
- Check Umami dashboard for visits
|
||||
|
||||
4. **Mobile Testing**:
|
||||
- Test on mobile device
|
||||
- Verify responsive design
|
||||
- Check navigation menu
|
||||
|
||||
## 🔄 Auto-Deploy Workflow
|
||||
|
||||
Easypanel auto-deploys on every push to `main` branch:
|
||||
|
||||
```bash
|
||||
# Make changes
|
||||
git add .
|
||||
git commit -m "Update product page"
|
||||
git push
|
||||
|
||||
# Easypanel automatically:
|
||||
# 1. Detects push
|
||||
# 2. Runs npm install
|
||||
# 3. Runs npm run build
|
||||
# 4. Deploys new version
|
||||
# 5. Shows deployment status
|
||||
```
|
||||
|
||||
## 📊 Monitoring
|
||||
|
||||
### Deployment Status
|
||||
|
||||
Check Easypanel dashboard for:
|
||||
- Build logs
|
||||
- Deployment status
|
||||
- Resource usage
|
||||
- Error logs
|
||||
|
||||
### Analytics
|
||||
|
||||
Check Umami dashboard at: `https://analytics.dealplustech.co.th`
|
||||
|
||||
- Real-time visitors
|
||||
- Page views
|
||||
- Referrer sources
|
||||
- Device breakdown
|
||||
|
||||
### Consent Logs
|
||||
|
||||
Access consent logs: `https://dealplustech.co.th/admin/consent-logs`
|
||||
|
||||
- Login with `ADMIN_PASSWORD`
|
||||
- View all consent records
|
||||
- Export to CSV
|
||||
- Delete records (right to be forgotten)
|
||||
|
||||
## 🛠️ Maintenance
|
||||
|
||||
### Update Content
|
||||
|
||||
1. **Edit Markdown/Files**:
|
||||
- Blog posts: `src/content/blog/`
|
||||
- Product pages: `src/pages/[url]/index.astro`
|
||||
|
||||
2. **Commit and Push**:
|
||||
```bash
|
||||
git add .
|
||||
git commit -m "Update content"
|
||||
git push
|
||||
```
|
||||
|
||||
3. **Auto-deploy**: Wait ~2-3 minutes
|
||||
|
||||
### Update Dependencies
|
||||
|
||||
```bash
|
||||
npm update
|
||||
npm run build # Test locally first
|
||||
git add package.json
|
||||
git commit -m "Update dependencies"
|
||||
git push
|
||||
```
|
||||
|
||||
### Database Backup
|
||||
|
||||
Consent logs stored in SQLite (or Turso if configured):
|
||||
|
||||
```bash
|
||||
# Local backup
|
||||
cp db/consent.db backup-$(date +%Y%m%d).db
|
||||
|
||||
# Production (via Easypanel console)
|
||||
# Download consent.db file
|
||||
```
|
||||
|
||||
## 🐛 Troubleshooting
|
||||
|
||||
### Build Fails
|
||||
|
||||
1. **Check logs** in Easypanel
|
||||
2. **Test locally**: `npm run build`
|
||||
3. **Common issues**:
|
||||
- Missing dependencies: `npm install`
|
||||
- Syntax errors: Check recent changes
|
||||
- TypeScript errors: `npm run check`
|
||||
|
||||
### Page Not Found
|
||||
|
||||
1. **Verify URL structure** matches file path
|
||||
2. **Check Thai URL encoding**
|
||||
3. **Clear cache**: Hard refresh (Ctrl+Shift+R)
|
||||
|
||||
### Cookie Consent Not Working
|
||||
|
||||
1. **Check localStorage**: Open DevTools → Application → Local Storage
|
||||
2. **Verify script loading**: Check Network tab for errors
|
||||
3. **Test in incognito**: Clear all cookies first
|
||||
|
||||
### Analytics Not Tracking
|
||||
|
||||
1. **Check Umami Website ID** in `.env`
|
||||
2. **Verify consent given** for analytics
|
||||
3. **Check browser console** for errors
|
||||
|
||||
## 📈 Performance Optimization
|
||||
|
||||
### Image Optimization (Recommended)
|
||||
|
||||
Convert images to WebP:
|
||||
|
||||
```bash
|
||||
# Install sharp
|
||||
npm install -g sharp-cli
|
||||
|
||||
# Convert all images
|
||||
sharp public/images/**/*.jpg -o public/images/ -f webp -q 80
|
||||
```
|
||||
|
||||
### Enable Compression
|
||||
|
||||
Easypanel handles compression automatically.
|
||||
|
||||
### CDN (Optional)
|
||||
|
||||
For better performance:
|
||||
|
||||
1. Set up Cloudflare CDN
|
||||
2. Point DNS to Cloudflare
|
||||
3. Enable caching
|
||||
4. Configure page rules
|
||||
|
||||
## 🔐 Security
|
||||
|
||||
### Environment Variables
|
||||
|
||||
- NEVER commit `.env` file
|
||||
- Use strong passwords
|
||||
- Rotate passwords periodically
|
||||
|
||||
### HTTPS
|
||||
|
||||
Easypanel provides HTTPS automatically.
|
||||
|
||||
### Rate Limiting
|
||||
|
||||
Consider adding rate limiting for API endpoints:
|
||||
|
||||
```javascript
|
||||
// src/pages/api/consent/POST.ts
|
||||
import rateLimit from 'express-rate-limit';
|
||||
|
||||
const limiter = rateLimit({
|
||||
windowMs: 15 * 60 * 1000, // 15 minutes
|
||||
max: 100 // limit each IP to 100 requests per windowMs
|
||||
});
|
||||
```
|
||||
|
||||
## 📞 Support
|
||||
|
||||
**Issues?**
|
||||
1. Check Easypanel logs
|
||||
2. Review Astro docs: https://docs.astro.build
|
||||
3. Check this guide
|
||||
|
||||
**Emergency Contact**:
|
||||
- Admin: [Your contact]
|
||||
- Developer: [Your contact]
|
||||
|
||||
---
|
||||
|
||||
**Last Updated**: 2026-03-12
|
||||
**Version**: 1.0
|
||||
Reference in New Issue
Block a user