ITS8 CLOUD SERVICES — BUILD GUIDE

How to build a cloud-native cert prep site

A week-by-week walkthrough for recreating tradingwithhak.com/cloud-prep — topology, infrastructure, code, and deployment included.

⏱ 4 weeks·💰 ~$0 on free tiers·🛠 Next.js · Cloudflare · Supabase·☁️ AWS CLF-C02 · AZ-900 equivalent
Build progress0 / 20 steps complete
Architecture & Data Flow
🧑‍💻 User Browser
tradingwithhak.com · HTTPS
L1 · DNS + EDGE
Cloudflare DNS
≡ Route 53 / Azure DNS
CDN / Edge Cache
200+ global PoPs
TLS / Auto-cert
≡ ACM / Azure Cert Mgr
WAF + DDoS
≡ AWS Shield / Azure DDoS
L2 · HOSTING
Cloudflare Pages
≡ S3 Static / Azure Blob
Next.js 14
App Router, force-static
GitHub Actions
≡ CodePipeline / DevOps
Blog + Team pages
Static pre-rendered
L3 · APP FEATURES
Study Guides
AWS CLF-C02 · AZ-900
Practice Exams
360 questions · 6 exams
Visitor Counter
Live from Supabase
Capstone Pages
Presentation · Security
L4 · BACKEND API
Next.js Edge Routes
≡ Lambda / Azure Fn
/api/cloud-prep/visit
POST increment, GET count
/api/b/journal
Journal CRUD
/api/pit/ai
Claude AI co-pilot
L5 · DATABASE
Supabase (PostgreSQL)
≡ DynamoDB / CosmosDB
page_visits table
visitor_count · journals
atomic_increment()
Stored procedure (RPC)
Row Level Security
Deny-by-default policies
L6 · CI/CD + IaC
GitHub → Actions
Push to main triggers build
CF Pages Deploy
cloudflare/pages-action@v1
Terraform IaC
AWS-equivalent in /docs/iac
Budget Alerts
Free-tier threshold emails
Step-by-Step Phases
PREREQUISITES — ~2 hours

Accounts & Tooling

IAM / Access Setup
GitHub accountCloudflare accountSupabase accountNode.js + pnpm installed
WEEK 1 — ~6 hours

Static Site + GitHub + Architecture

S3 Static Website / Azure Blob + CDN
Next.js app scaffoldedStudy guide pages builtCloudflare Pages connectedArchitecture diagram published
BASH — scaffold the project
pnpm create next-app@latest cloud-prep \
  --typescript --tailwind --app --no-src-dir
cd cloud-prep
pnpm dev
BASH — add Cloudflare Pages adapter
pnpm add @cloudflare/next-on-pages
WEEK 2 — ~4 hours

Visitor Counter + DNS + HTTPS

DynamoDB + Lambda / CosmosDB + Functions
Supabase table + stored procEdge API route liveCustom domain configuredHTTPS / HSTS enforced
SQL — Supabase migration
create table visitor_count (
  id         bigint primary key default 1,
  count      bigint not null default 0,
  updated_at timestamptz default now()
);
insert into visitor_count (id, count) values (1, 0);

create or replace function atomic_increment()
returns bigint language plpgsql as $$
declare new_count bigint;
begin
  update visitor_count
  set count = count + 1, updated_at = now()
  where id = 1
  returning count into new_count;
  return new_count;
end; $$;
TYPESCRIPT — app/api/visit/route.ts
// app/api/visit/route.ts
export const runtime = 'edge'
import { createClient } from '@supabase/supabase-js'

export async function POST() {
  const sb = createClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.SUPABASE_SERVICE_KEY!
  )
  const { data } = await sb.rpc('atomic_increment')
  return Response.json({ count: data })
}
WEEK 3 — ~6 hours

Practice Exams + IaC Docs

Lambda / Azure Functions — documented equivalent
360 practice questionsExam engine with timerTerraform IaC templatePython Lambda equivalent
PYTHON — Lambda handler (AWS equivalent)
class="bg-kw">import json, boto3

dynamodb = boto3.resource('dynamodb')
table = dynamodb.Table('VisitorCount')

class="bg-kw">def handler(event, context):
    resp = table.update_item(
        Key={'id': 'main'},
        UpdateExpression='ADD #c :inc',
        ExpressionAttributeNames={'#c': 'count'},
        ExpressionAttributeValues={':inc': 1},
        ReturnValues='UPDATED_NEW'
    )
    class="bg-kw">return {
        'statusCode': 200,
        'body': json.dumps({
          'count': class="bg-kw">int(resp['Attributes']['count'])
        })
    }
HCL — Terraform IaC (AWS equivalent)
resource "aws_s3_bucket" "site" {
  bucket = "cloud-prep-static-site"
}
resource "aws_dynamodb_table" "counter" {
  name         = "VisitorCount"
  billing_mode = "PAY_PER_REQUEST"
  hash_key     = "id"
  attribute { name = "id"  type = "S" }
}
resource "aws_lambda_function" "counter" {
  filename      = "lambda.zip"
  function_name = "visitor-counter"
  role          = aws_iam_role.lambda.arn
  handler       = "handler.handler"
  runtime       = "python3.12"
}
WEEK 4 — ~4 hours

CI/CD + Blog + Final Demo

GitHub Actions / CodePipeline / Azure DevOps
CI/CD pipeline auto-deploys on pushBlog post publishedTeam page with GitHub profilesFinal live demo complete
YAML — .github/workflows/deploy.yml
name: Deploy
on:
  push:
    branches: [main]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with: { node-version: '18' }
      - run: pnpm install
      - run: pnpm tsc --noEmit
      - run: pnpm build
      - uses: cloudflare/pages-action@v1
        with:
          apiToken: ${{ secrets.CF_API_TOKEN }}
          accountId: ${{ secrets.CF_ACCOUNT_ID }}
          projectName: cloud-prep
          directory: .next
School Mapping — Requirement ↔ What's Running
Hosting + CDN
S3 Static / Azure Blob + CDN
Cloudflare Pages
Global edge, HTTPS automatic, CI/CD on every push to main
Visitor counter + API
DynamoDB + Lambda / CosmosDB + Functions
Supabase RPC + Next.js edge route
Atomic increment stored proc; Lambda equivalent documented in /docs
DNS + HTTPS
Route 53 + ACM / Azure DNS
Cloudflare DNS + Auto-TLS
DNSSEC enabled, Universal SSL cert auto-renewed
CI/CD pipeline
GitHub Actions / CodePipeline / Azure DevOps
GitHub Actions + CF Pages action
typecheck → build → deploy on every push to main
Monitoring + logging
CloudWatch / Azure Monitor
Cloudflare Analytics + Supabase logs
Request logs, error rates, visitor metrics
IaC templates
CloudFormation / Bicep / Terraform
Terraform (AWS provider) in /docs/iac
S3 + Lambda + DynamoDB + API Gateway equivalent
Budget alerts
AWS Budgets / Azure Cost Management
Cloudflare + Supabase billing alerts
Email alerts at free-tier thresholds
Security groups / NSG
AWS Security Groups / Azure NSG
Cloudflare WAF rules
DDoS protection, bot fight mode enabled
Blog post + write-up
Blog / documentation
/cloud-prep/blog
MDX post covering architecture + build process
Team info + GitHub links
Team info page
/cloud-prep/team
Architecture table + GitHub profile links