🗑️ Remove unused and archived files across multiple directories and update project dependencies in package files
This commit is contained in:
11
code/websites/pokedex.online/apps/Dockerfile
Normal file
11
code/websites/pokedex.online/apps/Dockerfile
Normal file
@@ -0,0 +1,11 @@
|
||||
# Use nginx alpine for lightweight serving
|
||||
FROM nginx:alpine
|
||||
|
||||
# Copy website files to nginx html directory
|
||||
COPY index.html /usr/share/nginx/html/
|
||||
|
||||
# Expose ports 80 (HTTP) and 443 (HTTPS)
|
||||
EXPOSE 80 443
|
||||
|
||||
# Start nginx
|
||||
CMD ["nginx", "-g", "daemon off;"]
|
||||
214
code/websites/pokedex.online/apps/README.md
Normal file
214
code/websites/pokedex.online/apps/README.md
Normal file
@@ -0,0 +1,214 @@
|
||||
# Pokedex Online
|
||||
|
||||
A landing page for the Pokedex Online project, containerized and ready for deployment.
|
||||
|
||||
## 🚀 Local Development
|
||||
|
||||
### Quick Start
|
||||
|
||||
```bash
|
||||
# Open index.html directly in browser
|
||||
open index.html
|
||||
```
|
||||
|
||||
## 🐳 Docker Deployment
|
||||
|
||||
### Build and Run Locally
|
||||
|
||||
```bash
|
||||
# Build the image
|
||||
docker build -t pokedex-online .
|
||||
|
||||
# Run the container
|
||||
docker run -d -p 8080:80 --name pokedex-online pokedex-online
|
||||
|
||||
# View in browser
|
||||
open http://localhost:8080
|
||||
```
|
||||
|
||||
### Using Docker Compose
|
||||
|
||||
```bash
|
||||
# Start the service
|
||||
docker-compose up -d
|
||||
|
||||
# Stop the service
|
||||
docker-compose down
|
||||
|
||||
# View logs
|
||||
docker-compose logs -f
|
||||
```
|
||||
|
||||
## 📦 Portainer Deployment
|
||||
|
||||
### Option 1: Stack Deployment (Recommended)
|
||||
|
||||
1. Log into Portainer
|
||||
2. Navigate to **Stacks** → **Add stack**
|
||||
3. Name: `pokedex-online`
|
||||
4. Upload or paste the `docker-compose.yml` contents
|
||||
5. Click **Deploy the stack**
|
||||
|
||||
### Option 2: Container Deployment
|
||||
|
||||
1. Build the image locally:
|
||||
```bash
|
||||
docker build -t pokedex-online:latest .
|
||||
```
|
||||
|
||||
2. Tag for your registry (if using):
|
||||
```bash
|
||||
docker tag pokedex-online:latest your-registry/pokedex-online:latest
|
||||
docker push your-registry/pokedex-online:latest
|
||||
```
|
||||
|
||||
3. In Portainer:
|
||||
- Navigate to **Containers** → **Add container**
|
||||
- Name: `pokedex-online`
|
||||
- Image: `pokedex-online:latest` (or your registry path)
|
||||
- Port mapping: `8080:80`
|
||||
- Restart policy: `unless-stopped`
|
||||
- Deploy
|
||||
|
||||
### Option 3: Git Repository (Portainer with BuildKit)
|
||||
|
||||
1. In Portainer, navigate to **Stacks** → **Add stack**
|
||||
2. Choose **Repository**
|
||||
3. Repository URL: Your git repository URL
|
||||
4. Compose path: `code/websites/pokedex.online/docker-compose.yml`
|
||||
5. Deploy
|
||||
|
||||
## 🌐 Access
|
||||
|
||||
After deployment, access the site at:
|
||||
- Local: http://localhost:8080
|
||||
- Server: http://your-server-ip:8080
|
||||
|
||||
## <20> Automated Deployment to Synology
|
||||
|
||||
### Prerequisites
|
||||
|
||||
1. **SSH Configuration**: Ensure SSH keys are configured for Synology NAS:
|
||||
- Host: `synology_internal` (10.0.0.81:2323) or `synology_external` (home.gregrjacobs.com:2323)
|
||||
- User: `GregRJacobs`
|
||||
- Key: `~/.ssh/ds3627xs_gregrjacobs`
|
||||
|
||||
2. **Remote Path**: Deployment target is `/volume1/docker/pokedex-online/base` on Synology
|
||||
|
||||
### Deployment Commands
|
||||
|
||||
```bash
|
||||
# Deploy to internal Synology (10.0.0.81) on default port 8080
|
||||
npm run deploy:pokedex
|
||||
|
||||
# Deploy to internal with custom port
|
||||
npm run deploy:pokedex -- --port 8081
|
||||
|
||||
# Deploy to external Synology (home.gregrjacobs.com)
|
||||
npm run deploy:pokedex:external
|
||||
|
||||
# Deploy to external with custom port
|
||||
npm run deploy:pokedex:external -- --port 3000
|
||||
|
||||
# Full custom deployment
|
||||
npm run deploy:pokedex -- --target internal --port 8082
|
||||
```
|
||||
|
||||
### Deployment Process
|
||||
|
||||
The deployment script automatically:
|
||||
|
||||
1. **Connects** to Synology via SSH using configured host
|
||||
2. **Captures** existing container state for rollback capability
|
||||
3. **Transfers** files (index.html, Dockerfile, docker-compose.yml) via SFTP
|
||||
4. **Modifies** docker-compose.yml port mapping based on `--port` argument
|
||||
5. **Builds** and starts the Docker container with `docker-compose up -d --build`
|
||||
6. **Health checks** the deployed container (5 retries with 3s intervals)
|
||||
7. **Rolls back** to previous image on failure, or cleans up if no previous deployment existed
|
||||
|
||||
### Health Check
|
||||
|
||||
After deployment, the script verifies the container is responding by making HTTP requests to:
|
||||
- Internal: `http://10.0.0.81:<port>`
|
||||
- External: `http://home.gregrjacobs.com:<port>`
|
||||
|
||||
If health check fails after 5 attempts, the deployment is rolled back automatically.
|
||||
|
||||
### Rollback Behavior
|
||||
|
||||
- **Existing container**: Rolls back to previous Docker image
|
||||
- **New deployment**: Runs `docker-compose down --volumes --remove-orphans` to clean up
|
||||
|
||||
### CLI Options
|
||||
|
||||
| Option | Values | Default | Description |
|
||||
|--------|--------|---------|-------------|
|
||||
| `--target` | `internal`, `external` | `internal` | SSH host to deploy to |
|
||||
| `--port` | `1-65535` | `8080` | HTTP port to expose on host |
|
||||
|
||||
### Examples
|
||||
|
||||
```bash
|
||||
# Production deployment to external Synology on port 80
|
||||
npm run deploy:pokedex -- --target external --port 80
|
||||
|
||||
# Development deployment to internal Synology on port 8080
|
||||
npm run deploy:pokedex:internal
|
||||
|
||||
# Test deployment on high port
|
||||
npm run deploy:pokedex -- --port 9000
|
||||
```
|
||||
|
||||
## 🔧 Configuration
|
||||
|
||||
### Change Port
|
||||
|
||||
Edit `docker-compose.yml`:
|
||||
|
||||
```yaml
|
||||
ports:
|
||||
- "3000:80" # Change 3000 to your desired port
|
||||
```
|
||||
|
||||
Or use the `--port` argument during automated deployment.
|
||||
|
||||
### Custom Domain
|
||||
|
||||
If using a reverse proxy (nginx, Traefik, Caddy):
|
||||
|
||||
```yaml
|
||||
labels:
|
||||
- "traefik.enable=true"
|
||||
- "traefik.http.routers.pokedex.rule=Host(`pokedex.yourdomain.com`)"
|
||||
```
|
||||
|
||||
## 📁 Project Structure
|
||||
|
||||
```
|
||||
pokedex.online/
|
||||
├── index.html # Landing page
|
||||
├── Dockerfile # Container configuration
|
||||
├── docker-compose.yml # Compose configuration
|
||||
└── README.md # This file
|
||||
```
|
||||
|
||||
## 🛠️ Future Development
|
||||
|
||||
This is currently a landing page. Future plans:
|
||||
- Interactive Pokédex with search
|
||||
- Team builder
|
||||
- Type effectiveness calculator
|
||||
- Collection tracker
|
||||
- Integration with Pokémon APIs
|
||||
|
||||
## 📝 Notes
|
||||
|
||||
- Uses nginx:alpine for minimal footprint (~23MB)
|
||||
- Restart policy set to `unless-stopped`
|
||||
- Watchtower compatible for auto-updates
|
||||
- No environment variables needed for basic setup
|
||||
|
||||
---
|
||||
|
||||
**Status**: In Development
|
||||
**Last Updated**: January 2026
|
||||
12
code/websites/pokedex.online/apps/docker-compose.yml
Normal file
12
code/websites/pokedex.online/apps/docker-compose.yml
Normal file
@@ -0,0 +1,12 @@
|
||||
version: '3.8'
|
||||
|
||||
services:
|
||||
pokedex-online:
|
||||
build: .
|
||||
container_name: pokedex-online
|
||||
ports:
|
||||
- '8083:80'
|
||||
- '8444:443'
|
||||
restart: unless-stopped
|
||||
labels:
|
||||
- 'com.centurylinklabs.watchtower.enable=true'
|
||||
124
code/websites/pokedex.online/apps/index.html
Normal file
124
code/websites/pokedex.online/apps/index.html
Normal file
@@ -0,0 +1,124 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Pokedex Online - Coming Soon</title>
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.container {
|
||||
background: white;
|
||||
border-radius: 20px;
|
||||
padding: 60px 40px;
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pokeball {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: 0 auto 30px;
|
||||
position: relative;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(180deg, #f44336 50%, white 50%);
|
||||
border: 5px solid #333;
|
||||
}
|
||||
|
||||
.pokeball::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background: white;
|
||||
border: 5px solid #333;
|
||||
border-radius: 50%;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.pokeball::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 5px;
|
||||
background: #333;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #333;
|
||||
margin-bottom: 20px;
|
||||
font-size: 2.5em;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
color: #667eea;
|
||||
font-size: 1.2em;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.description {
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.status {
|
||||
background: #f0f0f0;
|
||||
padding: 15px;
|
||||
border-radius: 10px;
|
||||
color: #666;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.status strong {
|
||||
color: #667eea;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.container {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="pokeball"></div>
|
||||
<h1>Pokedex Online</h1>
|
||||
<p class="subtitle">Your Digital Pokédex Companion</p>
|
||||
<p class="description">
|
||||
A modern web application for exploring Pokémon data, tracking collections,
|
||||
and managing your Pokémon journey. Built with ❤️ for trainers everywhere.
|
||||
</p>
|
||||
<div class="status">
|
||||
<strong>Status:</strong> In Development<br>
|
||||
Check back soon for updates!
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user