Cómo crear tu portafolio con WordPress y publicarlo como sitio estático desde tu servidor local

crear-portafolio-con-wordpress.md

Curso 3: Cómo crear tu portafolio con WordPress y publicarlo como sitio estático desde tu servidor local

Descripción

En este curso aprenderás a crear un portafolio con WordPress en tu máquina de desarrollo usando Laravel Valet y WP-CLI, exportarlo como un sitio estático y luego publicarlo en un servidor local (por ejemplo, un VPS interno, una Raspberry Pi o una computadora en tu red LAN).

Este enfoque combina la comodidad del desarrollo local con WordPress y la seguridad, velocidad y bajo mantenimiento de un sitio estático.

---

Contenido

1. Introducción
2. Requisitos previos
3. Instalar y configurar WordPress con WP-CLI y Valet
4. Diseñar y personalizar tu portafolio
5. Exportar el sitio como HTML estático
6. Transferir archivos al servidor remoto
7. Publicar el sitio en Nginx
8. Conclusión y siguientes pasos

---

Desarrollo

1. Introducción

WordPress es una herramienta poderosa para construir un portafolio personal de forma rápida.
Pero no siempre es ideal mantenerlo en producción, ya que requiere PHP y base de datos.

La solución: desarrollar con WordPress en local y exportar a HTML estático para publicar en un servidor remoto con Nginx.

Ventajas:

• Flujo de trabajo rápido en local.
• Producción sin PHP ni base de datos.
• Más rendimiento y seguridad.

---

2. Requisitos previos

• macOS o Linux con Laravel Valet instalado (máquina de desarrollo).
• WP-CLI instalado.
• PHP, Composer y MySQL/MariaDB en local.
• Acceso SSH a un servidor remoto con Nginx.
• Acceso a Internet.

---

3. Instalar y configurar WordPress con WP-CLI y Valet

1. Crear carpeta del proyecto:

mkdir ~/Valet/portfolio
cd ~/Valet/portfolio

2. Descargar el core de WordPress:

wp core download

3. Crear base de datos local:

mysql -u root -p
CREATE DATABASE portfolio;
EXIT;

4. Crear archivo wp-config.php:

wp config create --dbname=portfolio --dbuser=root --prompt=dbpass --locale=es_ES

5. Instalar WordPress:

wp core install \
--url="http://portfolio.test" \
--title="Mi Portafolio" \
--admin_user="nombre" \
--admin_password="12345678" \
--admin_email="[email protected]"

6. Activar con Valet:

cd ~/Valet
valet park
cd portfolio

Accede a:

https://portfolio.test

---

4. Diseñar y personalizar tu portafolio

• Accede al panel (/wp-admin).
• Instala un tema ligero (ej. 2025, Blockbase, Tove, Frost).
• Crea páginas: Inicio, Proyectos, Sobre mí, Contacto.
• Personaliza menús y estilos.
• Instala plugins si los necesitas.

Con WP-CLI:

wp theme install frost --activate
wp plugin install gutenberg --activate

---

5. Exportar el sitio como HTML estático

Opción 1: Usando Simply Static

1. Instalar y configurar Simply Static:

wp plugin install simply-static --activate

2. Generar:

wp simply-static generate

Opción 2: Usando makestaticsite.sh

Otra alternativa es usar makestaticsite.sh, una herramienta que hace crawling de tu sitio y genera HTML estático automáticamente.

1. Descargar script:

curl -fsSL https://makestaticsite.sh/install.sh | sh

2. Generar sitio estático:

makestaticsite http://portfolio.test ./portfolio-static

Esto creará una carpeta con todos los archivos HTML, CSS y JS estáticos listos para publicar. No depende de WordPress ni de plugins.

---

6. Transferir archivos al servidor remoto

Usa scp, rsync o sftp para transferir los archivos generados:

scp -r ~/Valet/portfolio-static/* usuario@IP_SERVIDOR:/var/www/portfolio

o

rsync -avz ~/Valet/portfolio-static/ usuario@IP_SERVIDOR:/var/www/portfolio/

---

7. Publicar el sitio en Nginx

En el servidor remoto, crea un bloque de servidor:

sudo nano /etc/nginx/sites-available/portfolio

server {
    listen 80;
    server_name _;

    root /var/www/portfolio;
    index index.html;

    location / {
        try_files $uri $uri/ =404;
    }

    location ~ /\. {
        deny all;
        access_log off;
        log_not_found off;
    }
}

Activar y recargar:

sudo ln -s /etc/nginx/sites-available/portfolio /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx

---

8. Conclusión y siguientes pasos

• Has creado un portafolio con WordPress usando WP-CLI y Valet.
• Lo convertiste en un sitio estático usando Simply Static o makestaticsite.sh.
• Lo publicaste en un servidor remoto con Nginx.

Ventajas:

• Flujo de trabajo eficiente.
• Producción sin PHP ni base de datos.
• Sitio más rápido y seguro.

Buenas prácticas:

• Mantén tu instalación de WordPress para editar y exportar.
• Usa rsync para despliegues rápidos.
• Automatiza con scripts si actualizas frecuentemente.