conf

Talks and workshops from 2022

Live Q&A

Live Q&A with Hugo creator - Steve Francia

Steve Francia

Steve Francia

Creator of Hugo

Google

Learn the origin story of Hugo and how it's progressed into the flourishing open source project it is today.

Tech Talk

Giving your Content Team Full Autonomy with a Hugo CMS

David Large

David Large

HugoConf Co-Organizer

CloudCannon

Hand over the reins of your Hugo site to your content team with CloudCannon. In this talk we will learn how to build pages visually, use a custom component library, and simplify collaboration on your Hugo projects.

Tech Talk

How Hugo handles your pages (technically speaking): Lexer, Parser and Goldmark

We will reverse engineer Hugo and study its internal structure. We will focus on the three main components devoted to process Markdown content:, the lexer, the parser and Goldmark. We will find out where in the code each one of these components is located, what they take as input and what they produce as output. We will discuss some of the technical choices made by the developers and their pros and cons. This is a great starting point for anybody who would like to help develop Hugo or would like to know more about its inner structure.

Lightning Talk

Supercharge your Deployment with Cloudflare Pages

Gift Egwuenu

Gift Egwuenu

Developer Advocate

Cloudflare

Cloudflare Pages is a super-fast way to deploy your sites directly from your Git provider. This talk will cover how to set up your Hugo websites with Cloudflare Pages, and we’ll explore all the features you get out of the box using Pages for deployment.

Lightning Talk

Making News Apps with the THANG Stack

Carl M. Johnson

Carl M. Johnson

Director of Technology

Spotlight PA

News never stops, so it’s important to be able to make maintainable sites quickly. The THANG Stack (Tailwind, Hugo, Alpine.js, Netlify, and Go) helps me launch on deadline.

Lightning Talk

Implementing conditional processing in Hugo

Kimberley Brown

Kimberley Brown

Frontend Developer

Nuance Communications

Some of the Nuance TechPubs content is shared between products. In particular, many components are available both in hosted and on-premises environments. And while most of the content is similar between both environments, some content is environment-specific, and we needed to find a way to tag that content and include or exclude it as needed. To solve this issue, we created our own shortcodes and updated the theme to be able to show and hide content as needed. This presentation will give a quick demo of how we implemented this approach.

Tech Talk

Helping Humans at Scale with Continuous Delivery of Hugo on AWS

Noah Gift

Noah Gift

Executive in Residence, Master in Interdisciplinary Data Science

Duke University

Learn to create Hugo websites that continuously deploy to AWS S3 Static Hosting and Amazon CloudFront CDN. One of the advantages of building on top of the AWS cloud is that it is a globally distributed highly available system. In this talk, I walk through how to create and then continuously deploy training content-based websites through AWS technologies and Github.

Tech Talk

My journey from LAMP stack to Jamstack with Hugo!

Miguel Useche

Miguel Useche

Freelance Web Developer

After doing websites with LAMP stack for 2 decades I decided to give a try to JAMStack with Hugo, and I fell in love with Hugo at first sight. This talk will show the first steps and results of working with Hugo from the perspective of a LAMP stack developer. People will know the difference between the platforms, why I chose Hugo, how Hugo improved the development process, the quality of the website and how it reduced my deployment time without investing too much time on learning it.

Lightning Talk

HABIT Stack — an elegant solution for component-driven development

Jan Claasen

Jan Claasen

Web Developer

CloudCannon

In this talk I’ll discuss the stack I use to create websites for Twitch (and also the HugoConf website) — comprised of Hugo, Alpine.js, Bookshop, and Tailwind CSS. With this stack I’m able to create sites that show the best of component-driven workflows, ideal for both efficient development and for non-technical content editors to add content, build pages, and keep the sites up to date over time.

Lightning Talk

Get started with Front Matter CMS to manage your site

Elio Struyf

Elio Struyf

Lead DevTools Engineer

RapidAPI

Are you looking for a CMS to manage your site? Front Matter is a Visual Studio Code extension that provides CMS functionality, so you never have to leave your editor. In this lightning talk, Elio will guide you through the installation and configuration process to know the proper steps when you start using it.

Lightning Talk

Word to Web with Hugo in 5 Minutes

Mark McFadden

Mark McFadden

Software Developer

For good or bad, the work world's predominant application for word processing is Microsoft Word. Given that a great deal of enterprise knowledge is stored in Word, and that same information is useful for many other purposes, it is beneficial to understand how to use Word to quickly create web pages that can be shared across the organization. This talk will show you how, using Hugo. The talk’s public repo: https://github.com/m2web/word-to-web

Tech Talk

Introducing Pagefind: static low-bandwidth search at scale

Liam Bigelow

Liam Bigelow

Senior Software Engineer

CloudCannon

In this talk I’ll introduce Pagefind, a new open-source library for static websites that provides efficient search at scale without any extra infrastructure. I’ll demonstrate the process of adding Pagefind to a new site, and also show how well it works at scale — for example, Pagefind can return a search query against the entirety of MDN with a network payload as low as 300KB.

Tech Talk

Limitless HTTP requests with Hugo: from basic GET to GraphQL

In this talk, we’ll explore resources.GetRemote, the new HTTP request solution for Hugo! We’ll cover basic GET requests and see how to process their response data or handle their errors. Then we’ll experiment with more complex POST and UPDATE requests in the context of managing a search index with MeiliSearch REST API. Finally, we’ll use the Shopify Storefront API as a case study for performing GraphQL requests with Hugo!

Tech Talk

Going wild with Hugo modules

Jeanne Haskett

Jeanne Haskett

Content Architect & Senior Principal Technical Writer

Nuance Communications

Kimberley Brown

Kimberley Brown

Frontend Developer

Nuance Communications

Nathalie Laroche

Nathalie Laroche

Senior Principal Technical Writer

Nuance Communications

The Nuance TechPubs team produces documentation for multiple products. Because these products are stand-alone, they require their own Hugo projects. But we needed to reuse content between projects and ensure that products in the same line share the same look and feel. To implement this, we went wild with Hugo modules! This presentation will show how we: created a module that contains the building blocks that apply to all projects; stored project-specific assets, layouts, and content in this module; created modules for components that are shared between products; and used the Hugo configuration files to pull in the correct content.

Lightning Talk

Making Image Uploads Faster with Figmage

Ravi Lingineni

Ravi Lingineni

Creator

Figmage

A picture speaks a thousand words. But it's also tough to write a thousand words right on the first try. The colors are off, the sizing can be wrong, or maybe the image just doesn't vibe with your content as well. And of course, every time you tweak the design, you have to export it, re-upload it, and re-deploy. Re-upload, re-deploy. In this talk, learn about Figmage, and how it saves you from the image upload cycle.

Lightning Talk

Resize all images

Joost van der Schee

Joost van der Schee

Web Developer and Owner,

Usecue BV

Images are an important part of your page load (20% on average). I will show you how you can resize all images in your Hugo project, even when you are using an external CMS for content and when you have clients uploading these images. Every byte counts when you want to get a 100% Google Lighthouse Score.

Lightning Talk

Why PaperCut went static with Hugo and Cloudcannon

Chris Dance

Chris Dance

CEO and Co-Founder

PaperCut

Grayson Campbell

Grayson Campbell

Digital Media Lead

PaperCut

We discuss minimizing waste with print management software, the value of coffee, and our process of migrating and consolidating PaperCut’s sites from legacy stacks to Hugo.

Lightning Talk

Meet Quiqr

Pim Snel

Pim Snel

Founder

Quiqr

Quiqr in nutshell. A tour through all major CMS and publishing features. After these five minutes, it will take you only another ten minutes to have your own Quiqr maintained Hugo website live.

Tech Talk

Demystifying Internationalization with Hugo

Jon Yablonski

Jon Yablonski

Senior Product Designer

Mixpanel

Preparing a website for an international audience comes with lots of technical complexities. How do you manage multiple languages flexibly and efficiently using Hugo? How do you make the appropriate design adjustments for each language in a way that doesn’t result in duplicative CSS? In this talk, we’ll answer these questions while walking through the technical details behind the new Arabic edition of Laws of UX (lawsofux.com/) and exploring Hugo’s Multilingual Mode, how to translate content based on i18n configuration, and CSS logical properties.

Tech Talk

Mistakes I want to avoid for my next Hugo theme

Emruz Hossain

Emruz Hossain

Software Engineer

AppsCode Inc.

Initially, I had built the Toha Hugo theme for my own portfolio. Then, I shared the theme with the community. When the theme got popular, I started to get feature requests that I hadn't planned before. People started using the theme for different use-cases that weren't intended initially. As a result, I had to keep changing the theme to accommodate their needs. However, it is hard to change something that is being used by hundreds of people. In this talk, I will share the experience I have gained as I maintain the theme. I will share the mistakes I have made, and how can we avoid them.

Tech Talk

Beyond the Static: Adding Interactivity to Your Hugo Sites

Ado Kukic

Ado Kukic

Director, Developer Advocacy

DigitalOcean LLC

We all know Hugo as one of the best static site generators available today, but whether you're using Hugo to host your personal blog, marketing website, or other web application, sometimes you want to add a little bit of interactivity. In this talk, we'll explore how you can go beyond the static and add interactivity with built-in Hugo capabilities as well as explore how you can augment your Hugo site with serverless functions to get the best of: performance, speed, and productivity.

Tech Talk

Reduce, reuse, reward: How to not repeat yourself in your docs

Aaron Collier

Aaron Collier

Technical Education Manager

Platform.sh

Keeping documentation up to date can be a big task. It's even harder when you need to change one detail in many places. This talk will look at how to take advantage of features in Hugo to effectively reuse content in documentation. That way you can update once and have it apply to multiple locations. The talk will also touch on some of the potential pitfalls to look out for and how to organize for success.

Tech Talk

Custom Shortcodes for the Win

Chris Griffing

Chris Griffing

Senior Software Developer

Shortcodes provide a nice clean way of making reusable functionality within your content pages. We will focus on explaining their syntax and some of their constraints while demonstrating how to create dynamic image placeholders using some of Hugo's existing image manipulation tools. These placeholders improve the User Experience of a site in several important ways that we will go into more depth about.

Lightning Talk

How to build a Developer profile

Ashish Tiwari

Ashish Tiwari

Developer Advocate

Elastic

As a Developer, there are the things that we want to share with others. It might be a code snippet, tech concept, use cases, solutions, or to showcase your projects and experiences. As a terminal lover I was always concerned whether I can write my blog in Vim, or whether I could release my blog in the same way I release my features. In this talk, I am going to share some tips on how to set up the platform in a developer environment only. Also, I will discuss some tools which helped me to build my profile at ashish.one.

Lightning Talk

Using PurgeCSS with Hugo

Christian Oliff

Christian Oliff

Front-end Web Developer

Trimble

A quick guide to setting up PurgeCSS with PostCSS to automatically optimize the CSS on your site by only including the classes that you use. The sample repo for this talk is available at https://github.com/coliff/purgecss-test

Workshop

Build an Open Source Blogging Platform With Appwrite and Hugo

Haimantika Mitra

Haimantika Mitra

Developer Advocate

Appwrite

We will see how we can build a blogging platform in a few minutes with Hugo and Appwrite. We will use Appwrite to store the content and use Hugo to build with the content that is stored in Appwrite.

Workshop

Editing Hugo live in the browser: how to bring page-building workflows to your Hugo sites with Bookshop

Liam Bigelow

Liam Bigelow

Senior Software Engineer

CloudCannon

This workshop will demonstrate how to add Bookshop, a component development workflow for static websites, to a Hugo site. Bookshop helps you develop and reuse components across your site, browse a local component library, and create a rich live-editing experience in the browser. Most importantly, Bookshop works with Hugo templates, improving your DX while shipping a #leanweb to your users.

Workshop

Using GitHub Pages with Actions to deploy Hugo sites in seconds

Tommy Byrd

Tommy Byrd

Senior Software Engineer

GitHub

If you've used GitHub and Hugo, you've probably heard of or maybe even use GitHub Pages. Until recently, the only way to deploy a site to Pages using something other than Jekyll was to run the build externally and commit the output back to a special branch of your repository. In this workshop, I'll cover a new workflow that treats all static site generators the same, and unlocks the potential of using GitHub Actions to build and deploy a Hugo site in seconds, without ever leaving your browser.

Workshop

Quiqr workshop for Hugo site developers

Pim Snel

Pim Snel

Founder

Quiqr

This workshop shows how to quickly develop websites for non-technical customers. We're going to add a Quiqr CMS layer on top of an existing Hugo Theme. I'll show some CMS developing patterns and best practices. As a bonus we will move the theme styling from code to a non-technical user interface. Finally I'll show how to share a Quiqr made website to the end user.

Workshop

How to Achieve Perfect Google Lighthouse Scores Using Hugo

Scott Reilly

Scott Reilly

CEO

Reilly Media

I will provide a step by step breakdown on how to find the easter egg in Google Lighthouse when you achieve perfect scores by using Hugo.

HugoConf 2022 Wrap up video