Pràctica: Creació i Allotjament d'un Podcast amb Docker

Objectius

En aquesta pràctica aprendràs a:

• ✅ Crear i editar un episodi de podcast personalitzat
• ✅ Generar un feed RSS vàlid amb el teu nom
• ✅ Desplegar un servidor web amb Docker per allotjar el podcast
• ✅ Configurar Nginx per servir els fitxers d'àudio
• ✅ Validar i provar el feed RSS
• ✅ Generar estadístiques bàsiques d'accés

Requisits

Programari necessari

• Docker Desktop o Docker Engine
• Audacity: Editor d'àudio (descarregar)
• Navegador web modern
• Editor de text: VS Code, Notepad++, o similar

Coneixements previs

• Edició bàsica d'àudio
• Conceptes d'XML i RSS
• Docker i contenidors

---

Part 1: Producció del Contingut

Pas 1.1: Planificació del podcast personalitzat

Defineix els següents elements utilitzant el teu nom i cognom:

1. Nom del podcast: "Tecnologia amb [NOM COGNOM]"
2. Tema de l'episodi 1: "Introducció als serveis de xarxa"
3. Durada: 5-10 minuts
4. Estructura:
5. Intro: "Hola, sóc [nom complet] i aquest és el meu podcast..."
6. Contingut: Explica breument què són DNS, DHCP i streaming
7. Outro: "Això ha estat tot per avui, [nom complet] us desitja bon dia!"

Pas 1.2: Gravació amb Audacity

1. Obre Audacity
2. Configura Edit → Preferences → Quality:
3. Sample Rate: 44100 Hz
4. Sample Format: 32-bit float
5. Grava el teu episodi amb el guió personalitzat
6. Important: Menciona el teu nom complet almenys 3 vegades durant l'episodi

Pas 1.3: Edició i exportació

1. Normalitza l'àudio: Effect → Normalize (-1.0 dB)
2. Redueix soroll si cal: Effect → Noise Reduction
3. Exporta a MP3:
4. File → Export → Export as MP3
5. Qualitat: 128 kbps
6. Nom del fitxer: episodi01-NOMCOGNOM.mp3

Exemple per Joan Garcia: episodi01-fbarragan.mp3

1. Emplena metadades ID3:
2. Artist: [El teu nom complet]
3. Track Title: "Episodi 1: Introducció als serveis de xarxa"
4. Album: "Tecnologia amb [NOM COGNOM]"
5. Year: 2024
6. Genre: Podcast

Pas 1.4: Crear artwork personalitzat

Crea una imatge 1400x1400 píxels que inclogui: - Títol del podcast amb el teu nom - El teu nom ben visible - Disseny senzill però professional

Guarda com: podcast-cover-NOMCOGNOM.jpg

---

Part 2: Estructura del Projecte Docker

Pas 2.1: Crear directoris

# Crea l'estructura amb el teu nom
mkdir -p ~/podcast-NOMCOGNOM
cd ~/podcast-NOMCOGNOM

# Subdirectoris
mkdir -p episodis imatges nginx-config logs

Pas 2.2: Col·locar els fitxers

# Mou els fitxers creats
mv /path/to/episodi01-NOMCOGNOM.mp3 episodis/
mv /path/to/podcast-cover-NOMCOGNOM.jpg imatges/

---

Part 3: Creació del Feed RSS Personalitzat

Pas 3.1: Crear podcast.xml

Crea el fitxer podcast.xml a l'arrel del projecte amb tota la informació personalitzada:

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
     xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd"
     xmlns:content="http://purl.org/rss/1.0/modules/content/">
  <channel>

    <!-- PERSONALITZACIÓ OBLIGATÒRIA -->
    <title>Tecnologia amb NOM COGNOM</title>
    <link>http://localhost:8080/podcast-NOMCOGNOM/</link>
    <language>ca</language>
    <description>
      Podcast sobre tecnologia i serveis de xarxa presentat per [Nom complet].
      Estudiant d'ASIX a l'Institut Sa Palomera.
    </description>

    <!-- Autor - EL TEU NOM -->
    <itunes:author>NOM COGNOM</itunes:author>
    <itunes:summary>
      Exploro el món de la tecnologia des de la perspectiva d'un estudiant d'ASIX.
    </itunes:summary>

    <itunes:owner>
      <itunes:name>NOM COGNOM</itunes:name>
      <itunes:email>NOMCOGNOM@sapalomera.cat</itunes:email>
    </itunes:owner>

    <!-- Artwork personalitzat -->
    <itunes:image href="http://localhost:8080/imatges/podcast-cover-NOMCOGNOM.jpg"/>

    <itunes:category text="Technology">
      <itunes:category text="Tech News"/>
    </itunes:category>
    <itunes:category text="Education"/>

    <itunes:explicit>no</itunes:explicit>

    <!-- EPISODI 1 - Personalitzat -->
    <item>
      <title>Episodi 1: Introducció als Serveis de Xarxa</title>

      <description>
        En aquest primer episodi, [Nom complet] explica els conceptes bàsics
        dels serveis de xarxa: DNS, DHCP i streaming. Una introducció perfecta
        per entendre com funciona Internet.
      </description>

      <itunes:summary>
        [Nom complet] introdueix els serveis fonamentals de xarxa.
      </itunes:summary>

      <!-- URL personalitzada amb el teu nom -->
      <enclosure
        url="http://localhost:8080/episodis/episodi01-NOMCOGNOM.mp3"
        type="audio/mpeg"
        length="MIDA_EN_BYTES"/>

      <!-- GUID únic amb el teu nom -->
      <guid isPermaLink="false">podcast-NOMCOGNOM-ep01</guid>

      <!-- Data actual en format RFC 822 -->
      <pubDate>Mon, 15 Jan 2024 10:00:00 GMT</pubDate>

      <itunes:duration>8:45</itunes:duration>
      <itunes:explicit>no</itunes:explicit>
      <itunes:episode>1</itunes:episode>
      <itunes:episodeType>full</itunes:episodeType>

      <!-- Autor de l'episodi -->
      <itunes:author>NOM COGNOM</itunes:author>
    </item>

  </channel>
</rss>

IMPORTANT: Substitueix: - NOM COGNOM → El teu nom i cognom - NOMCOGNOM → nom i cognom junts sense espais - [Nom complet] → El teu nom complet - MIDA_EN_BYTES → Mida del fitxer MP3

Pas 3.2: Obtenir la mida del fitxer

# Linux/Mac
ls -l episodis/episodi01-NOMCOGNOM.mp3

# Windows (PowerShell)
(Get-Item episodis\episodi01-NOMCOGNOM.mp3).Length

Copia el número de bytes i actualitza length="..." al XML.

---

Part 4: Configuració de Nginx

Pas 4.1: Crear nginx.conf personalitzat

Crea nginx-config/nginx.conf:

server {
    listen 80;
    server_name localhost;

    # Directori arrel personalitzat
    root /usr/share/nginx/html/podcast-NOMCOGNOM;

    # Habilitar directoris
    autoindex on;
    autoindex_exact_size off;
    autoindex_localtime on;

    # Configuració per al feed RSS
    location = /podcast.xml {
        add_header Content-Type application/rss+xml;
        add_header Cache-Control "public, max-age=3600";
    }

    # Configuració per als fitxers MP3
    location ~ \.mp3$ {
        add_header Content-Type audio/mpeg;
        add_header Accept-Ranges bytes;
        add_header Cache-Control "public, max-age=86400";

        # Habilitar streaming progressiu
        mp3;
    }

    # Configuració per imatges
    location ~ \.(jpg|jpeg|png|gif)$ {
        add_header Cache-Control "public, max-age=604800";
    }

    # Logs personalitzats
    access_log /var/log/nginx/podcast-NOMCOGNOM-access.log combined;
    error_log /var/log/nginx/podcast-NOMCOGNOM-error.log warn;

    # Pàgina d'índex personalitzada
    location = / {
        return 200 '
<!DOCTYPE html>
<html lang="ca">
<head>
    <meta charset="UTF-8">
    <title>Podcast de NOM COGNOM</title>
    <style>
        body { font-family: Arial, sans-serif; max-width: 800px; margin: 50px auto; padding: 20px; }
        h1 { color: #2c3e50; }
        .info { background: #ecf0f1; padding: 15px; border-radius: 5px; margin: 20px 0; }
        a { color: #3498db; text-decoration: none; }
        a:hover { text-decoration: underline; }
    </style>
</head>
<body>
    <h1>🎙️ Tecnologia amb NOM COGNOM</h1>

    <div class="info">
        <p><strong>Autor:</strong> NOM COGNOM</p>
        <p><strong>Descripció:</strong> Podcast sobre tecnologia i serveis de xarxa</p>
        <p><strong>Correu:</strong> NOMCOGNOM@sapalomera.cat</p>
    </div>

    <h2>📡 Subscripció</h2>
    <p><a href="/podcast.xml">Feed RSS</a></p>

    <h2>🎧 Episodis</h2>
    <ul>
        <li><a href="/episodis/episodi01-NOMCOGNOM.mp3">Episodi 1: Introducció als Serveis de Xarxa</a></li>
    </ul>

    <h2>📊 Estadístiques</h2>
    <p><a href="/admin/stats.html">Veure estadístiques d\'accés</a></p>
</body>
</html>
        ';
        add_header Content-Type text/html;
    }
}

IMPORTANT: Substitueix NOM COGNOM i NOMCOGNOM pel teu nom.

---

Part 5: Docker Compose

Pas 5.1: Crear docker-compose.yml

version: '3.8'

services:
  # PERSONALITZA el nom amb el teu nom i cognom
  podcast-web-NOMCOGNOM:
    image: nginx:alpine
    container_name: podcast-NOMCOGNOM

    ports:
      - "8080:80"

    volumes:
      # Configuració de Nginx
      - ./nginx-config/nginx.conf:/etc/nginx/conf.d/default.conf:ro

      # Contingut del podcast (tot l'arrel del projecte)
      - ./podcast.xml:/usr/share/nginx/html/podcast-NOMCOGNOM/podcast.xml:ro
      - ./episodis:/usr/share/nginx/html/podcast-NOMCOGNOM/episodis:ro
      - ./imatges:/usr/share/nginx/html/podcast-NOMCOGNOM/imatges:ro

      # Logs
      - ./logs:/var/log/nginx

    environment:
      - TZ=Europe/Madrid

    restart: unless-stopped

    networks:
      - podcast-network

networks:
  podcast-network:
    driver: bridge

---

Part 6: Desplegament

Pas 6.1: Iniciar el servidor

cd ~/podcast-NOMCOGNOM

# Aixecar el contenidor
docker-compose up -d

# Verificar que està en execució
docker-compose ps

Pas 6.2: Verificar l'accés

Pàgina principal:

http://localhost:8080/

Hauries de veure la pàgina personalitzada amb el teu nom.

Feed RSS:

http://localhost:8080/podcast.xml

Episodi directe:

http://localhost:8080/episodis/episodi01-NOMCOGNOM.mp3

Captura de pantalla 1: Pàgina principal mostrant el teu nom i informació.

Captura de pantalla 2: Feed RSS al navegador.

---

Part 7: Validació del Feed

Pas 7.1: Validador online

Per validar el feed sense haver-lo publicat a Internet, copia el contingut de podcast.xml i enganxa'l a:

W3C Feed Validation Service

Corregeix qualsevol error mostrat.

Pas 7.2: Provar amb un reproductor local

Opció A - VLC: 1. Obre VLC 2. Media → Open Network Stream 3. URL: http://localhost:8080/podcast.xml 4. VLC hauria de mostrar l'episodi i reproduir-lo

Opció B - Navegador amb extensió: Instal·la una extensió RSS (com "RSS Feed Reader") i obre el feed.

Captura de pantalla 3: Reproductor mostrant el podcast amb el teu nom.

---

Part 8: Estadístiques d'Accés

Pas 8.1: Crear pàgina d'estadístiques

Crea admin/stats.html dins del projecte:

<!DOCTYPE html>
<html lang="ca">
<head>
    <meta charset="UTF-8">
    <title>Estadístiques - Podcast NOM COGNOM</title>
    <style>
        body { font-family: monospace; padding: 20px; background: #1e1e1e; color: #d4d4d4; }
        h1 { color: #4ec9b0; }
        pre { background: #252526; padding: 15px; border-radius: 5px; overflow-x: auto; }
    </style>
</head>
<body>
    <h1>📊 Estadístiques d'Accés - NOM COGNOM</h1>

    <h2>Accessos al feed RSS</h2>
    <pre id="rss-stats">Carregant...</pre>

    <h2>Descàrregues d'episodis</h2>
    <pre id="download-stats">Carregant...</pre>

    <script>
        // Simulació (en producció es llegeixien logs reals)
        document.getElementById('rss-stats').textContent =
            'Total accessos: 25\nÚltim accés: 2024-01-15 14:30:22\nUser-agents:\n  - Pocket Casts: 12\n  - Apple Podcasts: 8\n  - Altres: 5';

        document.getElementById('download-stats').textContent =
            'episodi01-NOMCOGNOM.mp3: 18 descàrregues\nTràfic total: 234 MB';
    </script>

    <p><a href="/" style="color: #4ec9b0;">← Tornar a l\'inici</a></p>
</body>
</html>

Afegeix el volum a docker-compose.yml:

    volumes:
      # ... els existents ...
      - ./admin:/usr/share/nginx/html/podcast-NOMCOGNOM/admin:ro

Reinicia:

docker-compose restart

Accedeix a: http://localhost:8080/admin/stats.html

Captura de pantalla 4: Pàgina d'estadístiques.

---

Part 9: Afegir un Segon Episodi

Pas 9.1: Crear episodi 2

Repeteix el procés de gravació per crear: - Fitxer: episodi02-NOMCOGNOM.mp3 - Tema: "Docker i contenidors" (menciona el teu nom) - Durada: 5-8 minuts

Pas 9.2: Actualitzar el feed RSS

Afegeix un nou <item> abans de l'episodi 1 a podcast.xml:

    <!-- Episodi 2 (més recent) -->
    <item>
      <title>Episodi 2: Docker i Contenidors</title>

      <description>
        [Nom complet] explica què són els contenidors Docker i per què
        són útils per desplegar serveis com aquest mateix podcast.
      </description>

      <enclosure
        url="http://localhost:8080/episodis/episodi02-NOMCOGNOM.mp3"
        type="audio/mpeg"
        length="MIDA_BYTES"/>

      <guid isPermaLink="false">podcast-NOMCOGNOM-ep02</guid>
      <pubDate>Mon, 22 Jan 2024 10:00:00 GMT</pubDate>

      <itunes:duration>7:12</itunes:duration>
      <itunes:episode>2</itunes:episode>
      <itunes:author>NOM COGNOM</itunes:author>
    </item>

    <!-- Episodi 1 ... -->

Pas 9.3: Reiniciar el servei

docker-compose restart

Verifica que ara el feed mostra dos episodis.

---

Qüestions i Exercicis

Qüestió 1: Estructura RSS

Explica per què l'ordre dels <item> al feed és important i com afecta la visualització en reproductors de podcasts.

Qüestió 2: Docker vs Instal·lació Traditional

Compara les avantatges i desavantatges d'utilitzar Docker per allotjar un podcast vs. instal·lar Nginx directament al sistema operatiu.

Qüestió 3: Amplada de banda

Si tens 3 episodis de 15 MB cadascun i reps 100 subscriptors que descarreguen automàticament cada nou episodi:

a) Quin tràfic es genera quan publiques l'episodi 4?

b) Si el teu hosting té límit de 10 GB/mes, quants subscriptors pots tenir?

Exercici 1: Categoria personalitzada

Afegeix una categoria personalitzada al teu podcast que reflecteixi el teu interès específic dins de tecnologia.

Exercici 2: Capítols

Investiga i implementa capítols (chapters) per a un episodi llarg (>15 min), permetent saltar entre seccions.

Exercici 3: HTTPS

Configura un certificat SSL auto-signat per servir el podcast via HTTPS.

Pista:

openssl req -x509 -nodes -days 365 -newkey rsa:2048 \
  -keyout nginx-config/cert.key \
  -out nginx-config/cert.crt

---

Lliurament

Format de lliurament

Document PDF amb:

1. Portada

• Nom complet, curs, data

2. Fitxers de configuració

• podcast.xml complet (personalitzat)
• docker-compose.yml complet
• nginx.conf complet

3. Captures de pantalla (obligatòries)

1. Terminal amb docker-compose ps
2. Pàgina web principal amb el teu nom visible
3. Feed RSS al navegador
4. Reproductor (VLC o altre) amb l'episodi carregat
5. Pàgina d'estadístiques
6. Contingut de logs/podcast-NOMCOGNOM-access.log mostrant accessos

4. Metadades dels episodis

Taula amb informació de cada episodi:

Episodi	Títol	Durada	Mida (MB)	Bitrate	Vegades que menciones el teu nom
1
2

5. Respostes a qüestions

• Respostes completes i justificades

6. Transcripció parcial

• Transcriu els primers 2 minuts de l'episodi 1 on s'ha de veure clarament que menciones el teu nom

7. Reflexió (250-300 paraules)

• Procés de creació
• Dificultats trobades
• Aplicacions pràctiques
• Millores futures

Criteris d'avaluació

Criteri	Puntuació
Personalització completa (nom en tots els llocs obligatoris)	20%
Episodis gravats amb qualitat i mencionant el nom	15%
Feed RSS vàlid i ben format	20%
Docker-compose i Nginx funcionals	20%
Captures de pantalla completes	10%
Respostes a qüestions	10%
Documentació i presentació	5%

Penalitzacions: - -25% si el nom no apareix en configuracions obligatòries - -15% si no es menciona el nom verbalment als episodis - -10% si el feed RSS no valida correctament - -10% si el contenidor no s'inicia

---

Recursos Addicionals

Eines d'àudio

• Audacity - Editor gratuït
• Auphonic - Post-processament automàtic

Validadors

• Cast Feed Validator
• Podbase Validator

Disseny

• Canva - Plantilles per artwork

Música lliure

• Free Music Archive
• YouTube Audio Library

---

Conclusió

Has creat un sistema complet de podcasting amb:

• ✅ Producció professional d'episodis personalitzats
• ✅ Feed RSS estàndard i vàlid
• ✅ Infraestructura Docker per allotjament
• ✅ Servidor web Nginx configurat
• ✅ Sistema d'estadístiques bàsic

Aquest projecte demostra habilitats en producció de contingut multimèdia, administració de sistemes amb Docker, configuració de servidors web i comprensió de protocols de sindicació.

Excel·lent feina!