Building hugo with termux and deploying to Github

Building hugo with termux and deploying to Github

September 17, 2024·Adallei
Adallei
This article is to use termux build hugo and deploy to github some basic tutorials, advanced tutorials will be written in the follow-up.

Foreword

Hugo is a static website generation engine written in the go language, known for its speed and claimed to be “The world’s fastest framework for building websites”
Termux is a terminal emulator on Android. It is very powerful and can run some linux applications. So you can use termux as a terminal to build hugo.

ℹ️
This post will be divided into two parts: Build and Deployment.

Build

Preparations Work

Before you start, you need to download termux and install the relevant packages before you can start the build.

  • Download termux
  • Download and install open termux on GitHub or F-droid.
  • Getting storage access
    termux-setup-storage
  • update package
    pkg upgrade -y
  • Installation of related tools (git and vim)
    pkg install git vim -y

Installation & Use

  • Install hugo
  • Install
    pkg install hugo -y
  • Create a web page
  • Create a new site
    hugo new site (Your site name)
  • Download & Install Theme
    cd (Your site name)
    cd themes
    git clone (Theme Download Address)

Hugo doesn’t have a theme by default, so you need to install a theme before you can use hugo.
Find a hugo theme online then replace (Theme Download address) with the theme you found.
Or just download the theme’s source code and extract it to the themes directory.
Themes may be installed in slightly different ways, you need to find the official installation tutorial released by the theme and follow it.

  • Starting services
    hugo server

Be careful to execute it in the root directory of the site, which is the (Your site name) directory.
After successful startup, you can browse the site by typing localhost:1313 into your browser.
The default configuration file when you enter this command is in toml format, if you are used to yaml format then enter
hugo convert toYAML [flags] [args]
Convert all front content in the content directory to front content using the yaml format

  • Write an article
  • New article
    hugo new content/(Article directory)…/Article name.md

The front matter structure of the article is:
title: Title of the article
date: The date the article was published (usually in YYYY-MM-DD format)
author: Author’s name
draft: Whether it is a draft (true or false)
tags: List of tags for organizing articles
categories: Category list for categorizing articles
slug: Custom short paths in URLs
summary: A summary of the article, usually used on listing pages
keywords: Page keywords for SEO
description: Page descriptions for SEO
aliases: Redirect list for old URLs
type: The content type, which determines the template used for that content.
layout: Specify the template layout to be used
The article adopts Markdown markup language, you can go to Markdown Guide to see how to use it!

  • Summary

Above is the basic construction of the page, if you want to customize your hugo or encountered any errors please refer to theOfficial Hugo Documentation.

Deployment

Preparations on github

  • Account&Repository
  • Register for a github account
  • Establishment of remote repository

Create a new repository in github, and make sure the name of the repository is your github username.github.io.
Others can be filled in or not.

  • Setting up therepository
    Access to repository settings/Pages
    Change the source option under build and dissolve to deploy from branch.

The use of git

  • Configuration
  • Go to the public directory in the site
    cd /…/(Your site's path)/public

If you don’t have a file under public you need to type in (your site path).
hugo -D
to generate static files

  • Configure user information
    git config --global user.name "(Your username)"
    git config --global user.email "(Your email address)"

Note: (Your username) and (Your email address) need to be different from the ones on GitHub.

  • Initialize the directory as a git repository
    git init

If you enter it once and it doesn’t work, enter it twice.

  • Adding a remote repository
    git remote add (The alias, usually origin) "(SSH link to the repository)"

To add an SSH link using git remote add, you first need to know the SSH link to the github repository first.
Click code on the repository home page and then click SSH to see the SSH link to the repository.

  • View repository Information
    git remote -vv
  • SSH key generation key pairs
    ssh-keygen -t rsa -C “(Comment)”

Getting the generated public key is usually in the .ssh file in Termux’s home directory, which can be opened in the native files of the desktop, or authorized to be opened by other applications.
Find the id.rea.pub file in the .ssh directory, open it as text and copy everything in it, then paste the copied content into GitHub.
Click on your avatar on the GitHub website, then click on Settings and find SSH and GPG Keys. Click New SSH Kays and paste what you just copied under the key and click Add SSH Key to add the key, and if you need to enter a password, enter your GitHub password.

  • Commit all files under public to the data staging area
    git add .
  • Submission of document changes
    git commit -m "(Push message)"
  • Push
    git push -u origin main

origin is the alias mentioned above.
main stands for the master branch, if push to the main branch fails
you can use the command:
git pull -f origin main
to force a push, using this command will force overwriting the remote repository code with local code.
If the above doesn’t work, type:
git push -u origin master
master is the default branch name.
After pushing you need to go to Pages in the settings in your GitHub repository and change Branch to master.

  • Summary

Above is the deployment of hugo on GitHub.
There’s another way to deploy using GitHubActions check out Hugo Official Website
Finally, thank you for watching and I hope this has been helpful!