DEV Community

Samuel Udeh
Samuel Udeh

Posted on

Deploying a Netlify Site with Terraform + HCP Remote State

Infrastructure as Code (IaC) is about making deployments reproducible, automated, and collaborative. In this project, I built and deployed a static website on Netlify using Terraform, while storing the Terraform state securely in HCP Terraform (Terraform Cloud).

This was part of the Terraform Challenge, and I’ll walk you through what I did and how you can replicate it.

🎯 Project Goals

  1. Deploy a static frontend site to Netlify

  2. Manage it with Terraform (Infrastructure as Code)

  3. Store Terraform state in HCP Terraform (Terraform Cloud)

  4. Keep secrets out of the repo (use workspace env vars instead)

  5. Make the setup re-runnable and reproducible

Live Site πŸ‘‰ comforting-fudge-57ff13.netlify.app

Repo πŸ‘‰ github.com/SamuelUdeh/terraform-netlify-challenge

πŸ›  Tools I Used

  1. Terraform β†’ To define infrastructure as code

  2. HCP Terraform (Terraform Cloud) β†’ To store remote state securely

  3. Netlify β†’ To host the static site

  4. GitHub β†’ Version control + Netlify deploy hook

βš™οΈ How It Works

  1. Static Site β†’ A minimal index.html page lives in /site.

  2. Netlify β†’ Hosts the site, automatically deploying on every push to main.

  3. Terraform β†’ Manages Netlify site settings (publish dir, environment variables).

  4. HCP Terraform β†’ Stores state remotely, enabling collaboration and history.

Architecture Flow:

GitHub Repo ---> Netlify (Site Hosting) ---> Live URL
|
+---> Terraform ---> HCP Terraform (Remote State)

πŸ§‘β€πŸ’» Step-by-Step Setup

  1. Prerequisites
  • Terraform β‰₯ 1.6

  • Accounts: Netlify, GitHub, HCP Terraform

  • Netlify Personal Access Token (NETLIFY_TOKEN)

2.Create Site in Netlify

In Netlify: New site from Git β†’ connect repo β†’ publish directory = site

3.Configure HCP Terraform

  • Create Organization + Workspace

  • Add NETLIFY_TOKEN as a sensitive environment variable

4.Terraform Config

Example versions.tf:

terraform {
required_providers {
netlify = {
source = "netlify/netlify"
version = "~> 0.2"
}
random = {
source = "hashicorp/random"
version = "~> 3.6"
}
}

cloud {
organization = "your-org"
workspaces {
name = "portfolio-site-workspace"
}
}
}

outputs.tf:

output "live_url" {
value = "https://${var.site_name}.netlify.app"
}

5.Run Terraform

  • terraform init

  • terraform plan

  • terraform apply

Output:

Apply complete! Resources: 0 added, 0 changed, 0 destroyed.

Outputs:
live_url = "https://comforting-fudge-57ff13.netlify.app"
repo = "https://github.com/SamuelUdeh/terraform-netlify-challenge"

πŸ”‘ Lessons Learned

  1. Netlify provider doesn’t create sites (yet), you create the site in the UI once, then manage settings via Terraform.

  2. Remote state in HCP Terraform is safer and team-ready vs local terraform.tfstate.

  3. Keep secrets out of code, use workspace environment variables like NETLIFY_TOKEN.

Even a minimal project (simple HTML site) is enough to demonstrate IaC principles.

πŸ“Έ Deliverables

βœ… Repo with Terraform + site

βœ… Remote state in HCP Terraform

βœ… Live Netlify URL

🌟 Wrap Up

This challenge showed how simple it is to connect Terraform β†’ Netlify β†’ HCP Terraform and manage even small projects as Infrastructure as Code.

Try it yourself:
πŸ‘‰ Clone my repo, configure HCP Terraform, and run terraform apply.

Happy coding, and thanks to HUG-Ibadan for the challenge inspiration! πŸ™Œ

Top comments (0)