# Instalación

# Plantilla de inicio

Slidev requiere Node.js >=14.0

La mejor manera de empezar es utilizando nuestra plantilla oficial de inicio.

Con NPM:

$ npm init slidev@latest

Con Yarn:

$ yarn create slidev

Sigue las indicaciones y se abrirá la presentación en http://localhost:3030/ automáticamente para ti.

También contiene la configuración básica y una breve demostración con instrucciones sobre cómo empezar a utilizar Slidev.

# Instalación manual

Si todavía prefieres instalar Slidev manualmente o quieres integrarlo en tus proyectos existentes, puedes hacer lo siguiente:

$ npm install @slidev/cli @slidev/theme-default

$ touch slides.md

$ npx slidev

Por favor, nótese que si usas pnpm, necesitarás activar la opción de 'shamefully-hoist' para que Slidev funcione correctamente:

echo 'shamefully-hoist=true' >> .npmrc

# Instalación global

Available since v0.14

Puedes instalar Slidev globalmente con el siguiente comando:

$ npm i -g @slidev/cli

Y luego usar slidev donde desees sin que tengas que crear un proyecto cada vez.

$ slidev

Este comando también intentará utilizar el @slidev/cli local si se ha encontrado en node_modules.

# Instalación en Docker

Si necesitas una forma rápida de ejecutar una presentación con contenedores, puedes utilizar la imagen de Docker preconstruida y mantenida por tangramor, o construir la tuya propia.

Simplemente ejecuta el siguiente comando en tu carpeta de trabajo:

docker run --name slidev --rm -it \
    --user node \
    -v ${PWD}:/slidev \
    -p 3030:3030 \
    tangramor/slidev:latest

Si tu carpeta de trabajo está vacía, generará una plantilla de slides.md y otros archivos relacionados en tu carpeta de trabajo, y lanzará el servidor en el puerto 3030.

Puedes acceder a tus diapositivas desde http://localhost:3030/

# Construir una imagen desplegable

O puedes crear tu propio proyecto de Slidev en Docker con Dockerfile:

FROM tangramor/slidev:latest

ADD . /slidev

Crea la imagen de Docker: docker build -t mippt .

Y ejecuta el contenedor: docker run --name misdiapos --rm --user node -p 3030:3030 mippt

Puedes visitar tus diapositivas desde http://localhost:3030/

# Constuir una SPA alojable (Single Page Application)

Ejecuta el comando docker exec -i slidev npx slidev build en el contenedor de slidev en ejcución. Generará archivos HTML estáticos en la carpeta dist.

# Alojar en Github Pages

Puedes alojar dist en un sitio web estático como Github Pages o Gitlab Pages.

Debido a que en las páginas de Github la URL puede contener subcarpetas, tienes que modificar el index.html generado y cambiar href="/assets/xxx por href="./assets/xxx. O puedes utilizar la opción --base=/<subcarpeta>/ durante el proceso de construcción, como por ejemplo docker exec -i slidev npx slidev build --base=/slidev_docker/.

Y para evitar el proceso de construcción de Jekyll, es necesario añadir un archivo vacío denominado .nojekyll.

# Alojamiento con Docker

También puedes alojarlo por tu cuenta con Docker:

docker run --name myslides --rm -p 80:80 -v ${PWD}/dist:/usr/share/nginx/html nginx:alpine

O crea una imagen estática con el siguiente Dockerfile:

FROM nginx:alpine

COPY dist /usr/share/nginx/html

Crea la imagen de Docker: docker build -t mystaticppt .

Y ejecuta el contendor: docker run --name myslides --rm -p 80:80 mystaticppt

Puedes acceder a tus diapositivas desde http://localhost/

Echa un vistazo a tangramor/slidev_docker para más detalles.