ITS8 Cloud Services · Capstone Project
Cloud-Based IT Services App
4-week capstone — static hosting, visitor counter, API, IaC, CI/CD, DNS, HTTPS, monitoring, and a live demo at tradingwithhak.com
Architecture & Data Flow
⌥
GitHub
Source control · main branch
DEV⚙️
GitHub Actions
Type check → Build → Deploy
CI/CD☁️
Cloudflare Pages
Edge CDN · 200+ PoPs worldwide
HOSTING🧑💻
User Browser
tradingwithhak.com · HTTPS
CLIENTAPI call
🗄
Supabase
page_visits · journals · auth
DATABASEresolve
🌐
Cloudflare DNS
tradingwithhak.com · TLS/HTTPS
DNS · SSLSource code push
CI/CD pipeline
Static content delivery
Browser API request
DB query / response
DNS resolution / TLS
Live DNS Configuration — tradingwithhak.com
Type
Name
Value
Purpose
A@104.21.32.95Cloudflare edge — IPv4 anycast
A@172.67.150.172Cloudflare edge — IPv4 anycast
AAAA@2606:4700:3031::6815:205fCloudflare edge — IPv6 anycast
AAAA@2606:4700:3033::ac43:96acCloudflare edge — IPv6 anycast
MX@10 inbound-smtp.us-east-1.amazonaws.comMail handled by Amazon SES
NS@donovan.ns.cloudflare.comCloudflare authoritative nameserver
NS@arushi.ns.cloudflare.comCloudflare authoritative nameserver
🟠 Proxied (Orange Cloud)
A and AAAA records are proxied through Cloudflare — the real origin IPs are hidden. WAF, DDoS protection, and CDN caching all activate automatically.
🔒 HTTPS / TLS Automatic
Cloudflare issues a free Universal SSL certificate. All http:// traffic is automatically redirected to https:// — no certificate to renew or manage.
📧 Email via Amazon SES
MX record points to Amazon Simple Email Service (us-east-1). Handles inbound mail routing for the domain.
Weekly Timeline
Foundation
Static Site + GitHub + Architecture
Deliverables
✓HTML/CSS/JS resume site deployed live
✓GitHub repository created and connected
✓Architecture diagram published
✓Team roles confirmed — Cloud Architect, Front-End, DevOps
✓IAM users and access policies configured
Our Implementation
Static Hosting
Cloudflare Pages — auto-deploys from GitHub main branch
Source Control
GitHub (UbuntoGod/tradingwithhak) — branching strategy with PRs
Architecture Diagram
Topology documented on /cloud-prep/team page
IAM / Access
Cloudflare dashboard RBAC + Supabase row-level security
Grading Breakdown — 100 Points
10pts
Resume Website + Hosting
tradingwithhak.com — deployed on Cloudflare Pages, custom domain, HTTPS
10pts
Visitor Counter + API
/cloud-prep — live counter via Supabase page_visits table + /api/cloud-prep/visit Edge route
10pts
Infrastructure-as-Code
GitHub Actions workflow + next.config.mjs + wrangler.toml — declarative, version-controlled deploy
10pts
CI/CD Automation
Push to main → type check → Next.js build → Cloudflare Pages deploy — zero manual steps
10pts
DNS, Security & Monitoring
Cloudflare DNS + Universal TLS + WAF + HSTS + CSP headers in next.config.mjs
10pts
Logging & Alerts
Cloudflare Analytics, Supabase logs, Resend email notifications, error boundaries
10pts
Documentation + Diagrams
/cloud-prep/team + topology diagram + this presentation page
10pts
Blog Post & GitHub Profiles
/cloud-prep/blog + /cloud-prep/team with GitHub profile links
10pts
Weekly Presentations & Teamwork
Weekly PRs + demo sessions — all merges tracked in GitHub history
10pts
Creativity / Bonus Features
AI co-pilot (Claude), The Pit live trading room, 6 practice exams, animated topology
Total100 / 100
Live Demo Links