Creating the View Templates

We need to create two new templates:

1. templates/register.html

This will display the registration page with the following contents:

<!--register.html-->

<!--Embed the header.html template at this location-->
{{ template "header.html" .}}

<h1>Register</h1>

<div class="panel panel-default col-sm-6">
  <div class="panel-body">
    <!--If there's an error, display the error-->
    {{ if .ErrorTitle}}
    <p class="bg-danger">
      {{.ErrorTitle}}: {{.ErrorMessage}}
    </p>
    {{end}}
    <!--Create a form that POSTs to the `/u/register` route-->
    <form class="form" action="/u/register" method="POST">
      <div class="form-group">
        <label for="username">Username</label>
        <input type="text" class="form-control" id="username" name="username" placeholder="Username">
      </div>
      <div class="form-group">
        <label for="password">Password</label>
        <input type="password" name="password" class="form-control" id="password" placeholder="Password">
      </div>
      <button type="submit" class="btn btn-primary">Register</button>
    </form>
  </div>
</div>  


<!--Embed the footer.html template at this location-->
{{ template "footer.html" .}}

2. templates/login-successful.html

This template will be used when a user registers successfully and is automatically logged in. Its contents are as follows:

<!--login-successful.html-->

<!--Embed the header.html template at this location-->
{{ template "header.html" .}}

<div>
  You have successfully logged in.
</div>

<!--Embed the footer.html template at this location-->
{{ template "footer.html" .}}

Additionally, we also need to modify the menu.html template to display a link to the registration page, as follows:

<!--menu.html-->

<nav class="navbar navbar-default">
  <div class="container">
    <div class="navbar-header">
      <a class="navbar-brand" href="/">
        Home
      </a>
    </div>
    <ul class="nav navbar-nav">      
        <li><a href="/u/register">Register</a></li>
    </ul>
  </div>
</nav>

Implementing the Model

In the user model, the registerNewUser function in models.user.go must create a new user if the input is valid and must reject the request if the input isn't valid. The isUsernameAvailablefunction must check if the supplied username is available or is already in use.

After implementing these functions, models.user.go should look as follows:

// models.user.go

package main

import (
    "errors"
    "strings"
)

type user struct {
    Username string `json:"username"`
    Password string `json:"-"`
}

// For this demo, we're storing the user list in memory
// We also have some users predefined.
// In a real application, this list will most likely be fetched
// from a database. Moreover, in production settings, you should
// store passwords securely by salting and hashing them instead
// of using them as we're doing in this demo
var userList = []user{
    user{Username: "user1", Password: "pass1"},
    user{Username: "user2", Password: "pass2"},
    user{Username: "user3", Password: "pass3"},
}

// Register a new user with the given username and password
func registerNewUser(username, password string) (*user, error) {
    if strings.TrimSpace(password) == "" {
        return nil, errors.New("The password can't be empty")
    } else if !isUsernameAvailable(username) {
        return nil, errors.New("The username isn't available")
    }

    u := user{Username: username, Password: password}

    userList = append(userList, u)

    return &u, nil
}

// Check if the supplied username is available
func isUsernameAvailable(username string) bool {
    for _, u := range userList {
        if u.Username == username {
            return false
        }
    }
    return true
}