---
title: "How to create a static site with hugo"
description: "Discover how to create a static site with hugo with this in-depth guide, providing actionable insights and practical tips to boost your knowledge and results."
date: 2025-04-11
tags:
  - "create"
  - "static"
  - "site"
  - "with"
  - "hugo"
authors:
  - "Cojocaru David"
  - "ChatGPT"
slug: "how-to-create-a-static-site-with-hugo"
updatedDate: 2025-05-02
---

# How to Create a Static Site with Hugo: A Step-by-Step Guide  

Want to build a fast, secure, and easy-to-maintain website? Hugo, the lightning-fast static site generator, makes it simple. In this guide, you’ll learn **how to create a static site with Hugo**—from installation to deployment—using clear, actionable steps. Whether you're a developer, blogger, or hobbyist, Hugo’s speed and simplicity will help you launch your site in no time.  

## Why Choose Hugo for Your Static Site?  

Hugo isn’t just another static site generator—it’s a performance powerhouse. Built with Go, Hugo offers unbeatable advantages:  

- **Blazing-Fast Builds:** Generate thousands of pages in seconds.  
- **No Dependencies:** A single binary means no complex setups.  
- **Flexible Theming:** Choose from hundreds of pre-built themes or design your own.  
- **Markdown-Friendly:** Write content easily without wrestling with code.  
- **Enhanced Security:** No database or server-side processing means fewer vulnerabilities.  

> _"Hugo turns content into high-performance websites with minimal effort—perfect for developers and creators alike."_  

## Prerequisites Before You Start  

Before diving in, make sure you have:  

1. **Hugo installed** (download from [gohugo.io](https://gohugo.io)).  
2. A **code editor** (VS Code, Sublime Text, or Atom).  
3. Basic **command-line knowledge**.  
4. **Git** (optional but recommended for deployment).  

## Step 1: Install Hugo on Your System  

### macOS (Using Homebrew)  
Run:  
```  
brew install hugo  
```  

### Windows (Using Chocolatey)  
Run in PowerShell (Admin):  
```  
choco install hugo  
```  

### Linux (Using Snap)  
Run:  
```  
sudo snap install hugo  
```  

Verify with:  
```  
hugo version  
```  

## Step 2: Create a New Hugo Site  

Generate your site with:  
```  
hugo new site my-hugo-site  
```  

This creates a folder with:  
- `config.toml` (site settings).  
- `content/` (Markdown files for posts/pages).  
- `themes/` (where themes are stored).  
- `static/` (images, CSS, JS).  

## Step 3: Add a Theme for Design  

1. Browse themes at [themes.gohugo.io](https://themes.gohugo.io).  
2. Clone a theme into `themes/`:  
   ```  
   git clone https://github.com/themes/ananke.git themes/ananke  
   ```  
3. Activate it in `config.toml`:  
   ```  
   theme = "ananke"  
   ```  

## Step 4: Create Your First Page  

Generate a new post:  
```  
hugo new posts/my-first-post.md  
```  

Edit the file (`content/posts/my-first-post.md`) with:  
```  
---  
title: "My First Post"  
date: 2024-01-01  
draft: false  
---  

Welcome to my Hugo site! This post is written in **Markdown**.  
```  

## Step 5: Preview Your Site Locally  

Run the development server:  
```  
hugo server -D  
```  

Visit `http://localhost:1313` to see your live site.  

## Step 6: Customize Your Site  

### Configure Site Settings  
Edit `config.toml` to set:  
```  
baseURL = "https://yourdomain.com"  
title = "My Hugo Site"  
```  

### Add Custom CSS  
Place styles in `static/css/custom.css` and link them in your theme.  

## Step 7: Build & Deploy Your Site  

Generate static files:  
```  
hugo  
```  

Deploy the `public/` folder to:  
- **Netlify** (drag-and-drop).  
- **GitHub Pages** (push to `gh-pages` branch).  
- **Vercel** (connect Git repo).  

#hugo #staticsite #webdevelopment #markdown #go