How much would a service provider or a Saas tool cost you to build a Website for your service? Let's find out in this article.

We will only use the terminal App and Chrome Browser on a MacBook.


What is our goal?

We want to build a website for an imaginary Security Service Company, called Harimau Security.


How should we do it?

Let's ask ChatGPT.

What tools can I use to generate a static website?

I’d recommend Hugo—a super-fast, Go-based static site generator.
You write your content in Markdown, choose or build a Go-template theme, 
then run the single hugo command to produce a complete static site you can deploy anywhere.

Ok, we can use Hugo (whatever that means).


What are our requirements?

Let's put our requirements into a document.

## Introduction

The goal of this project is to build a static site for "Harimau Security".
"Harimau Security" (Harimau means Tiger in Malay) is a security company that provides short-terms, professional security services.

## Site Features

The site should includes:
1. A hero banner
  - Full-screen or half-screen banner
2. Why choose us?
Three to five feature cards (icon + title + one-sentence description), e.g.:
  - Trained Specialists
  - 24/7 Availability
  - Discreet & Confidential
3. Pricing Information
  - Plan Name (e.g. Standard, Premium)
  - Rate (e.g. $50/hr)
  - Inclusions
  - “Book Now” button → Contact anchor
4. Contact Information
  - Phone number (click-to-call)
  - Email address (mailto:)
  - Office address

## Tech Specs

1. Hugo is used to generate static site
2. SEO: meta title/description per page, Open Graph tags, structured data (Organization)
3. Responsive: works on mobile/tablet/desktop

## Content & Branding
• Tone: professional, reassuring, discreet
• Fonts: one serif for headers, one sans-serif for body
• Color palette: dark charcoal + tiger-orange accent
• Imagery: high-resolution, diversity-inclusive, security-focused

We choose to use markdown, but it can be in any format (even plain text).


What's next?

We install the 2 tools below:

  1. Claude Code - The AI coding agent we want to use. For billing, it needs to be connected to your Anthropic Account.

  2. Hugo - The tool suggested by ChatGPT earlier.

    $ npm install -g @anthropic-ai/claude-code
    
    $ brew install hugo
    

Let the Agent work

  1. We are Claude to build the site based on our requirements

    $ claude "Check README.md and build a site as per described"
    
  2. After 5 minutes, it is done.

    Total cost:            $0.1749
    Total duration (API):  2m 16.9s
    Total duration (wall): 4m 19.3s
    Total code changes:    453 lines added, 2 lines removed
    Token usage by model:
        claude-3-5-haiku:  2.4k input, 114 output, 0 cache read, 0 cache write
           claude-sonnet:  51 input, 6.7k output, 115.7k cache read, 9.8k cache write
    
  3. Let's run Hugo to preview.

    $ hugo server -D
    
  4. Everything looks great, except we want to use a different font.

    $ claude "please use open sans google font for the content"
    
  5. After about a minute, the change is completed.

    Total cost:            $0.1151
    Total duration (API):  31.3s
    Total duration (wall): 48.5s
    Total code changes:    7 lines added, 2 lines removed
    Token usage by model:
        claude-3-5-haiku:  660 input, 23 output, 0 cache read, 0 cache write
           claude-sonnet:  25 input, 954 output, 73.5k cache read, 20.8k cache write
    

The output


Our costs

The total cost is $0.29.