← Back to Blog

Getting Started with Jekyll

jekyllweb-developmentcodingbeginner

Jekyll is a static website generator that lets you focus on content rather than wrestling with HTML and CSS. You write in Markdown, and Jekyll handles the rest.

What Jekyll Does

  • Builds portfolios, blogs, and landing pages
  • Converts Markdown files with YAML front matter into static HTML
  • Integrates seamlessly with GitHub Pages for free hosting

What Jekyll Can't Do

Jekyll is for static sites. If you need real-time data updates (weather apps, stock tickers, dynamic dashboards), you'll need something else.

Prerequisites

Before diving in, make sure you're comfortable with:

  • Git command-line basics
  • A code editor (VS Code, Sublime Text, or Atom)
  • Basic HTML, CSS, and Markdown

Getting Started

1. Clone a starter template

git clone https://github.com/your-template-repo.git my-site
cd my-site

2. Install Jekyll

gem install bundler jekyll
bundle install

3. Configure your site

Edit _config.yml to set your site title, description, URL, and other settings.

4. Run locally

bundle exec jekyll serve

Visit http://localhost:4000 to see your site live.

Key Concepts

  • _site folder — contains the generated static HTML output, ready for deployment
  • Front matter — YAML metadata at the top of each Markdown file (title, date, layout)
  • Layouts — reusable HTML templates that wrap your content

Hosting

The easiest path: create a GitHub repository named your_username.github.io, push your Jekyll site, and GitHub Pages handles the rest. Free hosting, automatic builds on every push.