Fedora 27 : Tips and tricks with hugo framework .

he most important fact in learning development is knowing the information flow and how to drain it knowing the elements and stages of information processing of the content.
That's why I wrote this article succinctly to show you how simple basics of exemplification can correctly complete and help the user to modify and create content.
I will show you how to follow steps into hugo framework and website development with hugo.
You need to read the basic of hugo terms from documentation if you want to learn all about hugo or take some helpful information.
First use --verbose flag gives extra information that will be helpful when we debug or build your hogo website.
You need to know your hugo version because is the old versions has bad issues, check it with:

$ hugo version

The next command is to see and debug your work:

$ hugo --verbose 

How hugo framework works when you start for the first time with hugo development.
Now, the first place that Hugo will look for rules and files is in the layouts/ directory so it will always find the skin.
If you start with hugo then you can change the default.
This files name skins are the files responsible for the look and feel of your site.
You have two ways to create a skin:

• create it in the layouts/ directory;
• create it in a sub-directory of the themes/ directory.

A skin in layouts/ folder can’t be customized without updating the templates and static files that it is built from.
The skin created in themes/ folder , can be and that makes it easier for other people to use it.
In my example tutorial , I add this text to themes/test_themes_001/layouts/index.html.
The result of running hugo server command will rput this text on your browser at 127.0.0.1:13131, see command:

$ hugo server --buildDrafts

The hugo command come with many features like :

• --buildDrafts this include content marked as draft ( see files with draft:true from .md file);
• --ignoreCache this ignores the cache directory if you use it;

Using --verbose let you to see your errors.
For example a bad template or configuration can come with this error:

 ...Unable to locate layout for "taxonomyTerm" ...

This show you what term created by you is not on your hugo development area.
I make just few changes to show you how the hugo working. First I create the website named hugo_website_001. I used hugo command to add some pages first_test.md and new.md and a theme named test_theme_001, see:

$ hugo new site hugo_website_001
$ cd hugo_website_001
$ hugo new theme test_theme_001
$ hugo new first_test.md
$ hugo new new.md
$ tree 
.
├── archetypes
│   └── default.md
├── config.toml
├── content
│   ├── first_test.md
│   └── new.md
├── data
├── fpaste_hugo.txt
├── layouts
├── public
│   ├── categories
│   │   └── index.xml
│   ├── css
│   ├── index.html
│   ├── index.xml
│   ├── js
│   ├── sitemap.xml
│   └── tags
│       └── index.xml
├── static
└── themes
    └── test_theme_001
        ├── archetypes
        │   └── default.md
        ├── layouts
        │   ├── 404.html
        │   ├── _default
        │   │   ├── list.html
        │   │   └── single.html
        │   ├── index.html
        │   ├── index.html.save
        │   └── partials
        │       ├── footer.html
        │       └── header.html
        ├── LICENSE.md
        ├── static
        │   ├── css
        │   └── js
        └── theme.toml

19 directories, 20 files
$ 

Let's see files for settings - the toml file type. First is the config.toml file:

baseURL = "http://localhost.com"
languageCode = "en-us"
title = "My New Hugo Site"
theme = "test_theme_001"
contentdir ="content"
publishdir = "public"

The next file is the theme.toml .

# theme.toml template for a Hugo theme
# See https://github.com/gohugoio/hugoThemes#themetoml for an example

name = "Test_theme_001"
license = "MIT"
licenselink = "https://github.com/yourname/yourtheme/blob/master/LICENSE.md"
description = "first theme with hugo"
homepage = "http://example.com/"
tags = ["tags","categories"]
features = []
min_version = "0.31"

[author]
  name = "catafest"
  homepage = "free-tutorials.org"

# If porting an existing theme
[original]
  name = ""
  homepage = ""
  repo = ""

I will show a minimal example to understand the changes you need to make to run well with hugo framework and the my custom theme.
I show next how this changes into files is show by hugo on browser.
The basic file load is the index.html from themes/test_theme_001/layouts folder with tag h2 and text Some text !, see:

Some text !

{{ partial "header.html" . }}
This file load another file from partials folder and is named header.html with tag p and this text:

This is a custom header

Let's run the hugo server :

hugo server --theme=test_theme_001 --buildDrafts --ignoreCache --disableFastRender

This is result is this: