work?
This commit is contained in:
239
wiki/Quick-Start.md
Normal file
239
wiki/Quick-Start.md
Normal file
@@ -0,0 +1,239 @@
|
||||
# Quick Start Guide
|
||||
|
||||
Get up and running with the Diagram Viewer in minutes.
|
||||
|
||||
## For Developers
|
||||
|
||||
### 1. Clone Repository
|
||||
|
||||
```bash
|
||||
git clone git@git.appmodel.nl:Tour/diagram.git
|
||||
cd diagram
|
||||
```
|
||||
|
||||
### 2. Setup Environment
|
||||
|
||||
```bash
|
||||
# Create virtual environment
|
||||
python -m venv .venv
|
||||
|
||||
# Activate (choose your platform)
|
||||
source .venv/bin/activate # macOS/Linux
|
||||
.venv\Scripts\activate # Windows CMD
|
||||
source .venv/Scripts/activate # Windows Git Bash
|
||||
```
|
||||
|
||||
### 3. Install Dependencies
|
||||
|
||||
```bash
|
||||
pip install -r requirements.txt
|
||||
```
|
||||
|
||||
### 4. Generate Diagrams
|
||||
|
||||
```bash
|
||||
# Generate LAN architecture diagram
|
||||
python lan_architecture.py
|
||||
|
||||
# Generate main diagram
|
||||
python main.py
|
||||
|
||||
# View generated files
|
||||
ls -la *.png
|
||||
```
|
||||
|
||||
### 5. Test Locally
|
||||
|
||||
```bash
|
||||
# Start local web server
|
||||
python -m http.server 8000 --directory public/
|
||||
|
||||
# Open browser
|
||||
# Navigate to: http://localhost:8000
|
||||
```
|
||||
|
||||
### 6. Make Changes & Deploy
|
||||
|
||||
```bash
|
||||
# Edit diagram code
|
||||
vim lan_architecture.py
|
||||
|
||||
# Commit changes
|
||||
git add .
|
||||
git commit -m "Update network diagram"
|
||||
|
||||
# Push to deploy (auto-deploys to production)
|
||||
git push origin main
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## For Operators
|
||||
|
||||
### View Live Site
|
||||
|
||||
Simply navigate to:
|
||||
```
|
||||
https://diagram.appmodel.nl
|
||||
```
|
||||
|
||||
### Manual Deployment
|
||||
|
||||
On the server:
|
||||
|
||||
```bash
|
||||
# Trigger deployment
|
||||
app-deploy diagram
|
||||
|
||||
# View logs
|
||||
tail -f /var/log/app-deploy-diagram.log
|
||||
|
||||
# Check status
|
||||
cd /home/tour/infra/diagram
|
||||
docker compose ps
|
||||
```
|
||||
|
||||
### View Logs
|
||||
|
||||
```bash
|
||||
# Deployment logs
|
||||
tail -f /var/log/app-deploy-diagram.log
|
||||
|
||||
# Container logs
|
||||
cd /home/tour/infra/diagram
|
||||
docker compose logs -f diagram
|
||||
|
||||
# Last 100 lines
|
||||
docker compose logs --tail=100 diagram
|
||||
```
|
||||
|
||||
### Restart Service
|
||||
|
||||
```bash
|
||||
cd /home/tour/infra/diagram
|
||||
|
||||
# Restart container
|
||||
docker compose restart diagram
|
||||
|
||||
# Full restart (rebuild)
|
||||
docker compose down
|
||||
docker compose up -d --build diagram
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Common Tasks
|
||||
|
||||
### Add New Diagram
|
||||
|
||||
1. Create new Python file:
|
||||
```python
|
||||
# my_diagram.py
|
||||
from diagrams import Diagram
|
||||
from diagrams.onprem.network import Router
|
||||
|
||||
with Diagram("My Network", show=False, filename="my_network"):
|
||||
Router("Gateway")
|
||||
```
|
||||
|
||||
2. Update Dockerfile if needed (add to RUN command):
|
||||
```dockerfile
|
||||
RUN python lan_architecture.py && \
|
||||
python main.py && \
|
||||
python my_diagram.py
|
||||
```
|
||||
|
||||
3. Commit and push:
|
||||
```bash
|
||||
git add my_diagram.py Dockerfile
|
||||
git commit -m "Add my network diagram"
|
||||
git push
|
||||
```
|
||||
|
||||
### Update Frontend
|
||||
|
||||
1. Edit HTML:
|
||||
```bash
|
||||
vim public/index.html
|
||||
```
|
||||
|
||||
2. Test locally:
|
||||
```bash
|
||||
python -m http.server 8000 --directory public/
|
||||
```
|
||||
|
||||
3. Deploy:
|
||||
```bash
|
||||
git add public/index.html
|
||||
git commit -m "Update frontend"
|
||||
git push
|
||||
```
|
||||
|
||||
### Check Container Health
|
||||
|
||||
```bash
|
||||
# Container status
|
||||
docker compose ps
|
||||
|
||||
# Health check
|
||||
docker inspect diagram-viewer | grep -A 10 Health
|
||||
|
||||
# Test endpoint
|
||||
curl -I https://diagram.appmodel.nl
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Build Fails
|
||||
|
||||
```bash
|
||||
# Check logs
|
||||
tail -f /var/log/app-deploy-diagram.log
|
||||
|
||||
# Rebuild with verbose output
|
||||
cd /home/tour/infra/diagram
|
||||
docker compose build --no-cache --progress=plain diagram
|
||||
```
|
||||
|
||||
### Site Not Loading
|
||||
|
||||
```bash
|
||||
# Check container
|
||||
docker compose ps
|
||||
|
||||
# Check Traefik routing
|
||||
docker logs traefik | grep diagram
|
||||
|
||||
# Test DNS
|
||||
nslookup diagram.appmodel.nl
|
||||
|
||||
# Test directly
|
||||
curl http://localhost:PORT
|
||||
```
|
||||
|
||||
### Changes Not Visible
|
||||
|
||||
```bash
|
||||
# Force rebuild
|
||||
cd /home/tour/infra/diagram
|
||||
docker compose up -d --build --force-recreate diagram
|
||||
|
||||
# Clear browser cache
|
||||
# Ctrl+Shift+R (Windows/Linux)
|
||||
# Cmd+Shift+R (macOS)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Next Steps
|
||||
|
||||
- Read the [Home](Home.md) page for comprehensive documentation
|
||||
- Review [DEPLOY_SERVER_SETUP.md](../DEPLOY_SERVER_SETUP.md) for deployment details
|
||||
- Check [Diagrams Library docs](https://diagrams.mingrammer.com/) for icon options
|
||||
- Explore the [Mermaid editor](https://diagram.appmodel.nl) for live diagram editing
|
||||
|
||||
---
|
||||
|
||||
**Need Help?** Check the [Troubleshooting](Home.md#troubleshooting) section or review deployment logs.
|
||||
Reference in New Issue
Block a user