Local Development Setup for Your Personal Site

Local Development Setup for Your Personal Site

This is a Jekyll-based website. Here are multiple ways to set it up locally:

1. Install rbenv and Ruby

# Install rbenv
brew install rbenv ruby-build

# Install Ruby 3.0.0 (or latest stable)
rbenv install 3.0.0
rbenv local 3.0.0

# Add to your shell configuration
echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.zshrc
echo 'eval "$(rbenv init -)"' >> ~/.zshrc
source ~/.zshrc

2. Install dependencies

# Install bundler
gem install bundler

# Install project dependencies
bundle install

# Install Node.js dependencies
npm install

3. Run locally

bundle exec jekyll serve --livereload

Option 2: Using Docker (Universal)

1. Create Dockerfile

Create a file called Dockerfile in the project root:

FROM jekyll/jekyll:3.8
COPY . /srv/jekyll
WORKDIR /srv/jekyll
RUN bundle install
EXPOSE 4000
CMD ["bundle", "exec", "jekyll", "serve", "--host", "0.0.0.0", "--livereload"]

2. Run with Docker

# Build and run
docker build -t personal-site .
docker run -p 4000:4000 -v $(pwd):/srv/jekyll personal-site

Option 3: GitHub Codespaces (Cloud Development)

  1. Go to your GitHub repository
  2. Click “Code” → “Codespaces” → “Create codespace on main”
  3. Once loaded, run:
    bundle install
    bundle exec jekyll serve --host 0.0.0.0
    

Troubleshooting

Ruby Version Issues

If you encounter Ruby version issues, you can:

  • Remove the Ruby version requirement from Gemfile
  • Use rbenv to manage Ruby versions
  • Use Docker for a consistent environment

Permission Issues

If you get permission errors:

# Install gems to user directory instead of system
bundle install --path ~/.gem

Development Workflow

1. View your site

Open http://localhost:4000 in your browser

2. Making changes

  • The site will automatically rebuild when you make changes
  • Use --livereload flag to automatically refresh your browser
  • For JavaScript changes: npm run build:js

3. Useful commands

# Serve with drafts
bundle exec jekyll serve --drafts --livereload

# Build without serving
bundle exec jekyll build

# Clean build cache
bundle exec jekyll clean

Quick Start (if you have Ruby working)

bundle install
npm install
bundle exec jekyll serve --livereload

Then visit http://localhost:4000 to see your site!