David Auble's Personal Website

This is the source code for David Auble's personal website and blog, hosted at davidauble.com. The site showcases professional work, technical blog posts, and serves as a portfolio for web development services.

📋 Table of Contents

• About
• Technology Stack
• Prerequisites
• Installation
• Usage
• Project Structure
• Development
• Deployment
• Contributing
• Security
• License

🎯 About

This website is built using Jekyll, a static site generator, and is hosted on GitHub Pages. It features:

• Professional Portfolio: Showcasing web development services and experience
• Technical Blog: Articles about web development, WordPress, Jekyll, Git, and more
• Responsive Design: Mobile-friendly layout using Bootstrap grid system
• SEO Optimized: Using Jekyll SEO plugins for better search engine visibility
• Performance: Fast-loading static pages with optimized assets

🛠 Technology Stack

• Static Site Generator: Jekyll 4.4.1
• Template Language: Liquid
• Styling: SCSS/CSS
• JavaScript: Vanilla JS with jQuery
• Icons: Font Awesome
• Hosting: GitHub Pages
• Domain: Custom domain (davidauble.com)

Jekyll Plugins

• jekyll-feed: Generates an Atom feed of your posts
• jekyll-sitemap: Automatically generates a sitemap.xml
• jekyll-seo-tag: Adds SEO metadata to pages

📦 Prerequisites

Before you begin, ensure you have the following installed:

• Ruby (version 2.7 or higher)
• RubyGems
• GCC and Make (for building native extensions)
• Bundler (Ruby dependency manager)

Installing Ruby

macOS

# Using Homebrew
brew install ruby

Ubuntu/Debian

sudo apt-get install ruby-full build-essential zlib1g-dev

Windows

Download and install from RubyInstaller

Installing Bundler

gem install bundler

🚀 Installation

1. Clone the repository

   git clone https://github.com/dauble/dauble.github.io.git
   cd dauble.github.io

2. Install dependencies

   bundle install

   This will install Jekyll and all required gems specified in the Gemfile.

💻 Usage

Running the Development Server

Start the local development server with live reload:

bundle exec jekyll serve

The site will be available at: http://localhost:4000

Using LiveReload

For automatic browser refresh when files are saved:

1. Install the LiveReload Chrome extension
2. Enable the extension
3. Start the Jekyll server (LiveReload is enabled in _config.yml)
4. Make changes to your files and watch them update automatically

Building the Site

To build the site for production without starting a server:

bundle exec jekyll build

The generated site will be in the _site directory.

📁 Project Structure

dauble.github.io/
├── _category/          # Category pages
├── _data/              # Data files (navigation, posts metadata)
│   ├── navigation.yml  # Site navigation structure
│   └── posts.json      # Posts metadata
├── _includes/          # Reusable HTML components
│   ├── footer.html     # Site footer
│   ├── header.html     # Site header
│   └── navigation.html # Navigation bar
├── _layouts/           # Page layouts
│   ├── blog.html       # Blog listing layout
│   ├── categories.html # Categories listing layout
│   ├── default.html    # Base layout
│   └── post.html       # Individual post layout
├── _posts/             # Blog posts (Markdown files)
│   └── YYYY-MM-DD-title.md
├── _sass/              # SCSS partials
├── _site/              # Generated static site (not committed)
├── assets/             # Static assets
│   ├── css/            # Compiled CSS
│   ├── fonts/          # Web fonts
│   ├── images/         # Images and graphics
│   └── scripts/        # JavaScript files
├── _config.yml         # Jekyll configuration
├── 404.html            # Custom 404 error page
├── blog.html           # Blog index page
├── categories.html     # Categories page
├── CNAME               # Custom domain configuration
├── Gemfile             # Ruby dependencies
├── index.html          # Homepage
└── README.md           # This file

Key Files

• _config.yml: Main Jekyll configuration file. Contains site settings, plugins, and build options.
• Gemfile: Lists all Ruby gem dependencies for the project.
• CNAME: Specifies the custom domain for GitHub Pages.
• .gitignore: Files and directories excluded from version control.

🔧 Development

Adding a New Blog Post

1. Create a new Markdown file in the _posts directory with the naming convention:

   YYYY-MM-DD-title-of-post.md
   

2. Add front matter at the top of the file:

   ---
   layout: post
   title: "Your Post Title"
   date: YYYY-MM-DD
   image: /assets/images/posts/your-image.jpg
   author: dauble
   categories:
     - "category1"
     - "category2"
   ---

3. Write your content in Markdown below the front matter.

4. Preview locally:

   bundle exec jekyll serve

Working with Categories

Categories are defined in the front matter of each post. To add a new category page:

1. Create a new file in the _category directory
2. Use the category layout and specify the category name

Customizing Styles

• SCSS files are located in the _sass directory
• Main CSS compilation is handled by Jekyll
• Changes are automatically compiled when running the development server

Modifying Layouts

• Layouts are in the _layouts directory
• Includes (reusable components) are in the _includes directory
• Use Liquid template language for dynamic content

🚢 Deployment

This site is automatically deployed to GitHub Pages:

1. Push to master branch: Any push to the master branch triggers an automatic deployment
2. GitHub Actions: The deployment workflow is managed by GitHub Pages
3. Live Site: Changes appear at https://davidauble.com after a successful build

Manual Deployment

The site deploys automatically, but you can verify the build locally:

bundle exec jekyll build
# Check the _site directory for the generated files

Deployment Status

Check the deployment status using the badges at the top of this README or visit the Actions tab.

🤝 Contributing

Contributions are welcome! Please read CONTRIBUTING.md for details on the code of conduct and the process for submitting pull requests.

Quick Guidelines

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

🔒 Security

Security is taken seriously. If you discover a security vulnerability, please review the SECURITY.md file for reporting procedures.

📄 License

This project represents David Auble's personal website and portfolio. While the code is publicly visible, all content, designs, and written materials are copyrighted. If you'd like to use any part of this project, please reach out for permission.

📞 Contact

• Website: davidauble.com
• Email: info@davidauble.com
• GitHub: @dauble

🙏 Acknowledgments

• Built with Jekyll
• Hosted on GitHub Pages
• Icons by Font Awesome

---

Made with ❤️ in Indianapolis