Beautiful Web Type — Deployment & Usage Guide

Prerequisites

• Ruby 2.7 or higher (required for Jekyll)
• Bundler gem (gem install bundler)
• Git
• Optional: Node.js (if modifying any build scripts or asset pipelines)

Installation

1. Clone the repository:

git clone https://github.com/ubuwaits/beautiful-web-type.git
cd beautiful-web-type

2. Install Ruby dependencies:

bundle install

This installs Jekyll and any plugins required to build the site locally.

Configuration

The site uses standard Jekyll configuration via _config.yml:

• baseurl: Set to empty string "" for custom domains (production). Use /beautiful-web-type only if hosting as a GitHub Pages project site without a custom domain.
• url: Set to https://beautifulwebtype.com for production, or http://localhost:4000 for local development.
• GitHub Pages settings: Ensure the repository Settings → Pages → Source is set to deploy from the gh-pages branch (or main branch root, depending on your configuration).

No API keys or environment variables are required—this is a static HTML showcase site.

Build & Run

Local Development

Start the Jekyll development server with live reload:

bundle exec jekyll serve

Access the site at http://localhost:4000.

To build for production (generates static files in _site/):

bundle exec jekyll build

Build with Drafts/Future Posts (if applicable)

bundle exec jekyll serve --drafts --future

Deployment

Primary: GitHub Pages (Recommended)

1. Push changes to the gh-pages branch (or configure repository Settings → Pages to use main branch).
2. Ensure the custom domain beautifulwebtype.com is configured in the repository Settings → Pages → Custom domain.
3. GitHub Actions will automatically build and deploy the Jekyll site.

DNS Configuration for Custom Domain:

• Create a CNAME record pointing beautifulwebtype.com to ubuwaits.github.io
• Or create A records pointing to GitHub Pages IP addresses (185.199.108.153, 185.199.109.153, 185.199.110.153, 185.199.111.153)

Alternative Platforms

Netlify:

1. Connect repository to Netlify
2. Build command: bundle exec jekyll build
3. Publish directory: _site/

Vercel:

1. Install Vercel CLI: npm i -g vercel
2. Run vercel in project root
3. Set framework preset to "Jekyll"

Static Host (Any): Upload the contents of the _site/ directory after running bundle exec jekyll build to any static web host (AWS S3, Surge.sh, Cloudflare Pages, etc.).

Troubleshooting

Bundle install fails with permission errors

bundle install --path vendor/bundle

Or use a Ruby version manager (rbenv/rvm) to avoid system Ruby permissions.

Jekyll serve fails with "Address already in use"

bundle exec jekyll serve --port 4001

Assets not loading (CSS/Fonts 404)

Check _config.yml baseurl setting:

• For localhost:4000: baseurl: ""
• For username.github.io/repo-name: baseurl: "/repo-name"
• For custom domain root: baseurl: ""

GitHub Pages build fails

• Ensure all plugins used are in the GitHub Pages whitelist
• Check that Gemfile includes gem "github-pages" for local parity with GitHub's build environment

Font files not displaying in glyph inspector

Verify that font files in the repository are being copied to _site/ during build. Jekyll excludes files starting with underscores by default; ensure font directories don't start with _ or are explicitly included in _config.yml:

include:
  - assets/fonts