Skip to main content

Getting Started with Jekyll: Your First Static Site

By Zer0-Mistakes Team

A beginner-friendly tutorial on creating your first Jekyll website from scratch with step-by-step instructions.

Estimated reading time: 4 minutes

Getting Started with Jekyll: Your First Static Site

Welcome to Jekyll! This tutorial will guide you through creating your first static website using Jekyll, the popular static site generator.

What is Jekyll?

Jekyll is a static site generator that transforms plain text into static websites:

  • Markdown support: Write content in Markdown
  • Liquid templating: Create dynamic layouts
  • GitHub Pages ready: Free hosting on GitHub
  • Plugin ecosystem: Extend functionality

Prerequisites

Before starting, ensure you have:

  • Ruby 2.5+ installed
  • RubyGems package manager
  • Basic command line knowledge
  • A text editor

Or simply use Docker (recommended)!

Creating Your First Site

Step 1: Install Jekyll

gem install bundler jekyll

Step 2: Create a New Site

jekyll new my-awesome-site
cd my-awesome-site

Step 3: Serve Locally

bundle exec jekyll serve

Visit http://localhost:4000 to see your site!

Understanding the Structure

my-awesome-site/
├── _config.yml      # Site configuration
├── _posts/          # Blog posts
├── _layouts/        # Page templates
├── _includes/       # Reusable components
└── index.md         # Homepage

Creating Your First Post

Create a new file in _posts/:

---
layout: post
title: "My First Post"
date: 2025-01-01
---

Hello, Jekyll world!

Next Steps

  • Explore Jekyll themes
  • Learn Liquid templating
  • Set up GitHub Pages deployment
  • Add plugins for extra features

Happy building!