Hugo, a fast, flexible and static website builder

In the next article we are going to take a look at Hugo. This is one of the open source static site generators most popular, which is also completely free. With its amazing speed and flexibility, this generator makes website building quick and easy. Is about a generator sitios web Static HTML and CSS written in Go. It is optimized for speed, ease of use, and configurability.

Creating a website is a process that requires some time and knowledge of HTML and other languages. For this reason, this static site builder can be of great help in creating websites quickly. It should be clarified that when we talk about static websites we mean sites that do not process data. That is, they cannot process forms or generate documents. These websites are generally made for small projects and informational sites.

General characteristics of Hugo

• A high speed. As stated on their website, this is the fastest tool of its kind. The average site is built in less than a second.
• Robust content management and flexibility rules. Hugo is a content strategist's dream. Hugo supports unlimited content types, taxonomies, menus, API-driven dynamic content, and more, all without add-ons.
• Shortcodes offer us the ability to use Markdown syntax, providing great flexibility.
• Integrated templates. This static website builder has common patterns to create our work quickly. Hugo ships with pre-made templates to do quick SEO work, comments, analytics, and other features.
• Custom outputs. Allows us generate our content in multiple formats, including JSON or AMP, and thus facilitate the creation of content.
• More than 300 themes available, giving us a robust theme system that is easy to implement, yet capable of producing even the most complicated websites. Can be cast a look at the topics available on the project website.

Install Hugo on Ubuntu

Hugo is quite a popular program and this makes installing it on Gnu / Linux and specifically Ubuntu a simple process. The first available installation option will be using the precompiled packages that can be found in the project release page. To download the .deb package, we will only have to open a terminal (Ctrl + Alt + T) and execute the following command:

wget https://github.com/gohugoio/hugo/releases/download/v0.69.0/hugo_0.69.0_Linux-64bit.deb

After the download, we will be able to install it by executing this other command in the same terminal:

sudo dpkg -i hugo_0.69.0_Linux-64bit.deb

At the end of the installation we can start working.

Another possibility to install this program will be through your snap pack. Installation will be as simple as opening a terminal (Ctrl + Alt + T) and typing in it:

sudo snap install hugo

First Steps

Hugo is a website builder. So the first thing we need to do is create a new site using the following format:

hugo new site [nombre-del-sitio]

For this example I have created a new site with the command:

hugo new site sinforoso

This will create a new folder called winding In the address book home of user. To begin we are going to access this folder and we will start the work from there.

The next thing we will do is add a new theme for the site. If you want to add all available themes, you can use the command:

git clone --depth 1 --recursive https://github.com/gohugoio/hugoThemes.git themes

This installs all the Hugo themes, so it can take a long time. It can be helpful to try which one you want. In my case, I chose a specific topic, so instead of the above command I used the following:

git clone https://github.com/matcornic/hugo-theme-learn.git themes/learn

It is important that we place the topics in the binder Topics, which we are going to find inside the folder in which we are working.

After installing the theme, we must tell Hugo to use that particular theme. To do this we must define it in the config.tom file, which we will find in the working folder as indicated in the following screenshot.

Once the changes are made, we save and close. Now all we have to do is create a new index to display on the site. We will do this with the following command:

hugo new _index.md

As you can see, the file has an md extension, this means that we can add content using Markdown. This file can be found and edited within the content folder.

We can also create new categories to shape the site:

hugo new [categoría]/[archivo.md]

At this point, to view our website, we will use the following command:

hugo serve

And as you can see in the following screenshot, our website will be available from the browser at http: // localhost: 1313.

In short, Hugo is a program that only creates static websites, but it is very useful in certain cases. You can get more information about the project in your site or official documentation.