# Introducción > Aprende a configurar tu primer proyecto de htmlpress: instala, escribe páginas, ejecuta y compila. Htmlpress es el generador de sitios estáticos para humanos y agentes. Convierte una carpeta de páginas Markdown y HTML en un sitio. Cada página conserva su propio marcado, y htmlpress añade un layout, un tema, una navegación y un servidor de desarrollo con recarga en vivo. Es un único binario de Rust, que se instala desde npm, PyPI o crates.io. Escribes Markdown sencillo o HTML semántico, o deja que tu agente lo escriba: los agentes los conocen mejor que cualquier lenguaje de plantillas, y cada página acaba con el aspecto del mismo sitio: sin framework, sin configuración de compilación, sin clases utilitarias. > **Warning** > > Htmlpress está en vista previa técnica: el contrato de las páginas aún puede cambiar antes de la 1.0. ## Qué obtienes - **Solo escribe Markdown o HTML.** Una página es cualquier archivo `.md` con frontmatter, o cualquier archivo `.html`, un documento completo o un simple fragmento, cuyas etiquetas `` y `<meta>` hacen lo que hace el frontmatter; consulta [Páginas Markdown](/es/authoring/markdown-pages/). - **Un tema que estiliza los elementos.** Los encabezados, las tablas, los bloques de código, `<details>`, `<figure>` y el resto se ven bien sin clases, en modo claro y oscuro. - **Elementos enriquecidos.** Avisos, pestañas, pasos, tarjetas, insignias, árboles de archivos, tablas ordenables, terminales, pestañas de paquetes (npm/pnpm/yarn/bun), diagramas de Mermaid e incrustaciones (YouTube, SoundCloud), todos como elementos personalizados `htmlpress-*`. - **Navegación gratis.** Una barra lateral anidada por carpetas, migas de pan, una tabla de contenidos, enlaces de anterior/siguiente y un enlace «Editar esta página». - **Multilingüe.** Traducciones junto a sus originales, un selector de idioma y la interfaz en siete idiomas incluidos; consulta [Traducciones](/es/customization/translations/). - **Pensado para agentes.** Cada compilación publica una copia en Markdown de cada página, `llms.txt` y tus skills de agente; todos los comandos hablan JSON. - **Personalizable.** Tokens `--htmlpress-*` y sobrescrituras por archivo del layout, los estilos y los componentes mediante una carpeta `.htmlpress/`. - **Un solo binario.** Sin runtime y sin dependencias: un sitio estático con `sitemap.xml`, `robots.txt` y una página 404, listo para cualquier hosting. ## Inicio rápido No necesitas nada más que el binario. Todos los canales distribuyen el mismo binario en la misma versión, así que elige el gestor de paquetes que ya use el proyecto. ### Instalar **Script** ```sh curl -fsSL https://htmlpress.dev/install.sh | sh ``` Descarga el binario de tu plataforma desde las [releases de GitHub](https://github.com/datisthq/htmlpress/releases), comprueba su SHA-256 y lo coloca en `~/.local/bin`. Define `HTMLPRESS_VERSION` para fijar una versión y `HTMLPRESS_INSTALL_DIR` para instalarlo en otro lugar. **npm** ``` npm install --global gethtmlpress # or run it without installing npx gethtmlpress --version ``` El paquete `gethtmlpress` incorpora un paquete de plataforma, como `@htmlpress/linux-x64`, mediante una dependencia opcional. Instalar con `--omit=optional` deja fuera el binario. **PyPI** ```sh pip install htmlpress # or run it without installing uvx htmlpress --version ``` El wheel de tu plataforma lleva el binario; no se ejecuta código de Python. **Cargo** ```sh cargo install htmlpress ``` Compila desde el código fuente con la toolchain de Rust, 1.88 o posterior. Hay binarios precompilados para Linux, macOS y Windows en x64 y arm64: | Plataforma | Paquete de npm | Target de Rust | | ------------- | ------------------------- | ---------------------------- | | Linux x64 | `@htmlpress/linux-x64` | `x86_64-unknown-linux-musl` | | Linux arm64 | `@htmlpress/linux-arm64` | `aarch64-unknown-linux-musl` | | macOS x64 | `@htmlpress/darwin-x64` | `x86_64-apple-darwin` | | macOS arm64 | `@htmlpress/darwin-arm64` | `aarch64-apple-darwin` | | Windows x64 | `@htmlpress/win32-x64` | `x86_64-pc-windows-msvc` | | Windows arm64 | `@htmlpress/win32-arm64` | `aarch64-pc-windows-msvc` | En cualquier otra plataforma, compila con `cargo install htmlpress` y, para el paquete de npm, apunta `HTMLPRESS_BINARY` al resultado. ### Configurar La configuración es opcional. Para definir los metadatos del sitio, crea `htmlpress.yaml` en la raíz de tu proyecto: ```yaml title: My docs description: Documentation for my project include: docs/**/*.html ``` Sin `include`, cada archivo `.html` del proyecto es una página; con él, solo lo son los que coinciden, servidos sin la base del glob, así que `docs/usage.html` queda en `/usage/`. Consulta [Archivo de configuración](/es/customization/configuration-file/) para ver todas las claves. ### Añadir contenido - docs/ - index.html - getting-started.html - usage.html Cada página define su título, descripción y orden en etiquetas que también puede llevar un fragmento: **HTML** ```html <title>Getting Started

Getting Started

Welcome!

``` **Markdown** ```md --- title: Getting Started description: Set up the project in five minutes. order: 1 --- # Getting Started Welcome! ``` Consulta [Frontmatter](/es/authoring/frontmatter/) para saber qué significa cada etiqueta. ### Ejecutar ```sh htmlpress start # dev server with live reload at http://localhost:8000 htmlpress build # production build to .htmlpress/build/ htmlpress preview # serve the production build locally htmlpress clear # remove .htmlpress/build/ ``` Ese es todo el ciclo. Añade `.htmlpress/build/` a tu `.gitignore`. Este sitio se compila así a partir de la carpeta [rust/docs/](https://github.com/datisthq/htmlpress/tree/main/rust/docs) del repositorio. ## Estructura del proyecto Un sitio típico de htmlpress: - my-project/ - htmlpress.yaml — configuración (opcional) - index.html — la página de inicio - guides/ — un grupo de la barra lateral, con el nombre de su `index.html` - index.html - build.html - logo.svg — cualquier otro archivo, copiado tal cual - .htmlpress/ — escapes y la salida de la compilación - layout.html - build/ Un archivo en `.htmlpress/` en la ruta de uno integrado, como `layout.html`, `styles/tokens.css` o `components/tabs/tabs.css`, reemplaza al predeterminado, así que puedes personalizar el layout, el tema y los componentes sin hacer un fork. Ejecuta `htmlpress escape ` para copiar un archivo predeterminado a `.htmlpress/`, listo para editar. ## Comandos ### `htmlpress build [root]` Renderiza el proyecto en `root` (por defecto `.`) en `root/.htmlpress/build`, reemplazando lo que haya. `--out` / `-o` elige otra carpeta; se rechaza una que contenga el proyecto, o una carpeta visible dentro de él, ya que sus páginas se volverían a leer como fuentes. ```sh $ htmlpress build docs built 6 pages and 0 files into docs/.htmlpress/build ``` ### `htmlpress start [root]` Compila el proyecto, lo sirve en `http://localhost:8000` y lo recompila con cada cambio. Las páginas abiertas se recargan solas después de cada compilación. Una compilación fallida imprime su error y lo muestra en el navegador: sobre las páginas ya abiertas y en lugar de cualquier página que se abra después. El servidor sigue en marcha, aunque falle la primera compilación, y la siguiente compilación correcta recarga todas las páginas. Si el 8000 está ocupado, prueba el 8001 y sigue hasta el 8009, e imprime la URL que obtuvo. `--port` / `-p` indica un puerto concreto (`0` elige cualquiera libre). `--host` solo sirve en todas las direcciones, para que un teléfono en la misma red pueda abrir el sitio, e imprime también esa URL; `--host
` sirve en una. Con `base` en `htmlpress.yaml`, el sitio se sirve bajo esa ruta, las URL impresas la incluyen y `/` lleva allí; reinicia después de cambiar `base`. `--open` abre el sitio en el navegador en cuanto escucha; `--open ` abre esa página, bajo `base`. `--out` / `-o` funciona igual que en `build`. ```sh $ htmlpress start docs --host serving http://localhost:8000 network http://192.168.1.107:8000 ``` ### `htmlpress preview [root]` Compila el proyecto para producción y lo sirve tal como se desplegará: sin vigilar cambios ni recargar. Acepta `--port`, `--host`, `--open` y `--out` como `start`. ### `htmlpress clear [root]` Elimina la salida de la compilación (`--out` para indicar otra), con la misma protección que `build`. ### `htmlpress escape [names…]` Copia archivos integrados a `.htmlpress/` para editarlos: un nombre es una ruta como `components/tabs/tabs.js`, o la etiqueta de un componente para todos sus archivos. Sin nombres, lista cada archivo integrado e indica si el proyecto lo ha escapado. `--root` / `-r` elige el proyecto (por defecto `.`). Se niega a sobrescribir un archivo; consulta [Sobrescritura/Escape](/es/customization/overriding-escaping/). ```sh $ htmlpress escape htmlpress-tabs escaped .htmlpress/components/tabs/tabs.css escaped .htmlpress/components/tabs/tabs.js ``` ### Para scripts y agentes La CLI está construida con [Fireargs](https://fireargs.dev), así que todos los comandos hablan JSON. `--json` imprime el resultado como JSON y, con un valor, también recibe la entrada como JSON: ```sh $ htmlpress build docs --json { "output": "docs/.htmlpress/build", "pages": 6, "files": 0 } $ htmlpress build --json '{"root":"docs","out":"dist"}' ``` `htmlpress start --json` y `preview --json` nunca terminan, así que imprimen `{"url": "…", "network": []}` en una línea en cuanto el servidor escucha. `htmlpress --llms` imprime el esquema de entrada y salida de cada comando como una lista de herramientas con forma de MCP, para que un agente aprenda la CLI sin leer esta página. ## Personalización Htmlpress está pensado para verse bien sin configuración y no estorbarte cuando necesitas más. Personalizaciones habituales: - **Metadatos del sitio**: título, descripción, favicon, logo. Consulta [Metadatos del sitio](/es/customization/site-metadata/). - **Secciones**: agrupa las páginas por carpeta en la barra lateral. Consulta [Secciones de artículos](/es/customization/article-sections/). - **Enlaces externos**: enlaces en la cabecera y la barra lateral hacia cualquier sitio. Consulta [Enlaces externos](/es/customization/external-links/). - **Sobrescritura/Escape**: reemplaza el layout, cualquier hoja de estilos o componente desde tu proyecto. Consulta [Sobrescritura/Escape](/es/customization/overriding-escaping/). - **Agentes de IA**: lo que cada compilación publica para los agentes. Consulta [Agentes de IA](/es/customization/ai-agents/). ## Documentación La documentación completa está en **[htmlpress.dev](https://htmlpress.dev)**: - [Referencia de redacción](/es/authoring/): cada elemento y componente con ejemplos - [Personalización](/es/customization/): cada opción, con fragmentos listos para copiar y pegar - [Despliegue](/es/deployment/): publicar la compilación en un hosting - [Contribuir](/es/contributing/): configuración local y flujo de PR ## Recursos - **npm**: [npmjs.com/package/gethtmlpress](https://www.npmjs.com/package/gethtmlpress) - **PyPI**: [pypi.org/project/htmlpress](https://pypi.org/project/htmlpress/) - **crates.io**: [crates.io/crates/htmlpress](https://crates.io/crates/htmlpress) - **GitHub**: [github.com/datisthq/htmlpress](https://github.com/datisthq/htmlpress) - **Incidencias**: [github.com/datisthq/htmlpress/issues](https://github.com/datisthq/htmlpress/issues) - **Discusiones**: [github.com/datisthq/htmlpress/discussions](https://github.com/datisthq/htmlpress/discussions) ## Licencia MIT; consulta [LICENSE.md](https://github.com/datisthq/htmlpress/blob/main/LICENSE.md).