Empezando con Hugo: Guía para principiantes

John Doe
2 min de lectura
Empezando con Hugo: Guía para principiantes

Introducción

Hugo es uno de los generadores de sitios estáticos de código abierto más populares. Con su increíble velocidad y flexibilidad, Hugo hace que crear sitios web sea divertido nuevamente.

¿Por qué elegir Hugo?

Aquí hay algunas razones convincentes para elegir Hugo para tu próximo proyecto:

  1. Ultrarrápido
  2. Fácil de aprender
  3. Altamente flexible
  4. Excelente comunidad

Configurando tu primer sitio Hugo

Vamos a recorrer juntos la creación de tu primer sitio Hugo:

terminal
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

# Crear un nuevo sitio Hugo
hugo new site mi-super-sitio
cd mi-super-sitio

# Inicializar git y agregar un tema
git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke themes/ananke

# Agregar el tema a tu configuración
echo "theme = 'ananke'" >> config.toml

# Crear tu primer artículo
hugo new posts/mi-primer-articulo.md

Trabajando con contenido

Hugo hace que crear contenido sea simple. Aquí está cómo organizar eficazmente tu contenido.

Características avanzadas

Hugo ofrece muchas características avanzadas desde el principio:

  1. Taxonomías: Categorías y etiquetas
  2. Shortcodes: Manera fácil de agregar contenido complejo
  3. Salidas personalizadas: JSON, AMP, etc.
  4. Procesamiento de recursos: SASS/SCSS, PostCSS

Ejemplos de código

Aquí hay un ejemplo de plantilla Hugo simple:

layouts/_default/single.html
1
2
3
4
5
6
7
8

{{ define "main" }}
<article>
    <h1>{{ .Title }}</h1>
    <time>{{ .Date.Format "2006-01-02" }}</time>
    {{ .Content }}
</article>
{{ end }}

Conclusión

Hugo proporciona una excelente base para crear sitios web modernos. Su combinación de velocidad, flexibilidad y facilidad de uso lo hace una excelente opción para proyectos de cualquier tamaño.

Próximos pasos

¿Listo para crear tu sitio web SaaS?

Únete a las empresas que ya utilizan nuestro tema para crear sitios web hermosos y de alto rendimiento.