Using Sandbox Without Rake

Basic Setup

Direct Jekyll Usage

The Sandbox theme can be run directly with Jekyll commands:

Development server with live reload
Production builds
Built-in Sass compilation
Asset processing

# Start development server
bundle exec jekyll serve --livereload --livereload-min-delay 5

# Build for production
JEKYLL_ENV=production bundle exec jekyll build

Prerequisites

Required software:

Ruby (version 2.7.0 or higher)
RubyGems
Bundler gem
ImageMagick or Vips (for image processing)

View installation

# Install Ruby dependencies
gem install bundler

# Install project dependencies
bundle install

Built-in Features

Sass Processing

Jekyll includes built-in Sass compilation:

Automatic processing of Sass files
Production minification
Source mapping options
Custom import paths

View configuration

# _config.yml
sass:
  style: compressed
  sass_dir: _sass
  sourcemap: never

Image Processing

Manual Image Optimization

Using ImageMagick directly for image processing:

WebP conversion
Batch processing
Image optimization
Format conversion

View commands

# Convert single image
magick convert input.jpg -quality 90 output.webp

# Batch convert (PowerShell)
Get-ChildItem -Path "assets/img" -Recurse -Include *.jpg,*.png | 
ForEach-Object { magick convert $_.FullName -quality 90 "$($_.DirectoryName)\$($_.BaseName).webp" }

# Batch convert (Bash/Linux)
find assets/img -type f \( -iname "*.jpg" -o -iname "*.png" \) -exec convert {} -quality 90 {}.webp \;

Development Workflow

Recommended Steps

Development workflow without Rake:

Start Jekyll server: bundle exec jekyll serve --livereload
Make changes to source files (Sass compiles automatically)
Process images manually as needed
Build for production: JEKYLL_ENV=production bundle exec jekyll build

Troubleshooting

Common Issues

Solutions for frequent problems:

Sass Compilation Errors: Check _sass directory structure
Server Start Issues: Verify port availability
Build Failures: Check Jekyll environment settings
Image Processing: Confirm ImageMagick installation

Debugging

Debug Jekyll processes:

Use verbose mode: jekyll serve --verbose
Check build output in _site directory
Enable trace mode with --trace
Review Jekyll's error messages

Shell Scripts

Automation Scripts

Create shell scripts for common tasks:

View example

#!/bin/bash
# build.sh - Production build script

echo "Building site for production..."
JEKYLL_ENV=production bundle exec jekyll build

echo "Processing images..."
find assets/img -type f \( -iname "*.jpg" -o -iname "*.png" \) -exec convert {} -quality 90 {}.webp \;

Project Pages

Single Projects

Usage

Styleguide

Elements