Simrishamn – Projektdokumentation

Det här är dokumentationsdelen för projektet där vi bygger en enkel webblösning för landskapsbilder från Simrishamn, med Docker, Caddy, Git och senare timelapse. Tanken är att sidan ska fungera både som minnesstöd och som steg-för-steg-manual.

Docker-projekt VPS-träning Google Drive-bilder Dokumentation på webben Till startsidan

Översikt

Projektets mål är att bygga en enkel och begriplig kedja: först visa bilder på webben, sedan synka dem från Google Drive, därefter lägga till Git och GitHub, och till sist bygga timelapse.

Primärt mål

Visa landskapsbilder i ett eget webbprojekt på VPS:en.

Sekundärt mål

Dokumentera allt så att projektet går att återskapa steg för steg.

Senare mål

Bygga timelapse och mer avancerad bildpresentation.

Status just nu

Projektet är igång och grundmiljön fungerar. Fungerar

Webbcontainer

Nginx-container körs och serverar projektets app/-mapp.

Domän

simrishamn.r8n.net är kopplad via Caddy med HTTPS.

Dokumentation

Dokumentationen visas under /docs/.

Nästa fokus

Synka Google Drive-bilder till lokal bildkatalog.

Vad vi gjort hittills

1. Bestämde en ren projektstruktur

Vi valde att lägga projektet under ~/docker/ för att hålla alla containerprojekt samlade.

2. Skapade projektmappen simrishamn

Mappstrukturen skapades med separata kataloger för app, data, scripts och dokumentation.

3. Startade en enkel webbcontainer

En Nginx-container sattes upp för att servera statiskt innehåll från app/.

4. Fixade domänkoppling via Caddy

Reverse proxy lades till så att projektet nås via simrishamn.r8n.net.

5. Bekräftade att HTTPS fungerar

Caddy hämtade certifikat och sidan blev nåbar externt med HTTPS.

6. Identifierade teckenkodsproblem i klienten

ÅÄÖ-problemet visade sig ligga i SecureCRT-klienten, inte i VPS:ens locale eller Vim.

Projektstruktur

Det här är strukturen vi bygger vidare på:

/home/peter/docker/
├── portainer-caddy/
└── simrishamn/
    ├── compose.yaml
    ├── .gitignore
    ├── README.md
    ├── app/
    │   ├── index.html
    │   └── docs/
    │       └── index.html
    ├── data/
    │   └── images/
    └── scripts/

app/

Allt som webbservern visar.

app/docs/

Den här dokumentationen, tillgänglig via webben.

data/images/

Lokala bildfiler som senare synkas från Google Drive.

scripts/

Plats för hjälpskript, synk och timelapse senare.

Nuvarande konfiguration

Compose för webbcontainern

services:
  web:
    image: nginx:alpine
    container_name: simrishamn-web
    restart: unless-stopped
    ports:
      - "8081:80"
    volumes:
      - ./app:/usr/share/nginx/html:ro
    networks:
      - frontend

networks:
  frontend:
    external: true
    name: portainer-caddy_frontend

Caddy-route för projektet

simrishamn.r8n.net {
    reverse_proxy simrishamn-web:80
}

Hostporten 8081 används främst för lokal testning. Extern åtkomst går via Caddy och HTTPS.

Nästa steg På tur

  1. Skapa lokal synk från Google Drive till data/images/
  2. Visa bilderna på webben på enklast möjliga sätt
  3. Initiera Git lokalt i projektmappen
  4. Skapa GitHub-konto och pusha projektet
  5. Bygga timelapse som steg två

Egna anteckningar

Här kan vi senare lägga in små noteringar om problem, beslut och idéer under projektets gång.

- Projektet ska vara enkelt nog att förstå steg för steg.
- Dokumentationen ska kunna användas som återställningspunkt.
- Bilder ska inte lagras i Git.
- Fokus först: visa bilder. Fokus senare: timelapse.