Golang html templates example

Templates

I’d like to tell you, that my platform Go Web Examples Courses just launched. Enjoy easy to follow video courses about web devlopment in Go. Make sure to check out the special offer I have for early supporters.
We’ll see us over there! 🙂

Introduction

Go’s html/template package provides a rich templating language for HTML templates. It is mostly used in web applications to display data in a structured way in a client’s browser. One great benefit of Go’s templating language is the automatic escaping of data. There is no need to worry about XSS attacks as Go parses the HTML template and escapes all inputs before displaying it to the browser.

First Template

Writing a template in Go is very simple. This example shows a TODO list, written as an unordered list (ul) in HTML. When rendering templates, the data passed in can be any kind of Go’s data structures. It may be a simple string or a number, it can even be nested data structure as in the example below. To access the data in a template the top most variable is access by > . The dot inside the curly braces is called the pipeline and the root element of the data.

data := TodoPageData PageTitle: "My TODO list", Todos: []Todo Title: "Task 1", Done: false>, Title: "Task 2", Done: true>, Title: "Task 3", Done: true>, >, >

h1>>h1> ul> > > li class="done">>li> > li>>li> > > ul>

Control Structures

The templating language contains a rich set of control structures to render your HTML. Here you will get an overview of the most commonly used ones. To get a detailed list of all possible structures visit: text/template

Control Structure	Definition
>	Defines a comment
>	Renders the root element
>	Renders the “Title”-field in a nested element
> > >	Defines an if-Statement
> > >	Loops over all “Todos” and renders each using >
> >	Defines a block with the name “content”

Parsing Templates from Files

Template can either be parsed from a string or a file on disk. As it is usually the case, that templates are pares from disk, this example shows how to do so. In this example there is a template file in the same directory as the Go program called layout.html .

tmpl, err := template.ParseFiles("layout.html") // or tmpl := template.Must(template.ParseFiles("layout.html"))

Execute a Template in a Request Handler

Once the template is parsed from disk it’s ready to be used in the request handler. The Execute function accepts an io.Writer for writing out the template and an interface<> to pass data into the template. When the function is called on an http.ResponseWriter the Content-Type is header is automatically set in the HTTP response to Content-Type: text/html; charset=utf-8 .

func(w http.ResponseWriter, r *http.Request)  tmpl.Execute(w, "data goes here") >

The Code (for copy/paste)

This is the complete code that you can use to try out the things you’ve learned in this example.

package main
 
import ( "html/template" "net/http" )
 
type Todo struct  Title string Done bool >
 
type TodoPageData struct  PageTitle string Todos []Todo >
 
func main()  tmpl := template.Must(template.ParseFiles("layout.html")) http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request)  data := TodoPageData PageTitle: "My TODO list", Todos: []Todo Title: "Task 1", Done: false>, Title: "Task 2", Done: true>, Title: "Task 3", Done: true>, >, > tmpl.Execute(w, data) >) http.ListenAndServe(":80", nil) >

h1>>h1> ul> > > li class="done">>li> > li>>li> > > ul>

Источник

Шаблонизатор в Golang при создании веб-приложения

Давайте вдохнем в наш проект немного жизни и создадим красивую домашнюю страницу для нашего веб-приложения. В следующих нескольких уроках мы будем заниматься созданием страницы, которая выглядит следующим образом:

Рекомендуем вам супер TELEGRAM канал по Golang где собраны все материалы для качественного изучения языка. Удивите всех своими знаниями на собеседовании! 😎

Мы публикуем в паблике ВК и Telegram качественные обучающие материалы для быстрого изучения Go. Подпишитесь на нас в ВК и в Telegram. Поддержите сообщество Go программистов.

Для этого создадим файл шаблона в папке ui/html

Добавим в него следующую HTML разметку для домашней страницы:

Snippetbox

Последние заметки

На заметку: В следующих уроках для файлов шаблонов мы будем использовать именование следующего формата ..tmpl , где будет одно из трех page , partial или layout . Возможность определить роль шаблона из самого названия файла поможет нам, когда придет время создания кеша шаблонов.

Итак, теперь, когда мы создали файл шаблона с HTML разметкой для домашней страницы, возникает вопрос: как заставить обработчик главной страницы home() показать его?

Для этого потребуется импортировать пакет Go html/template, который предоставляет множество функций для безопасного чтения и рендеринга HTML шаблонов. Можно использовать функции из данного пакета для парсинга файла шаблона, а затем выполнить сам шаблон.

Продемонстрируем это в деле. Откройте файл cmd/web/handlers.go и добавьте следующий код:

Важно отметить, что путь к файлу, который вы передаете функции template.ParseFiles() , должен быть либо относительно вашей текущей рабочей папки, либо абсолютным путем. В приведенном выше коде мы указали путь относительно корня папки проекта.

Итак, с учетом сказанного убедитесь, что вы находитесь в корневой папке вашего проекта, и перезапустите веб-приложение:

Откройте страницу http://127.0.0.1:4000 в браузере. Вы заметите, что домашняя страница начала приобретать новый вид:

Основы использования шаблонизатора в Go

При добавлении дополнительных страниц в веб-приложение будет использоваться некоторая общая стандартная HTML разметка, некий «каркас«. Данный каркас будет использован на каждой странице, в него будет входить например, заголовок, меню навигации и метаданные внутри HTML элемента . По сути, у нас на таких страницах как «Контакты» и «О проекте» будет одна и та же HTML разметка кроме тех данных, что будут находится в теге .

Чтобы избавить нас от лишнего набора текста и предотвратить дублирование одного и того же HTML в нескольких файлах, рекомендуется создать макет или главный шаблон, содержащий общую структуру, который затем можно дополнить данными из других файлов шаблона.

Создайте новый файл ui/html/base.layout.tmpl

Добавим следующую основную HTML разметку (которую мы хотим отображать на каждой странице):

Snippetbox

Если вы раньше использовали шаблонизаторы в других языках программирования, то это покажется вам знакомым. По сути, это обычный HTML с некоторыми дополнительными выражениями в двойных фигурных скобках.

Здесь мы используем выражение >. > для определения отдельного именованного шаблона под названием base , который содержит основной HTML каркас для отображения на каждой странице.

Внутри мы используем выражение > и > , чтобы обозначить, что мы хотим вызывать другие именованные шаблоны (под названием title и main ) в определенной точке нашего HTML шаблона.

На заметку: Если вам интересно, точка в конце выражения > означает любые динамические данные, которые требуется передать для вызываемого шаблона. В будущих уроках мы поговорим об этом подробнее.

Теперь вернемся к файлу ui/html/home.page.tmpl и обновим этот файл для определения именованных блоков с контентом title и main , содержащих определенный контент для домашней страницы:

Последние заметки

В верхней правой части этого файла находится, пожалуй, самый важный элемент — выражение > . Оно сообщает Go шаблонизатору, что при выполнении файла home.page.tmpl требуется вызвать указанный базовый-шаблон base который содержит основную HTML разметку.

Шаблон base содержит инструкции по вызову именованных блоков с контентом title и main . Поначалу это может показаться замкнутым кругом, но не волнуйтесь — на практике этот шаблон работает очень хорошо.

Когда все будет закончено, следующим шагом будет обновление кода в обработчике home() , чтобы тот загружал оба файла шаблонов:

Теперь, вместо того, чтобы шаблон home.page.tmpl содержал всю HTML разметку, ему достаточно указать несколько именованных блоков с контентом ( base , title и main ) и указать в начале на основной файл шаблона, в данном случае это base .

Не бойтесь перезапустить веб-сервер и попробовать код в работе. Вы увидите, что он отображает тот же результат, что и раньше.

Большим преимуществом использования такого шаблонизатора для работы с шаблонами является то, что с ним можно четко определять содержание конкретной страницы в отдельных файлах, и в этих файлах контролировать, какой именно каркас будет использоваться на определенной странице. Это очень полезно для больших приложений, где на разных страницах может потребоваться использование разных макетов.

Разбиваем шаблон на части

Для некоторых приложений может потребоваться разбить определенные фрагменты HTML на части, которые можно повторно использовать на разных страницах или макетах. Для примера давайте создадим файл partial , содержащий HTML разметку подвала для веб-приложения.

Создайте новый файл ui/html/footer.partial.tmpl и добавьте именованный блок с контентом под названием footer следующим образом:

Источник