Cloudflare Pages Social Landing Site

I created a tutorial on building a social media aggregation landing page using Cloudflare Pages and Hugo. The project demonstrates modern DevOps practices by automating deployment through continuous integration workflows.

Overview

This shows how to create a landing page using Cloudflare Pages to link out to all your various social media sites. This approach combines version control, automated builds, and hosting to streamline updates across a centralized social profile hub.

Requirements

• Cloudflare account (free tier sufficient)
• GitHub account (free tier sufficient)

Steps

GitHub Setup

Fork the existing repository at davidpacold/social-media-landing, creating your own editable copy.

Configuration

The hugo.toml file contains customizable elements including title, descriptions, and social media links. Edit this file directly in GitHub's web interface.

Cloudflare Integration

After logging into Cloudflare's dashboard, connect your GitHub repository to Cloudflare Pages, selecting Hugo as the build template.

Deployment

The build process uses Hugo to generate static files, automatically deploying whenever changes are committed. Initial deployment provides a unique subdomain; updating the baseurl in hugo.toml ensures proper styling after the first build.

QR Code Generation

Generate scannable QR codes from your live site URL using free QR code generators.

Example

The live example is available at connectwith.davidpacold.dev.