Quick Start Guide

πŸš€ Running Locally

Prerequisites Check

ruby --version    # Should be 2.6+
gem --version     # Should be installed
bundle --version  # Install with: gem install bundler

Start Development Server

# Install dependencies (first time only)
bundle install

# Start local server
bundle exec jekyll serve

# Access at: http://localhost:4000

Alternative: Static Demo

# If Jekyll has issues, use the static demo
open index.html

πŸ“ Adding Content

New Page

# Create new page
touch about.md

# Add front matter
---
layout: default
title: "About Us"
description: "Learn about our platform"
---

New Blog Post

# Create posts directory
mkdir -p _posts

# Create new post
touch _posts/2024-01-15-my-post.md

# Add front matter
---
layout: post
title: "My Post Title"
date: 2024-01-15
author: "Your Name"
categories: ["Category"]
tags: ["tag1", "tag2"]
---

New Course

# Create new course
touch _courses/my-course.md

# Add front matter
---
layout: course
title: "Course Title"
description: "Course description"
price: 99
instructor: "Instructor Name"
rating: 4.8
duration: "8 weeks"
level: "Beginner"
---

πŸ› οΈ Common Commands

# Start development server
bundle exec jekyll serve

# Build for production
bundle exec jekyll build

# Clean and rebuild
bundle exec jekyll clean && bundle exec jekyll serve

# Serve with drafts
bundle exec jekyll serve --drafts

# Serve with future posts
bundle exec jekyll serve --future

πŸ”§ Troubleshooting

Jekyll Won’t Start

# Check Ruby version
ruby --version

# Reinstall dependencies
bundle install

# Clear cache
bundle exec jekyll clean

Page Not Updating

Sass Errors

πŸ“ File Structure

qastudy.online/
β”œβ”€β”€ _config.yml          # Site configuration
β”œβ”€β”€ _layouts/            # Page templates
β”œβ”€β”€ _includes/           # Reusable components
β”œβ”€β”€ _courses/            # Course files
β”œβ”€β”€ _posts/              # Blog posts
β”œβ”€β”€ assets/
β”‚   β”œβ”€β”€ css/main.css     # Styles
β”‚   └── js/main.js       # JavaScript
β”œβ”€β”€ index.md             # Homepage
└── index.html           # Static demo

🎨 Quick Customization

Change Colors

Edit assets/css/main.css:

:root {
  --color-primary-500: #your-color;  /* Main purple */
}

Add New Component

  1. Create HTML in _includes/
  2. Add CSS to assets/css/main.css
  3. Add JS to assets/js/main.js

πŸ“± Testing

# Test responsive design
# Open browser dev tools and resize window

# Test mobile
# Use browser dev tools mobile view

πŸš€ Deployment

GitHub Pages

git add .
git commit -m "Update site"
git push origin main
# Enable GitHub Pages in repo settings

Netlify/Vercel


Need help? Check the full README.md for detailed documentation!