cloudgatestudios.github.io

Source for cloudgatestudios.com — a one-person studio building apps, tools, and services.

Built with Eleventy (11ty) and deployed to GitHub Pages via GitHub Actions.

---

Development

Prerequisites: Node.js 20+

npm install
npm start # dev server at http://localhost:8080
npm run build # production build → _site/

---

Project Structure

cloudgatestudios.github.io/
├── .github/
│ └── workflows/
│ ├── deploy.yml # Push to master → build → deploy to gh-pages
│ └── pr-check.yml # PR checks: build + spell check
├── src/
│ ├── _data/
│ │ ├── site.json # Global metadata (title, email, location)
│ │ └── projects.json # Projects list — edit here to add/update projects
│ ├── _includes/
│ │ ├── layouts/
│ │ │ ├── base.njk # Root HTML shell (nav, footer, scripts)
│ │ │ └── post.njk # Blog post layout
│ │ ├── nav.njk
│ │ ├── footer.njk
│ │ └── app-card.njk # Project card component (apps, tools, services)
│ ├── assets/
│ │ ├── css/styles.css # All styles — CSS custom properties + sections
│ │ ├── img/ # Images (logo.svg, app icons, screenshots)
│ │ └── js/main.js # Mobile nav toggle
│ ├── apps/
│ │ └── bikesharebuddy/
│ │ ├── index.njk # App landing page → /BikeShareBuddy/
│ │ └── privacy-policy.njk # → /BikeShareBuddy/privacyPolicy.htm
│ ├── blog/
│ │ ├── blog.json # Auto-applies layout + tag to all posts
│ │ └── YYYY-MM-DD-slug.md # Blog posts
│ ├── index.njk # Homepage
│ ├── blog.njk # Blog listing → /blog/
│ └── 404.njk # Custom 404
├── CNAME # cloudgatestudios.com
├── cspell.json # Spell check config
├── eleventy.config.js # Eleventy configuration
└── package.json # npm scripts and dependencies

---

Adding a Project

1. Add an entry to src/_data/projects.json:

{
"name": "My New Project",
"slug": "mynewproject",
"tagline": "One-line description",
"description": "Longer description.",
"icon": "/assets/img/MyProjectIcon.png",
"url": "/MyNewProject/",
"appStoreUrl": "https://apps.apple.com/...", ← optional, null if not applicable"playStoreUrl": null, ← optional, null if not applicable"platform": ["ios"], ← optional (e.g. ["ios"], ["android"], ["web"])"status": "active",
"featured": true
}

Note:appStoreUrl, playStoreUrl, and platform are optional — they control whether store badges appear on the project card. Set them to null (or omit them) for tools, services, or anything that isn't a mobile app.

2. Place the icon image in src/assets/img/.
3. (Optional) If the project needs its own landing page, create one at src/projects/mynewproject/index.njk with permalink: /MyNewProject/ in the front matter. If the project links directly to an external URL (e.g. a web service), you can skip this step and point url in projects.json to the external address instead.

---

Writing a Blog Post

Create a markdown file in src/blog/:

src/blog/YYYY-MM-DD-your-post-slug.md

Front matter:

---
title: "Your Post Title"date: 2026-03-13description: "One or two sentence summary shown in listing cards and meta tags."
---
Post content in markdown...

The post will automatically appear at /blog/your-post-slug/ and in the blog preview on the homepage (up to 3 most recent posts shown).

---

Brand

Token	Value
Primary color	#FF4500
Primary dark	#CC3700
Footer background	#111111
Font	Inter (Google Fonts)

All design tokens are CSS custom properties in the :root block at the top of src/assets/css/styles.css.

---

PR Checks

Every pull request into master runs two checks in parallel:

• Build — runs npm run build and fails if Eleventy throws any errors
• Spell Check — runs cspell across blog posts, app pages, and the README

Run spell check locally before pushing:

npm run spellcheck

If a word is flagged that isn't a typo (brand name, technical term, etc.), add it to the words array in cspell.json.

---

Deployment

Pushing to master automatically triggers a GitHub Actions build and deploys the _site/ output to the gh-pages branch.

One-time setup: In the repo settings, set Pages source to the gh-pages branch, root folder.

The CNAME file (cloudgatestudios.com) is automatically included in every deploy.