General updates & tidy-up (#4)

* Refactor GitHub Actions workflow for PR previews and enhance Jekyll configuration with navigation links; remove obsolete staging files and add test staging post.

* Fix preview workflow to bypass GitHub Pages environment protection

* Refactor GitHub Actions workflow for PR previews: rename deploy-preview job to build, and update deployment steps; update email contact in about.md

* Update permissions in GitHub Actions workflow to restrict contents access to read

* Fix navigation links in Jekyll configuration to include trailing slashes; add new page layout for consistent styling.

* Add header and navigation styling for improved layout and responsiveness

* Refactor header and navigation styles for improved layout and responsiveness

* Refactor navigation styles for improved layout and responsiveness

* Refactor navigation markup for debugging and testing purposes

* Refactor header navigation for improved structure and styling

* Refactor header markup for improved structure and readability

* Refactor header structure and add dynamic navigation for improved usability

* Add header structure and navigation for improved layout and accessibility

* Refactor site header markup for improved structure and readability

* Remove unnecessary border from header navigation for improved styling

* Update header links color for improved visibility and enhance archive and tags pages with better styling and structure

* Enhance archive and tags styling with improved layout, hover effects, and responsive design

* Update archive and tags styles for improved consistency and visual appeal

* Simplify tags.md structure and styling to match home page exactly

* Override theme's green tag colors with gray colors to match design

* Remove inline styles from tags.md and delegate styling to custom.css for better maintainability

* Restore original green theme colors for tags as requested

* Update sitemap URL in robots.txt to point to the correct domain

* Convert all tags to camelCase array format: tags: [tagA, tagB]

* Update URL in _config.yml to point to the correct domain

* Add changelog section to all blog posts with initial publication dates and recent updates

* Rename welcome post file from welcome-to-devnomadic.md to devnomadic.md

* Update project configuration and enhance blog content

- Correct capitalization in project description and author bio in _config.yml
- Add a physical notebook recommendation to the remote development environment post
- Expand laptop considerations section with performance, screen quality, and port selection details
- Update styling in archive.md for better visual appeal
- Remove mobile text justification rules from custom.css
- Add Oracle Cloud Infrastructure support and enhance data structures in Albatross post
- Document recent enhancements and changelog updates in Albatross post

* Update description in _config.yml and modify post title for consistency

* Fix description and bio formatting in _config.yml for consistency

* Fix formatting of description and bio in _config.yml for consistency

* Fix HTML entity formatting in description and bio in _config.yml for consistency

* Update description and bio formatting in _config.yml for consistency
Add new features and enhancements in Albatross post, including Gen-AI search and improved security measures

* Fix formatting of architecture diagram in 2025-06-10-albatross.md for clarity

* Enhance Albatross documentation with recent updates, including static sitemap implementation, cross-browser ASCII art rendering fixes, and security hardening in deployment pipeline.

* Add jekyll-mermaid gem and update architecture diagrams in Albatross post

* Fix Mermaid chart rendering

- Add Mermaid.js CDN integration to head-custom.html
- Remove jekyll-mermaid plugin (conflicting approach)
- Add automatic conversion of mermaid code blocks to diagrams
- Include custom theming for better visual integration
- Charts should now render properly on live site

* Improve Mermaid.js initialization and add test page

- Enhanced JavaScript initialization with better error handling
- Added fallback initialization timing for more reliable loading
- Created mermaid-test.md page to verify functionality
- Fixed startOnLoad timing issues with more robust approach

* Final Mermaid.js fixes with multiple approaches

- Enhanced kramdown configuration for better code block processing
- Added mermaid.html include for alternative embedding method
- Simplified JavaScript initialization with better error handling and logging
- Added comprehensive test page with multiple methods
- Fixed timing issues with window.load event handler

* Simplify Mermaid approach with direct div method

- Remove complex JavaScript code conversion
- Add inline script to Albatross post for direct rendering
- Simplify test page with direct div elements
- Use unpkg CDN for more reliable loading
- Focus on working solution over complex automation

* Integrate jekyll-mermaid gem and update Mermaid.js configuration for improved diagram rendering

* feat: Initial commit of Albatross - a secure IP abuse checker using Blazor WebAssembly and Cloudflare Workers

- Implemented secure API proxy architecture with HMAC authentication
- Developed real-time IP reputation checking via AbuseIPDB
- Created build-time key generation for enhanced security
- Integrated Cloudflare Workers for API calls and authentication
- Added comprehensive logging and monitoring features
- Established automated deployment pipeline using GitHub Actions
- Included Cloud IP Manifest Search functionality for major cloud providers
- Enhanced user interface and experience with responsive design
- Documented architecture, security features, and lessons learned

Author: devnomadic

.github/workflows/preview.yml

@@ -9,36 +9,45 @@ on:
       - closed
 
 permissions:
-  contents: write
-  pull-requests: write
+  contents: read
+  pages: write
+  id-token: write
 
-concurrency: preview-${{ github.ref }}
+concurrency:
+  group: "pr-preview"
+  cancel-in-progress: false
 
 jobs:
-  deploy-preview:
+  build:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
         uses: actions/checkout@v4
-
+        
       - name: Setup Ruby
         uses: ruby/setup-ruby@v1
         with:
           ruby-version: '3.1'
           bundler-cache: true
-
-      - name: Build Jekyll site
-        if: github.event.action != 'closed'
-        run: |
-          # Remove CNAME file for previews to avoid routing conflicts
-          rm -f CNAME
-          bundle exec jekyll build
+          
+      - name: Build with Jekyll
+        run: bundle exec jekyll build
         env:
           JEKYLL_ENV: production
-
-      - name: Deploy preview
-        uses: rossjrw/pr-preview-action@v1
+          
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
         with:
-          source-dir: ./_site
-          preview-branch: gh-pages
-          umbrella-dir: pr-preview
+          path: ./_site
+
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
+

Gemfile

@@ -5,6 +5,7 @@ gem 'jekyll-dash', '~> 2.0'
 gem 'jekyll-feed', '~> 0.17'
 gem 'jekyll-sitemap', '~> 1.4'
 gem 'jekyll-paginate', '~> 1.1'
+gem 'jekyll-mermaid'
 
 # Windows and JRuby does not include zoneinfo files, so bundle the tzinfo-data gem
 # and associated library.

_config.yml

@@ -1,7 +1,7 @@
 theme: jekyll-dash
 title: devnomadic
-description: Software engineer and digital nomad currently exploring the world. I write about remote work, travel, and building software from anywhere.
-url: "https://devnomadic.github.io"
+description: "<span style='color:#e74c3c'>&quot;</span><span style='color:#3498db'>Dev</span><span style='color:#f39c12'>&#40;</span><span style='color:#3498db'>Ops</span><span style='color:#e74c3c'>&#124;</span><span style='color:#3498db'>SecOps</span><span style='color:#f39c12'>&#41;</span><span style='color:#9b59b6'>&#63;</span><span style='color:#e74c3c'>&#124;</span><span style='color:#27ae60'>SRE</span><span style='color:#e74c3c'>&quot;</span> Engineer and digital nomad currently exploring the world. I write about remote work, travel, and building software from anywhere."
+url: "https://devnomadic.com"
 baseurl: ""
 
 # Jekyll pagination (required for home page)
@@ -12,7 +12,7 @@ author:
   name: devnomadic
   github: devnomadic
   email: drew@devnomadic.com
-  bio: "Software engineer and digital nomad currently exploring the world. I write about remote work, travel, and building software from anywhere."
+  bio: "<span style='color:#e74c3c'>&quot;</span><span style='color:#3498db'>Dev</span><span style='color:#f39c12'>&#40;</span><span style='color:#3498db'>Ops</span><span style='color:#e74c3c'>&#124;</span><span style='color:#3498db'>SecOps</span><span style='color:#f39c12'>&#41;</span><span style='color:#9b59b6'>&#63;</span><span style='color:#e74c3c'>&#124;</span><span style='color:#27ae60'>SRE</span><span style='color:#e74c3c'>&quot;</span> Engineer and digital nomad currently exploring the world. I write about remote work, travel, and building software from anywhere."
   avatar: "/assets/avatar.gif"
 
 # Build settings
@@ -21,13 +21,26 @@ plugins:
   - jekyll-feed
   - jekyll-sitemap
   - jekyll-paginate
+  - jekyll-mermaid
+
+# Mermaid configuration
+mermaid:
+  src: 'https://unpkg.com/mermaid@10.6.1/dist/mermaid.min.js'
 
 # Theme settings
 dash:
   date_format: "%b %-d, %Y"
   show_author: true
   avatar_source: "local"
   avatar_path: "/assets/avatar.gif"
+  show_nav: true
+  nav_links:
+    - url: /about/
+      title: About
+    - url: /archive/
+      title: Archive
+    - url: /tags/
+      title: Tags
   social_links:
     - url: https://github.com/devnomadic
       icon: github

_config_preview.yml

@@ -15,4 +15,3 @@
   background-color: #e8eaed;
   color: #202124;
 }
-</style>

_includes/head-custom.html

@@ -0,0 +1,20 @@
+<div class="site-header">
+  <div class="wrapper">
+    <a class="site-title" rel="author" href="{{ "/" | relative_url }}">{{ site.title | escape }}<b class="command_prompt"></b><b class="blinking_cursor">_</b></a>
+    <span class="social_links">
+        {% for link in site.dash.social_links %}
+        {% if link.fa == true %}
+        <a class="color-{{ link.color }}-hover" href="{{ link.url }}"{% if link.rel %} rel="{{ link.rel }}"{% endif %}><i class="fa fa-{{ link.icon }}"></i></a>
+        {% else %}
+        <a class="color-{{ link.color }}-hover" href="{{ link.url }}"{% if link.rel %} rel="{{ link.rel }}"{% endif %}><i class="fab fa-{{ link.icon }}"></i></a>
+        {% endif %}
+        {% endfor %}
+    </span>
+    <br style="clear: both;">
+    <div style="margin-top: 0.5em; padding-top: 0.75em;">
+      <a href="/about/" style="display: inline-block; margin-right: 2em; color: #de5684; text-decoration: none; font-size: 1em;">About</a>
+      <a href="/archive/" style="display: inline-block; margin-right: 2em; color: #de5684; text-decoration: none; font-size: 1em;">Archive</a>
+      <a href="/tags/" style="display: inline-block; margin-right: 2em; color: #de5684; text-decoration: none; font-size: 1em;">Tags</a>
+    </div>
+  </div>
+</div>

_includes/header.html

@@ -0,0 +1,8 @@
+---
+layout: default
+---
+
+<div class="page">
+  <h1 class="page-title">{{ page.title }}</h1>
+  {{ content }}
+</div>

_includes/mermaid.html

@@ -3,11 +3,29 @@ layout: post
 title: "Setting Up the Perfect Remote Development Environment"
 description: "Essential tools and configurations for productive remote coding"
 date: 2025-06-08
-tags: remote-work development tools productivity vscode docker
+tags: [remoteWork, development, tools, productivity, vsCode, docker]
 ---
 
 # Creating Your Remote Development Paradise
 
+## 📝 TL;DR
+
+Complete guide to **setting up a productive remote development environment** for digital nomads:
+
+**Hardware Essentials:**
+- 💻 **MacBook Pro M3** (16GB+ RAM) + portable monitor
+- ⌨️ **Compact mechanical keyboard** + wireless mouse  
+
+**Software Stack:**
+- 🔧 **VS Code** with Remote Development extensions
+- 🐳 **Docker** for consistent environments
+- ☁️ **Cloud services** (GitHub Codespaces, AWS Cloud9)
+- 🔒 **VPN** + secure backup solutions
+
+**Key Tips:** Prioritize battery life, internet reliability, and portable ergonomics!
+
+---
+
 Working remotely as a developer requires a carefully crafted environment that enables productivity from anywhere in the world. Here's my guide to setting up the perfect remote development setup.
 
 ## Essential Hardware
@@ -22,6 +40,7 @@ Your laptop is your lifeline. I recommend:
 - **Portable monitor** - For dual-screen setups in coworking spaces
 - **Mechanical keyboard** - Compact 60% or TKL for travel
 - **Wireless mouse** - Better ergonomics than trackpad for long sessions
+- **Physical Notebook** - Always handy to scribble thoughts and diagrams. I prefer an A5 Moleskine (Graph Paper)
 
 ## Software Stack
 
@@ -104,6 +123,34 @@ git push --all origin  # All branches to remote
 - Record video explanations for complex topics
 - Use collaborative coding tools (Live Share, CodeSandbox)
 
+### Laptop Considerations for Remote Work
+
+#### Performance vs Portability Balance
+- **Weight matters**: Aim for under 3 lbs if constantly traveling
+- **Battery life**: Minimum 8 hours for reliable all-day work
+- **Processing power**: M-series MacBooks or AMD Ryzen for efficiency
+
+#### Screen Quality
+- **High resolution**: 1440p minimum for code readability
+- **Color accuracy**: Important for UI/design work
+- **Brightness**: 400+ nits for outdoor/bright environment work
+
+#### Port Selection
+- **USB-C/Thunderbolt**: Future-proof and versatile
+- **HDMI port**: Direct external monitor connection
+- **SD card slot**: Useful for photographers/content creators
+- **Headphone jack**: Backup for wireless audio issues
+
+#### Keyboard & Trackpad
+- **Key travel**: Sufficient feedback for long typing sessions
+- **Trackpad size**: Large enough for gesture navigation
+- **Backlit keys**: Essential for low-light environments
+
+#### Repairability & Support
+- **Global warranty**: Apple Care+ or manufacturer support worldwide
+- **Parts availability**: Consider common models in your travel regions
+- **Local service centers**: Research coverage in frequent destinations
+
 ## Location-Specific Tips
 
 ### Coworking Spaces
@@ -127,4 +174,9 @@ The perfect remote development environment is personal and evolves with your nee
 
 The key is having redundancy in everything - internet, power, workspace options. This ensures you can always deliver quality work regardless of where you are in the world.
 
+## 📋 Changelog
+
+- **2025-06-08:** Initial publication
+- **2025-06-15:** Updated tag format and added changelog
+
 ---

_layouts/page.html

@@ -1,13 +1,27 @@
 ---
 layout: post
-title: "Welcome to devnomadic"
+title: "devnomadic"
 description: "Starting my journey as a digital nomad developer"
 date: 2025-06-09
-tags: introduction devnomad remote-work digital-nomad software-engineering travel lifestyle blogging
+tags: [introduction, devNomad, remoteWork, digitalNomad, softwareEngineering, travel, lifestyle, blogging]
 ---
 
 # Welcome to my digital nomad journey!
 
+## 📝 TL;DR
+
+🚀 **Starting devnomadic** - a blog documenting my journey as a software engineer embracing the digital nomad lifestyle.
+
+**What you'll find here:**
+- 🔧 **Technical tutorials** & best practices
+- 🌍 **Remote work insights** from distributed teams  
+- ✈️ **Travel stories** from a developer's perspective
+- 📱 **Tool recommendations** for nomadic developers
+
+Join me as I explore the intersection of **code, travel, and remote work**!
+
+---
+
 Hello and welcome to devnomadic! This blog represents the beginning of documenting my journey as a software engineer embracing the digital nomad lifestyle.
 
 ## Why devnomadic?
@@ -45,4 +59,9 @@ I'm excited to share this journey with you. Whether you're a fellow developer cu
 
 Let's build something amazing together, from anywhere in the world! 🚀
 
+## 📋 Changelog
+
+- **2025-06-09:** Initial publication
+- **2025-06-15:** Updated tag format and added changelog
+
 ---