glenn
/
personal-website
mirror of https://github.com/glenneth1/personal-website.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add new blog post about 2025 dev environment and update website files

This commit is contained in:
Glenn Thompson 2025-03-08 18:09:50 +03:00
parent da0006411a
commit 3639dc51db
11 changed files with 1569 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

184
content/drafts/2025-03-12-lessons-learned-custom-ssg.md Normal file
View File

@ -0,0 +1,184 @@
---
title: "Lessons Learned: One Year with a Custom Static Site Generator"
date: 2025-03-12
tags: [web, development, javascript, static-site, node, tailwind, lessons]
---
It's been just over a year since I [transitioned from Haunt to my own custom static site generator](/content/posts/2025-01-02-from-haunt-to-custom.html) for this website. What started as an experiment to gain more control over my publishing workflow has evolved into a valuable learning experience that has shaped how I approach web development projects.
In this post, I'll share the key lessons I've learned, challenges I've faced, and insights I've gained from building and maintaining my own static site generator.
## The Technical Evolution
### Initial Implementation vs. Current State
When I first built my static site generator, it was a simple Node.js script that converted markdown to HTML and injected it into a template. The feature set was minimal:
- Basic markdown parsing with marked
- Simple templating with string literals
- Manual asset management
- Command-line build process
Today, the system has evolved considerably:
- Enhanced markdown processing with syntax highlighting and custom extensions
- Tailwind CSS integration with optimized builds
- Automated image optimization
- Tag-based organization and filtering
- RSS feed generation
- Incremental builds for faster development
This evolution wasn't planned from the beginning—it emerged organically as I used the system and identified pain points and opportunities for improvement.
### The Power of Incremental Improvements
One of the most valuable lessons I've learned is the power of incremental improvements. Rather than trying to build a comprehensive system upfront, I started with the minimum viable solution and gradually added features as needed.
This approach allowed me to:
1. Get the site up and running quickly
2. Learn from actual usage rather than anticipated needs
3. Focus development efforts on genuine pain points
4. Avoid overengineering and unnecessary complexity
For example, I didn't initially implement an image optimization pipeline. Only after manually optimizing images for several posts did I recognize the value of automating this process. The resulting solution was more practical and tailored to my specific workflow than if I had tried to design it upfront.
## Unexpected Challenges
### Dependency Management
One of the most surprising challenges was dependency management. While I deliberately kept external dependencies minimal, even the few libraries I did use occasionally introduced breaking changes or security vulnerabilities that required attention.
For instance, when updating the marked library for markdown processing, I had to adapt to changes in its API and configuration options. This highlighted the importance of:
- Carefully evaluating dependencies before adoption
- Writing good tests to catch breaking changes
- Considering the long-term maintenance implications of each dependency
### Browser Compatibility
Another unexpected challenge was ensuring browser compatibility. While static sites are generally more resilient than complex web applications, I still encountered issues with:
- CSS features not supported in older browsers
- JavaScript syntax compatibility
- Image format support (particularly with WebP and AVIF formats)
These challenges led me to implement better progressive enhancement strategies and more thorough testing across different browsers and devices.
### Content Management Workflow
Perhaps the most significant challenge was refining the content management workflow. While I initially focused on the technical aspects of generating the site, I quickly realized that the author experience was equally important.
Pain points included:
- Managing front matter consistently
- Previewing content during writing
- Organizing and reusing images
- Maintaining consistent formatting
To address these issues, I developed additional tools and scripts to streamline the content creation process, including a front matter template generator and a live preview server.
## Community Engagement
### Sharing the Journey
One unexpected benefit of building my own static site generator has been the community engagement it has fostered. By documenting my process and sharing code snippets, I've connected with other developers interested in similar approaches.
These interactions have:
- Provided valuable feedback and suggestions
- Inspired new features and improvements
- Created opportunities for collaboration
- Helped others solve similar problems
I've received numerous emails and comments from readers who have adapted aspects of my approach for their own projects, which has been incredibly rewarding.
### Open Source Contributions
Working on my own static site generator has also led to contributions to open source projects. As I encountered limitations or bugs in the libraries I was using, I often found myself submitting pull requests or opening issues.
This has not only improved the tools I rely on but has also deepened my understanding of the broader ecosystem and connected me with other developers working on similar problems.
## Performance Insights
### Build Performance vs. Runtime Performance
An interesting lesson has been the distinction between build performance and runtime performance. Initially, I focused primarily on optimizing the runtime performance of the site—ensuring fast page loads, minimal JavaScript, and optimized assets.
However, as the site grew, build performance became increasingly important. Slow builds hindered the content creation process and made it less enjoyable to update the site.
This led me to implement:
- Incremental builds that only process changed files
- Parallel processing for independent tasks
- Caching of intermediate build artifacts
- More efficient asset processing pipelines
These optimizations significantly improved the development experience without compromising the performance of the published site.
### The Value of Measurement
Another key lesson has been the importance of measurement in performance optimization. Rather than making assumptions about performance bottlenecks, I've learned to rely on data from:
- Lighthouse scores and reports
- Chrome DevTools performance profiles
- Build time measurements
- Real User Monitoring (RUM) data
This data-driven approach has often revealed surprising insights, such as the significant impact of font loading on perceived performance and the importance of optimizing the critical rendering path.
## Security Considerations
Building and maintaining my own static site generator has also deepened my understanding of web security. Even though static sites are inherently more secure than dynamic applications, there are still important considerations:
- Content Security Policy (CSP) implementation
- Secure handling of third-party resources
- Protection against common vulnerabilities in dependencies
- Secure deployment processes (as detailed in my [recent post about my development environment](/content/posts/2025-03-08-my-dev-environment-2025.html))
I've implemented a comprehensive security strategy that includes regular dependency audits, strict CSP headers, and secure deployment practices using GPG encryption for credentials.
## Future Roadmap
As I look to the future of my custom static site generator, several areas of improvement stand out:
### Content Management Improvements
- Better support for content types beyond blog posts
- Enhanced media management
- Improved drafting and scheduling capabilities
- Better support for content updates and versioning
### Build System Enhancements
- Further build performance optimizations
- Better incremental build support
- Improved error reporting and diagnostics
- Integration with modern build tools like esbuild
### Frontend Innovations
- Enhanced progressive enhancement strategies
- Better offline support with service workers
- Improved accessibility features
- More sophisticated interaction patterns without sacrificing performance
## Conclusion: Was It Worth It?
The question I'm most frequently asked about my custom static site generator is whether it was worth the effort compared to using an established solution like Hugo, Eleventy, or Next.js.
My answer is an unequivocal yes, but with an important caveat: it was worth it for my specific goals and learning objectives.
Building a custom solution has provided:
1. **Deep learning opportunities** across the full web development stack
2. **Complete control** over the implementation and feature set
3. **Minimal dependencies** leading to a more maintainable codebase
4. **Tailored workflows** specific to my content creation process
5. **Performance optimizations** focused on my particular use cases
However, I wouldn't recommend this approach for everyone. If your primary goal is to get a site up quickly with minimal development effort, established static site generators offer tremendous value and a wealth of community support.
The key is to align your tooling choices with your specific goals, constraints, and learning objectives. For me, the journey of building and evolving my own static site generator has been as valuable as the destination—a fast, secure, and maintainable website that perfectly suits my needs.
I'd love to hear about your experiences with static site generators, whether custom-built or established solutions. What lessons have you learned? What challenges have you faced? Share your thoughts in the comments or reach out via email.

323
content/posts/2025-03-08-my-dev-environment-2025.html Normal file
View File

@ -0,0 +1,323 @@
<!DOCTYPE html>
<html lang="en" class="bg-base-bg">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A comprehensive look at my current development setup in 2025, covering everything from my GNU Guix system foundation to editor configurations, terminal tools, and deployment processes.">
<meta property="og:title" content="My Development Environment in 2025: From Editor to Deployment">
<meta property="og:description" content="A comprehensive look at my current development setup in 2025, covering everything from my GNU Guix system foundation to editor configurations, terminal tools, and deployment processes.">
<meta property="og:url" content="https://glenneth.orgcontent/posts/2025-03-08-my-dev-environment-2025">
<title>My Development Environment in 2025: From Editor to Deployment - Glenn Thompson</title>
<link rel="alternate" type="application/rss+xml" title="Glenn Thompson's Blog" href="/feed.xml" />
<link href="/dist/styles.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Merriweather:wght@400;700&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
<style>
.prose-palenight {
--tw-prose-body: #bfc7d5;
--tw-prose-headings: #ffd580;
--tw-prose-links: #82aaff;
--tw-prose-code: #c792ea;
--tw-prose-pre-bg: #1b1e2b;
}
.prose h2 {
color: var(--tw-prose-headings);
font-family: Merriweather, serif;
font-weight: 700;
font-size: 1.5rem;
margin-top: 2rem;
margin-bottom: 1rem;
}
.prose p {
margin-bottom: 1rem;
line-height: 1.625;
}
.prose a {
color: var(--tw-prose-links);
text-decoration: none;
}
.prose a:hover {
color: #89ddff;
}
.prose code {
color: var(--tw-prose-code);
font-family: 'JetBrains Mono', monospace;
}
.prose pre {
background-color: var(--tw-prose-pre-bg);
padding: 1rem;
border-radius: 0.5rem;
overflow-x: auto;
margin-bottom: 1rem;
}
.prose ul, .prose ol {
margin-top: 0.5rem;
margin-bottom: 1rem;
padding-left: 1.5rem;
}
.prose ul {
list-style-type: disc;
}
.prose ol {
list-style-type: decimal;
}
</style>
</head>
<body class="bg-base-bg text-palenight-50">
<nav class="bg-base-darker/80 backdrop-blur-sm shadow-sm border-b border-palenight-400/20 mb-8">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between h-16">
<a href="/" class="text-accent-yellow font-serif text-xl font-bold">Glenn Thompson</a>
<div class="flex items-center gap-2 text-accent-yellow text-sm font-bold">
<span>development, guix, tools, workflow, productivity, web</span>
<span>•</span>
<time datetime="2025-03-08">March 8, 2025</time>
<span>•</span>
<span>6 min read</span>
</div>
</div>
</div>
</nav>
<main class="pt-24 pb-16 px-4">
<div class="max-w-4xl mx-auto">
<div class="content text-palenight-100 space-y-6">
<header class="mb-8">
<h1 class="text-4xl font-serif font-bold text-accent-yellow">My Development Environment in 2025: From Editor to Deployment</h1>
<div class="flex items-center gap-4 text-palenight-300 mt-4">
<time datetime="2025-03-08">2025-03-08</time>
<span>•</span>
<span>6 min read</span>
<span>•</span>
<span>By Glenn Thompson</span>
</div>
<div class="flex flex-wrap gap-2 mt-4">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guix</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tools</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">workflow</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">productivity</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">web</span>
</div>
</header>
<article class="prose prose-palenight max-w-none">
<h2>Introduction</h2>
<p>The tools we use shape how we work. Over the years, my development environment has evolved alongside my technical journey through different programming languages, paradigms, and projects. This post offers a snapshot of my current setup in early 2025, detailing the choices I&#39;ve made and why they work for me.</p>
<h2>System Foundation: ArcoLinux with GNU Guix</h2>
<p>My journey to <a href="https://guix.gnu.org/">GNU Guix</a> began through my exploration of Scheme programming, as I detailed in my <a href="/content/posts/2024-07-26-gnu-guix-journey.html">GNU Guix Journey</a> post. While I initially experimented with Guix System, I&#39;ve settled on a hybrid approach: running Guix as a package manager on top of ArcoLinux (an Arch-based distribution).</p>
<h3>Current Configuration Approach</h3>
<p>I manage my development environment using a combination of Arch&#39;s pacman, AUR, and Guix&#39;s declarative package management. My Guix configuration lives in a Git repository, allowing me to:</p>
<ul>
<li>Track changes to my development environment over time</li>
<li>Reproduce my development setup on new hardware</li>
<li>Roll back to previous package states when needed</li>
<li>Share configuration snippets with the community</li>
</ul>
<h3>Key Packages and Tools</h3>
<p>I maintain a hybrid package approach:</p>
<p><strong>System packages (via pacman/AUR):</strong></p>
<ul>
<li>Base system utilities and desktop environment</li>
<li>Graphics drivers and hardware support</li>
<li>Some GUI applications</li>
</ul>
<p><strong>Development tools (via Guix):</strong></p>
<pre><code class="language-scheme">;; My primary development tools managed by Guix
(specifications-&gt;manifest
&#39;(&quot;emacs&quot; &quot;git&quot; &quot;openssh&quot; &quot;ripgrep&quot; &quot;fd&quot; &quot;exa&quot; &quot;bat&quot;
&quot;guile&quot; &quot;node&quot; &quot;python&quot; &quot;gcc-toolchain&quot; &quot;make&quot;
&quot;nss-certs&quot; &quot;glibc-locales&quot;))
</code></pre>
<p>This hybrid approach gives me the best of both worlds: Arch&#39;s extensive package repository and up-to-date system packages, combined with Guix&#39;s reproducible development environments.</p>
<h3>Reproducibility Benefits</h3>
<p>The reproducibility of Guix for development environments has been invaluable. I can:</p>
<ul>
<li>Spin up development environments with precise dependencies</li>
<li>Ensure consistent behavior across machines</li>
<li>Isolate project-specific dependencies using Guix environments</li>
<li>Share exact environment specifications with collaborators</li>
</ul>
<h3>Challenges and Solutions</h3>
<p>Working with this hybrid approach isn&#39;t without challenges:</p>
<ul>
<li><p><strong>Challenge</strong>: Keeping Guix packages in sync with system libraries<br><strong>Solution</strong>: Careful management of library paths and containerization when needed</p>
</li>
<li><p><strong>Challenge</strong>: Learning curve for Guix&#39;s declarative configuration<br><strong>Solution</strong>: Incremental adoption and community resources</p>
</li>
<li><p><strong>Challenge</strong>: Occasional conflicts between package managers<br><strong>Solution</strong>: Clear separation of responsibilities (system vs. development tools)</p>
</li>
</ul>
<h2>Editor Environment: Emacs</h2>
<p>After experimenting with various editors, I&#39;ve settled on Emacs as my primary development environment. Its extensibility and Scheme-based configuration language (Emacs Lisp) align well with my interests.</p>
<h3>Configuration Approach</h3>
<p>I use a literate configuration with Org mode, which allows me to:</p>
<ul>
<li>Document my configuration choices</li>
<li>Organize settings by purpose rather than file</li>
<li>Selectively load components based on context</li>
<li>Share readable documentation with others</li>
</ul>
<h3>Key Extensions</h3>
<p>My most valuable Emacs extensions include:</p>
<ul>
<li><strong>Magit</strong>: Git interface that has transformed my version control workflow</li>
<li><strong>LSP Mode</strong>: Language server integration for intelligent code assistance</li>
<li><strong>Org Mode</strong>: For notes, task management, and literate programming</li>
<li><strong>Projectile</strong>: Project navigation and management</li>
<li><strong>Company</strong>: Completion framework</li>
<li><strong>Consult/Vertico/Marginalia</strong>: Modern completion UI</li>
<li><strong>Tree-sitter</strong>: Improved syntax highlighting and structural editing</li>
</ul>
<h3>Language-Specific Setups</h3>
<p>For my primary languages:</p>
<ul>
<li><strong>Scheme/Guile</strong>: Geiser for REPL integration</li>
<li><strong>JavaScript/TypeScript</strong>: TypeScript LSP, prettier, eslint integration</li>
<li><strong>Python</strong>: Pyright LSP, black formatting</li>
<li><strong>Web Development</strong>: Web mode, emmet, css-mode</li>
</ul>
<h3>Productivity Enhancements</h3>
<p>Some productivity boosters in my setup:</p>
<ul>
<li>Custom keybindings for frequent operations</li>
<li>Snippets for common code patterns</li>
<li>Template generation for new projects</li>
<li>Integration with system notifications</li>
</ul>
<h2>Terminal and CLI Tools</h2>
<p>While Emacs handles many tasks, I still rely heavily on terminal tools for specific workflows.</p>
<h3>Shell Configuration</h3>
<p>I use Zsh with a custom configuration that provides:</p>
<ul>
<li>Intuitive aliases</li>
<li>Helpful prompts with Git integration</li>
<li>Command history management</li>
<li>Directory navigation shortcuts</li>
</ul>
<h3>Custom Scripts and Utilities</h3>
<p>I&#39;ve developed several custom scripts to streamline repetitive tasks:</p>
<ul>
<li>Project initialization templates</li>
<li>Deployment automation</li>
<li>System maintenance routines</li>
<li>Content management for this blog</li>
</ul>
<h3>Task Automation</h3>
<p>For task automation, I use a combination of:</p>
<ul>
<li>Shell scripts for simple operations</li>
<li>Guile scripts for more complex logic</li>
<li>Make for build processes</li>
<li>Cron for scheduled tasks</li>
</ul>
<h3>Version Control Workflow</h3>
<p>My Git workflow relies on:</p>
<ul>
<li>Branch-per-feature approach</li>
<li>Interactive rebasing for clean history</li>
<li>Commit message templates</li>
<li>Hooks for quality checks</li>
</ul>
<h2>Web Development Stack</h2>
<p>As the creator of this website, my web development setup has been refined through experience.</p>
<h3>Local Development Server</h3>
<p>For local development, I use:</p>
<ul>
<li>Live-server for static sites</li>
<li>Custom Node.js servers for API development</li>
<li>Docker containers for complex dependencies</li>
</ul>
<h3>Build Tools and Processes</h3>
<p>My build process typically involves:</p>
<ul>
<li>Tailwind CSS for styling</li>
<li>Minimal JavaScript bundling</li>
<li>Custom static site generation (as detailed in my <a href="/content/posts/2025-01-02-from-haunt-to-custom.html">previous post</a>)</li>
<li>Automated optimization steps</li>
</ul>
<h3>Testing Approach</h3>
<p>For testing, I employ:</p>
<ul>
<li>Jest for JavaScript unit tests</li>
<li>Cypress for end-to-end testing</li>
<li>Manual testing across devices and browsers</li>
<li>Accessibility validation tools</li>
</ul>
<h3>Browser Tools and Extensions</h3>
<p>Essential browser tools include:</p>
<ul>
<li>Firefox Developer Edition as my primary browser</li>
<li>Chrome for cross-browser testing</li>
<li>DevTools for performance analysis</li>
<li>React and Redux DevTools</li>
<li>Accessibility checkers</li>
</ul>
<h2>Deployment Pipeline</h2>
<p>My approach to deployment emphasizes security and reliability.</p>
<h3>Secure Deployment Process</h3>
<p>As you might have noticed from my <a href="/content/posts/2025-03-08-my-dev-environment-2025.html">.env.gpg file</a>, I take security seriously:</p>
<ul>
<li>Credentials stored in GPG-encrypted files</li>
<li>Separate development and production configurations</li>
<li>Principle of least privilege for service accounts</li>
<li>Regular security audits</li>
</ul>
<h3>Automation Scripts</h3>
<p>My deployment is automated through:</p>
<ul>
<li>Custom shell scripts for build and deploy</li>
<li>Validation steps before deployment</li>
<li>Rollback capabilities</li>
<li>Notification systems for success/failure</li>
</ul>
<h3>CI/CD Considerations</h3>
<p>While not using a formal CI/CD pipeline for this personal site, I follow similar principles:</p>
<ul>
<li>Pre-commit checks for code quality</li>
<li>Automated testing before deployment</li>
<li>Consistent build environments</li>
<li>Deployment approval steps</li>
</ul>
<h3>Monitoring and Analytics</h3>
<p>For site monitoring, I use:</p>
<ul>
<li>Simple analytics for privacy-respecting visitor tracking</li>
<li>Uptime monitoring</li>
<li>Performance metrics collection</li>
<li>Error logging and alerting</li>
</ul>
<h2>Future Improvements</h2>
<p>My environment continues to evolve. Areas I&#39;m exploring include:</p>
<ul>
<li>Further integration between Emacs and system tools</li>
<li>More comprehensive test automation</li>
<li>Expanded use of Guix channels for package management</li>
<li>Improved mobile development workflow</li>
</ul>
<h2>Conclusion</h2>
<p>A development environment is deeply personal, reflecting both technical needs and individual preferences. Mine has evolved through years of experimentation, learning, and refinement.</p>
<p>The most important lesson I&#39;ve learned is that tools should serve your workflow, not dictate it. Be willing to experiment, but also recognize when a tool is working well enough that further optimization yields diminishing returns.</p>
<p>I hope sharing my setup provides some inspiration for your own environment. I&#39;d love to hear about your setup and what tools have made the biggest difference in your workflow.</p>
<p>What aspects of your development environment have you found most valuable? Are there tools or approaches you think I should consider? Let me know!</p>
</article>
</div>
</div>
</main>
<footer class="bg-base-darker text-palenight-200 py-12 border-t border-palenight-400/20">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center">
<p class="text-palenight-300">&copy; 2024 Glenn Thompson. All rights reserved.</p>
<div class="webring-text mt-6">
<p class="text-palenight-300">I am part of the <a href="https://systemcrafters.net" target="_blank" class="text-accent-blue hover:text-accent-cyan">System Crafters</a> webring:</p>
</div>
<div class="craftering mt-2 flex items-center justify-center gap-4 text-accent-blue">
<a href="https://craftering.systemcrafters.net/@glenneth/previous" class="hover:text-accent-cyan">Previous</a>
<a href="https://craftering.systemcrafters.net/@glenneth" class="hover:text-accent-cyan">Random</a>
<a href="https://craftering.systemcrafters.net/@glenneth/next" class="hover:text-accent-cyan">Next</a>
</div>
<p class="text-palenight-300 mt-2">
<a href="mailto:glenn@glenneth.org" class="text-accent-blue hover:text-accent-cyan transition-colors">glenn@glenneth.org</a> |
<a href="https://glenneth.org" class="text-accent-blue hover:text-accent-cyan transition-colors">glenneth.org</a>
</p>
</div>
</div>
</footer>
</body>
</html>

249
content/posts/2025-03-08-my-dev-environment-2025.md Normal file
View File

@ -0,0 +1,249 @@
---
title: My Development Environment in 2025: From Editor to Deployment
date: 2025-03-08
tags: development, guix, tools, workflow, productivity, web
description: A comprehensive look at my current development setup in 2025, covering everything from my GNU Guix system foundation to editor configurations, terminal tools, and deployment processes.
---
## Introduction
The tools we use shape how we work. Over the years, my development environment has evolved alongside my technical journey through different programming languages, paradigms, and projects. This post offers a snapshot of my current setup in early 2025, detailing the choices I've made and why they work for me.
## System Foundation: ArcoLinux with GNU Guix
My journey to [GNU Guix](https://guix.gnu.org/) began through my exploration of Scheme programming, as I detailed in my [GNU Guix Journey](/content/posts/2024-07-26-gnu-guix-journey.html) post. While I initially experimented with Guix System, I've settled on a hybrid approach: running Guix as a package manager on top of ArcoLinux (an Arch-based distribution).
### Current Configuration Approach
I manage my development environment using a combination of Arch's pacman, AUR, and Guix's declarative package management. My Guix configuration lives in a Git repository, allowing me to:
- Track changes to my development environment over time
- Reproduce my development setup on new hardware
- Roll back to previous package states when needed
- Share configuration snippets with the community
### Key Packages and Tools
I maintain a hybrid package approach:
**System packages (via pacman/AUR):**
- Base system utilities and desktop environment
- Graphics drivers and hardware support
- Some GUI applications
**Development tools (via Guix):**
```scheme
;; My primary development tools managed by Guix
(specifications->manifest
'("emacs" "git" "openssh" "ripgrep" "fd" "exa" "bat"
"guile" "node" "python" "gcc-toolchain" "make"
"nss-certs" "glibc-locales"))
```
This hybrid approach gives me the best of both worlds: Arch's extensive package repository and up-to-date system packages, combined with Guix's reproducible development environments.
### Reproducibility Benefits
The reproducibility of Guix for development environments has been invaluable. I can:
- Spin up development environments with precise dependencies
- Ensure consistent behavior across machines
- Isolate project-specific dependencies using Guix environments
- Share exact environment specifications with collaborators
### Challenges and Solutions
Working with this hybrid approach isn't without challenges:
- **Challenge**: Keeping Guix packages in sync with system libraries
**Solution**: Careful management of library paths and containerization when needed
- **Challenge**: Learning curve for Guix's declarative configuration
**Solution**: Incremental adoption and community resources
- **Challenge**: Occasional conflicts between package managers
**Solution**: Clear separation of responsibilities (system vs. development tools)
## Editor Environment: Emacs
After experimenting with various editors, I've settled on Emacs as my primary development environment. Its extensibility and Scheme-based configuration language (Emacs Lisp) align well with my interests.
### Configuration Approach
I use a literate configuration with Org mode, which allows me to:
- Document my configuration choices
- Organize settings by purpose rather than file
- Selectively load components based on context
- Share readable documentation with others
### Key Extensions
My most valuable Emacs extensions include:
- **Magit**: Git interface that has transformed my version control workflow
- **LSP Mode**: Language server integration for intelligent code assistance
- **Org Mode**: For notes, task management, and literate programming
- **Projectile**: Project navigation and management
- **Company**: Completion framework
- **Consult/Vertico/Marginalia**: Modern completion UI
- **Tree-sitter**: Improved syntax highlighting and structural editing
### Language-Specific Setups
For my primary languages:
- **Scheme/Guile**: Geiser for REPL integration
- **JavaScript/TypeScript**: TypeScript LSP, prettier, eslint integration
- **Python**: Pyright LSP, black formatting
- **Web Development**: Web mode, emmet, css-mode
### Productivity Enhancements
Some productivity boosters in my setup:
- Custom keybindings for frequent operations
- Snippets for common code patterns
- Template generation for new projects
- Integration with system notifications
## Terminal and CLI Tools
While Emacs handles many tasks, I still rely heavily on terminal tools for specific workflows.
### Shell Configuration
I use Zsh with a custom configuration that provides:
- Intuitive aliases
- Helpful prompts with Git integration
- Command history management
- Directory navigation shortcuts
### Custom Scripts and Utilities
I've developed several custom scripts to streamline repetitive tasks:
- Project initialization templates
- Deployment automation
- System maintenance routines
- Content management for this blog
### Task Automation
For task automation, I use a combination of:
- Shell scripts for simple operations
- Guile scripts for more complex logic
- Make for build processes
- Cron for scheduled tasks
### Version Control Workflow
My Git workflow relies on:
- Branch-per-feature approach
- Interactive rebasing for clean history
- Commit message templates
- Hooks for quality checks
## Web Development Stack
As the creator of this website, my web development setup has been refined through experience.
### Local Development Server
For local development, I use:
- Live-server for static sites
- Custom Node.js servers for API development
- Docker containers for complex dependencies
### Build Tools and Processes
My build process typically involves:
- Tailwind CSS for styling
- Minimal JavaScript bundling
- Custom static site generation (as detailed in my [previous post](/content/posts/2025-01-02-from-haunt-to-custom.html))
- Automated optimization steps
### Testing Approach
For testing, I employ:
- Jest for JavaScript unit tests
- Cypress for end-to-end testing
- Manual testing across devices and browsers
- Accessibility validation tools
### Browser Tools and Extensions
Essential browser tools include:
- Firefox Developer Edition as my primary browser
- Chrome for cross-browser testing
- DevTools for performance analysis
- React and Redux DevTools
- Accessibility checkers
## Deployment Pipeline
My approach to deployment emphasizes security and reliability.
### Secure Deployment Process
As you might have noticed from my [.env.gpg file](/content/posts/2025-03-08-my-dev-environment-2025.html), I take security seriously:
- Credentials stored in GPG-encrypted files
- Separate development and production configurations
- Principle of least privilege for service accounts
- Regular security audits
### Automation Scripts
My deployment is automated through:
- Custom shell scripts for build and deploy
- Validation steps before deployment
- Rollback capabilities
- Notification systems for success/failure
### CI/CD Considerations
While not using a formal CI/CD pipeline for this personal site, I follow similar principles:
- Pre-commit checks for code quality
- Automated testing before deployment
- Consistent build environments
- Deployment approval steps
### Monitoring and Analytics
For site monitoring, I use:
- Simple analytics for privacy-respecting visitor tracking
- Uptime monitoring
- Performance metrics collection
- Error logging and alerting
## Future Improvements
My environment continues to evolve. Areas I'm exploring include:
- Further integration between Emacs and system tools
- More comprehensive test automation
- Expanded use of Guix channels for package management
- Improved mobile development workflow
## Conclusion
A development environment is deeply personal, reflecting both technical needs and individual preferences. Mine has evolved through years of experimentation, learning, and refinement.
The most important lesson I've learned is that tools should serve your workflow, not dictate it. Be willing to experiment, but also recognize when a tool is working well enough that further optimization yields diminishing returns.
I hope sharing my setup provides some inspiration for your own environment. I'd love to hear about your setup and what tools have made the biggest difference in your workflow.
What aspects of your development environment have you found most valuable? Are there tools or approaches you think I should consider? Let me know!

323
deploy/content/posts/2025-03-08-my-dev-environment-2025.html Normal file
View File

@ -0,0 +1,323 @@
<!DOCTYPE html>
<html lang="en" class="bg-base-bg">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A comprehensive look at my current development setup in 2025, covering everything from my GNU Guix system foundation to editor configurations, terminal tools, and deployment processes.">
<meta property="og:title" content="My Development Environment in 2025: From Editor to Deployment">
<meta property="og:description" content="A comprehensive look at my current development setup in 2025, covering everything from my GNU Guix system foundation to editor configurations, terminal tools, and deployment processes.">
<meta property="og:url" content="https://glenneth.orgcontent/posts/2025-03-08-my-dev-environment-2025">
<title>My Development Environment in 2025: From Editor to Deployment - Glenn Thompson</title>
<link rel="alternate" type="application/rss+xml" title="Glenn Thompson's Blog" href="/feed.xml" />
<link href="/dist/styles.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Merriweather:wght@400;700&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
<style>
.prose-palenight {
--tw-prose-body: #bfc7d5;
--tw-prose-headings: #ffd580;
--tw-prose-links: #82aaff;
--tw-prose-code: #c792ea;
--tw-prose-pre-bg: #1b1e2b;
}
.prose h2 {
color: var(--tw-prose-headings);
font-family: Merriweather, serif;
font-weight: 700;
font-size: 1.5rem;
margin-top: 2rem;
margin-bottom: 1rem;
}
.prose p {
margin-bottom: 1rem;
line-height: 1.625;
}
.prose a {
color: var(--tw-prose-links);
text-decoration: none;
}
.prose a:hover {
color: #89ddff;
}
.prose code {
color: var(--tw-prose-code);
font-family: 'JetBrains Mono', monospace;
}
.prose pre {
background-color: var(--tw-prose-pre-bg);
padding: 1rem;
border-radius: 0.5rem;
overflow-x: auto;
margin-bottom: 1rem;
}
.prose ul, .prose ol {
margin-top: 0.5rem;
margin-bottom: 1rem;
padding-left: 1.5rem;
}
.prose ul {
list-style-type: disc;
}
.prose ol {
list-style-type: decimal;
}
</style>
</head>
<body class="bg-base-bg text-palenight-50">
<nav class="bg-base-darker/80 backdrop-blur-sm shadow-sm border-b border-palenight-400/20 mb-8">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between h-16">
<a href="/" class="text-accent-yellow font-serif text-xl font-bold">Glenn Thompson</a>
<div class="flex items-center gap-2 text-accent-yellow text-sm font-bold">
<span>development, guix, tools, workflow, productivity, web</span>
<span>•</span>
<time datetime="2025-03-08">March 8, 2025</time>
<span>•</span>
<span>6 min read</span>
</div>
</div>
</div>
</nav>
<main class="pt-24 pb-16 px-4">
<div class="max-w-4xl mx-auto">
<div class="content text-palenight-100 space-y-6">
<header class="mb-8">
<h1 class="text-4xl font-serif font-bold text-accent-yellow">My Development Environment in 2025: From Editor to Deployment</h1>
<div class="flex items-center gap-4 text-palenight-300 mt-4">
<time datetime="2025-03-08">2025-03-08</time>
<span>•</span>
<span>6 min read</span>
<span>•</span>
<span>By Glenn Thompson</span>
</div>
<div class="flex flex-wrap gap-2 mt-4">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guix</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tools</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">workflow</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">productivity</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">web</span>
</div>
</header>
<article class="prose prose-palenight max-w-none">
<h2>Introduction</h2>
<p>The tools we use shape how we work. Over the years, my development environment has evolved alongside my technical journey through different programming languages, paradigms, and projects. This post offers a snapshot of my current setup in early 2025, detailing the choices I&#39;ve made and why they work for me.</p>
<h2>System Foundation: ArcoLinux with GNU Guix</h2>
<p>My journey to <a href="https://guix.gnu.org/">GNU Guix</a> began through my exploration of Scheme programming, as I detailed in my <a href="/content/posts/2024-07-26-gnu-guix-journey.html">GNU Guix Journey</a> post. While I initially experimented with Guix System, I&#39;ve settled on a hybrid approach: running Guix as a package manager on top of ArcoLinux (an Arch-based distribution).</p>
<h3>Current Configuration Approach</h3>
<p>I manage my development environment using a combination of Arch&#39;s pacman, AUR, and Guix&#39;s declarative package management. My Guix configuration lives in a Git repository, allowing me to:</p>
<ul>
<li>Track changes to my development environment over time</li>
<li>Reproduce my development setup on new hardware</li>
<li>Roll back to previous package states when needed</li>
<li>Share configuration snippets with the community</li>
</ul>
<h3>Key Packages and Tools</h3>
<p>I maintain a hybrid package approach:</p>
<p><strong>System packages (via pacman/AUR):</strong></p>
<ul>
<li>Base system utilities and desktop environment</li>
<li>Graphics drivers and hardware support</li>
<li>Some GUI applications</li>
</ul>
<p><strong>Development tools (via Guix):</strong></p>
<pre><code class="language-scheme">;; My primary development tools managed by Guix
(specifications-&gt;manifest
&#39;(&quot;emacs&quot; &quot;git&quot; &quot;openssh&quot; &quot;ripgrep&quot; &quot;fd&quot; &quot;exa&quot; &quot;bat&quot;
&quot;guile&quot; &quot;node&quot; &quot;python&quot; &quot;gcc-toolchain&quot; &quot;make&quot;
&quot;nss-certs&quot; &quot;glibc-locales&quot;))
</code></pre>
<p>This hybrid approach gives me the best of both worlds: Arch&#39;s extensive package repository and up-to-date system packages, combined with Guix&#39;s reproducible development environments.</p>
<h3>Reproducibility Benefits</h3>
<p>The reproducibility of Guix for development environments has been invaluable. I can:</p>
<ul>
<li>Spin up development environments with precise dependencies</li>
<li>Ensure consistent behavior across machines</li>
<li>Isolate project-specific dependencies using Guix environments</li>
<li>Share exact environment specifications with collaborators</li>
</ul>
<h3>Challenges and Solutions</h3>
<p>Working with this hybrid approach isn&#39;t without challenges:</p>
<ul>
<li><p><strong>Challenge</strong>: Keeping Guix packages in sync with system libraries<br><strong>Solution</strong>: Careful management of library paths and containerization when needed</p>
</li>
<li><p><strong>Challenge</strong>: Learning curve for Guix&#39;s declarative configuration<br><strong>Solution</strong>: Incremental adoption and community resources</p>
</li>
<li><p><strong>Challenge</strong>: Occasional conflicts between package managers<br><strong>Solution</strong>: Clear separation of responsibilities (system vs. development tools)</p>
</li>
</ul>
<h2>Editor Environment: Emacs</h2>
<p>After experimenting with various editors, I&#39;ve settled on Emacs as my primary development environment. Its extensibility and Scheme-based configuration language (Emacs Lisp) align well with my interests.</p>
<h3>Configuration Approach</h3>
<p>I use a literate configuration with Org mode, which allows me to:</p>
<ul>
<li>Document my configuration choices</li>
<li>Organize settings by purpose rather than file</li>
<li>Selectively load components based on context</li>
<li>Share readable documentation with others</li>
</ul>
<h3>Key Extensions</h3>
<p>My most valuable Emacs extensions include:</p>
<ul>
<li><strong>Magit</strong>: Git interface that has transformed my version control workflow</li>
<li><strong>LSP Mode</strong>: Language server integration for intelligent code assistance</li>
<li><strong>Org Mode</strong>: For notes, task management, and literate programming</li>
<li><strong>Projectile</strong>: Project navigation and management</li>
<li><strong>Company</strong>: Completion framework</li>
<li><strong>Consult/Vertico/Marginalia</strong>: Modern completion UI</li>
<li><strong>Tree-sitter</strong>: Improved syntax highlighting and structural editing</li>
</ul>
<h3>Language-Specific Setups</h3>
<p>For my primary languages:</p>
<ul>
<li><strong>Scheme/Guile</strong>: Geiser for REPL integration</li>
<li><strong>JavaScript/TypeScript</strong>: TypeScript LSP, prettier, eslint integration</li>
<li><strong>Python</strong>: Pyright LSP, black formatting</li>
<li><strong>Web Development</strong>: Web mode, emmet, css-mode</li>
</ul>
<h3>Productivity Enhancements</h3>
<p>Some productivity boosters in my setup:</p>
<ul>
<li>Custom keybindings for frequent operations</li>
<li>Snippets for common code patterns</li>
<li>Template generation for new projects</li>
<li>Integration with system notifications</li>
</ul>
<h2>Terminal and CLI Tools</h2>
<p>While Emacs handles many tasks, I still rely heavily on terminal tools for specific workflows.</p>
<h3>Shell Configuration</h3>
<p>I use Zsh with a custom configuration that provides:</p>
<ul>
<li>Intuitive aliases</li>
<li>Helpful prompts with Git integration</li>
<li>Command history management</li>
<li>Directory navigation shortcuts</li>
</ul>
<h3>Custom Scripts and Utilities</h3>
<p>I&#39;ve developed several custom scripts to streamline repetitive tasks:</p>
<ul>
<li>Project initialization templates</li>
<li>Deployment automation</li>
<li>System maintenance routines</li>
<li>Content management for this blog</li>
</ul>
<h3>Task Automation</h3>
<p>For task automation, I use a combination of:</p>
<ul>
<li>Shell scripts for simple operations</li>
<li>Guile scripts for more complex logic</li>
<li>Make for build processes</li>
<li>Cron for scheduled tasks</li>
</ul>
<h3>Version Control Workflow</h3>
<p>My Git workflow relies on:</p>
<ul>
<li>Branch-per-feature approach</li>
<li>Interactive rebasing for clean history</li>
<li>Commit message templates</li>
<li>Hooks for quality checks</li>
</ul>
<h2>Web Development Stack</h2>
<p>As the creator of this website, my web development setup has been refined through experience.</p>
<h3>Local Development Server</h3>
<p>For local development, I use:</p>
<ul>
<li>Live-server for static sites</li>
<li>Custom Node.js servers for API development</li>
<li>Docker containers for complex dependencies</li>
</ul>
<h3>Build Tools and Processes</h3>
<p>My build process typically involves:</p>
<ul>
<li>Tailwind CSS for styling</li>
<li>Minimal JavaScript bundling</li>
<li>Custom static site generation (as detailed in my <a href="/content/posts/2025-01-02-from-haunt-to-custom.html">previous post</a>)</li>
<li>Automated optimization steps</li>
</ul>
<h3>Testing Approach</h3>
<p>For testing, I employ:</p>
<ul>
<li>Jest for JavaScript unit tests</li>
<li>Cypress for end-to-end testing</li>
<li>Manual testing across devices and browsers</li>
<li>Accessibility validation tools</li>
</ul>
<h3>Browser Tools and Extensions</h3>
<p>Essential browser tools include:</p>
<ul>
<li>Firefox Developer Edition as my primary browser</li>
<li>Chrome for cross-browser testing</li>
<li>DevTools for performance analysis</li>
<li>React and Redux DevTools</li>
<li>Accessibility checkers</li>
</ul>
<h2>Deployment Pipeline</h2>
<p>My approach to deployment emphasizes security and reliability.</p>
<h3>Secure Deployment Process</h3>
<p>As you might have noticed from my <a href="/content/posts/2025-03-08-my-dev-environment-2025.html">.env.gpg file</a>, I take security seriously:</p>
<ul>
<li>Credentials stored in GPG-encrypted files</li>
<li>Separate development and production configurations</li>
<li>Principle of least privilege for service accounts</li>
<li>Regular security audits</li>
</ul>
<h3>Automation Scripts</h3>
<p>My deployment is automated through:</p>
<ul>
<li>Custom shell scripts for build and deploy</li>
<li>Validation steps before deployment</li>
<li>Rollback capabilities</li>
<li>Notification systems for success/failure</li>
</ul>
<h3>CI/CD Considerations</h3>
<p>While not using a formal CI/CD pipeline for this personal site, I follow similar principles:</p>
<ul>
<li>Pre-commit checks for code quality</li>
<li>Automated testing before deployment</li>
<li>Consistent build environments</li>
<li>Deployment approval steps</li>
</ul>
<h3>Monitoring and Analytics</h3>
<p>For site monitoring, I use:</p>
<ul>
<li>Simple analytics for privacy-respecting visitor tracking</li>
<li>Uptime monitoring</li>
<li>Performance metrics collection</li>
<li>Error logging and alerting</li>
</ul>
<h2>Future Improvements</h2>
<p>My environment continues to evolve. Areas I&#39;m exploring include:</p>
<ul>
<li>Further integration between Emacs and system tools</li>
<li>More comprehensive test automation</li>
<li>Expanded use of Guix channels for package management</li>
<li>Improved mobile development workflow</li>
</ul>
<h2>Conclusion</h2>
<p>A development environment is deeply personal, reflecting both technical needs and individual preferences. Mine has evolved through years of experimentation, learning, and refinement.</p>
<p>The most important lesson I&#39;ve learned is that tools should serve your workflow, not dictate it. Be willing to experiment, but also recognize when a tool is working well enough that further optimization yields diminishing returns.</p>
<p>I hope sharing my setup provides some inspiration for your own environment. I&#39;d love to hear about your setup and what tools have made the biggest difference in your workflow.</p>
<p>What aspects of your development environment have you found most valuable? Are there tools or approaches you think I should consider? Let me know!</p>
</article>
</div>
</div>
</main>
<footer class="bg-base-darker text-palenight-200 py-12 border-t border-palenight-400/20">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center">
<p class="text-palenight-300">&copy; 2024 Glenn Thompson. All rights reserved.</p>
<div class="webring-text mt-6">
<p class="text-palenight-300">I am part of the <a href="https://systemcrafters.net" target="_blank" class="text-accent-blue hover:text-accent-cyan">System Crafters</a> webring:</p>
</div>
<div class="craftering mt-2 flex items-center justify-center gap-4 text-accent-blue">
<a href="https://craftering.systemcrafters.net/@glenneth/previous" class="hover:text-accent-cyan">Previous</a>
<a href="https://craftering.systemcrafters.net/@glenneth" class="hover:text-accent-cyan">Random</a>
<a href="https://craftering.systemcrafters.net/@glenneth/next" class="hover:text-accent-cyan">Next</a>
</div>
<p class="text-palenight-300 mt-2">
<a href="mailto:glenn@glenneth.org" class="text-accent-blue hover:text-accent-cyan transition-colors">glenn@glenneth.org</a> |
<a href="https://glenneth.org" class="text-accent-blue hover:text-accent-cyan transition-colors">glenneth.org</a>
</p>
</div>
</div>
</footer>
</body>
</html>

211
deploy/feed.xml
View File

@ -6,7 +6,7 @@
<link>https://glenneth.org</link>
<atom:link href="https://glenneth.org/feed.xml" rel="self" type="application/rss+xml" />
<language>en-us</language>
<lastBuildDate>Thu, 02 Jan 2025 08:57:11 GMT</lastBuildDate>
<lastBuildDate>Sat, 08 Mar 2025 10:36:20 GMT</lastBuildDate>
<item>
<title>Aesthetic Meets Ergonomics: My Deep Dive into the Glove80 Keyboard</title>
@ -41,6 +41,215 @@
<category>["personal", "tech", "keyboards", "glove80"]</category>
</item>
<item>
<title>My Development Environment in 2025: From Editor to Deployment</title>
<description>A comprehensive look at my current development setup in 2025, covering everything from my GNU Guix system foundation to editor configurations, terminal tools, and deployment processes.</description>
<content:encoded><![CDATA[<h2>Introduction</h2>
<p>The tools we use shape how we work. Over the years, my development environment has evolved alongside my technical journey through different programming languages, paradigms, and projects. This post offers a snapshot of my current setup in early 2025, detailing the choices I&#39;ve made and why they work for me.</p>
<h2>System Foundation: ArcoLinux with GNU Guix</h2>
<p>My journey to <a href="https://guix.gnu.org/">GNU Guix</a> began through my exploration of Scheme programming, as I detailed in my <a href="/content/posts/2024-07-26-gnu-guix-journey.html">GNU Guix Journey</a> post. While I initially experimented with Guix System, I&#39;ve settled on a hybrid approach: running Guix as a package manager on top of ArcoLinux (an Arch-based distribution).</p>
<h3>Current Configuration Approach</h3>
<p>I manage my development environment using a combination of Arch&#39;s pacman, AUR, and Guix&#39;s declarative package management. My Guix configuration lives in a Git repository, allowing me to:</p>
<ul>
<li>Track changes to my development environment over time</li>
<li>Reproduce my development setup on new hardware</li>
<li>Roll back to previous package states when needed</li>
<li>Share configuration snippets with the community</li>
</ul>
<h3>Key Packages and Tools</h3>
<p>I maintain a hybrid package approach:</p>
<p><strong>System packages (via pacman/AUR):</strong></p>
<ul>
<li>Base system utilities and desktop environment</li>
<li>Graphics drivers and hardware support</li>
<li>Some GUI applications</li>
</ul>
<p><strong>Development tools (via Guix):</strong></p>
<pre><code class="language-scheme">;; My primary development tools managed by Guix
(specifications-&gt;manifest
&#39;(&quot;emacs&quot; &quot;git&quot; &quot;openssh&quot; &quot;ripgrep&quot; &quot;fd&quot; &quot;exa&quot; &quot;bat&quot;
&quot;guile&quot; &quot;node&quot; &quot;python&quot; &quot;gcc-toolchain&quot; &quot;make&quot;
&quot;nss-certs&quot; &quot;glibc-locales&quot;))
</code></pre>
<p>This hybrid approach gives me the best of both worlds: Arch&#39;s extensive package repository and up-to-date system packages, combined with Guix&#39;s reproducible development environments.</p>
<h3>Reproducibility Benefits</h3>
<p>The reproducibility of Guix for development environments has been invaluable. I can:</p>
<ul>
<li>Spin up development environments with precise dependencies</li>
<li>Ensure consistent behavior across machines</li>
<li>Isolate project-specific dependencies using Guix environments</li>
<li>Share exact environment specifications with collaborators</li>
</ul>
<h3>Challenges and Solutions</h3>
<p>Working with this hybrid approach isn&#39;t without challenges:</p>
<ul>
<li><p><strong>Challenge</strong>: Keeping Guix packages in sync with system libraries<br><strong>Solution</strong>: Careful management of library paths and containerization when needed</p>
</li>
<li><p><strong>Challenge</strong>: Learning curve for Guix&#39;s declarative configuration<br><strong>Solution</strong>: Incremental adoption and community resources</p>
</li>
<li><p><strong>Challenge</strong>: Occasional conflicts between package managers<br><strong>Solution</strong>: Clear separation of responsibilities (system vs. development tools)</p>
</li>
</ul>
<h2>Editor Environment: Emacs</h2>
<p>After experimenting with various editors, I&#39;ve settled on Emacs as my primary development environment. Its extensibility and Scheme-based configuration language (Emacs Lisp) align well with my interests.</p>
<h3>Configuration Approach</h3>
<p>I use a literate configuration with Org mode, which allows me to:</p>
<ul>
<li>Document my configuration choices</li>
<li>Organize settings by purpose rather than file</li>
<li>Selectively load components based on context</li>
<li>Share readable documentation with others</li>
</ul>
<h3>Key Extensions</h3>
<p>My most valuable Emacs extensions include:</p>
<ul>
<li><strong>Magit</strong>: Git interface that has transformed my version control workflow</li>
<li><strong>LSP Mode</strong>: Language server integration for intelligent code assistance</li>
<li><strong>Org Mode</strong>: For notes, task management, and literate programming</li>
<li><strong>Projectile</strong>: Project navigation and management</li>
<li><strong>Company</strong>: Completion framework</li>
<li><strong>Consult/Vertico/Marginalia</strong>: Modern completion UI</li>
<li><strong>Tree-sitter</strong>: Improved syntax highlighting and structural editing</li>
</ul>
<h3>Language-Specific Setups</h3>
<p>For my primary languages:</p>
<ul>
<li><strong>Scheme/Guile</strong>: Geiser for REPL integration</li>
<li><strong>JavaScript/TypeScript</strong>: TypeScript LSP, prettier, eslint integration</li>
<li><strong>Python</strong>: Pyright LSP, black formatting</li>
<li><strong>Web Development</strong>: Web mode, emmet, css-mode</li>
</ul>
<h3>Productivity Enhancements</h3>
<p>Some productivity boosters in my setup:</p>
<ul>
<li>Custom keybindings for frequent operations</li>
<li>Snippets for common code patterns</li>
<li>Template generation for new projects</li>
<li>Integration with system notifications</li>
</ul>
<h2>Terminal and CLI Tools</h2>
<p>While Emacs handles many tasks, I still rely heavily on terminal tools for specific workflows.</p>
<h3>Shell Configuration</h3>
<p>I use Zsh with a custom configuration that provides:</p>
<ul>
<li>Intuitive aliases</li>
<li>Helpful prompts with Git integration</li>
<li>Command history management</li>
<li>Directory navigation shortcuts</li>
</ul>
<h3>Custom Scripts and Utilities</h3>
<p>I&#39;ve developed several custom scripts to streamline repetitive tasks:</p>
<ul>
<li>Project initialization templates</li>
<li>Deployment automation</li>
<li>System maintenance routines</li>
<li>Content management for this blog</li>
</ul>
<h3>Task Automation</h3>
<p>For task automation, I use a combination of:</p>
<ul>
<li>Shell scripts for simple operations</li>
<li>Guile scripts for more complex logic</li>
<li>Make for build processes</li>
<li>Cron for scheduled tasks</li>
</ul>
<h3>Version Control Workflow</h3>
<p>My Git workflow relies on:</p>
<ul>
<li>Branch-per-feature approach</li>
<li>Interactive rebasing for clean history</li>
<li>Commit message templates</li>
<li>Hooks for quality checks</li>
</ul>
<h2>Web Development Stack</h2>
<p>As the creator of this website, my web development setup has been refined through experience.</p>
<h3>Local Development Server</h3>
<p>For local development, I use:</p>
<ul>
<li>Live-server for static sites</li>
<li>Custom Node.js servers for API development</li>
<li>Docker containers for complex dependencies</li>
</ul>
<h3>Build Tools and Processes</h3>
<p>My build process typically involves:</p>
<ul>
<li>Tailwind CSS for styling</li>
<li>Minimal JavaScript bundling</li>
<li>Custom static site generation (as detailed in my <a href="/content/posts/2025-01-02-from-haunt-to-custom.html">previous post</a>)</li>
<li>Automated optimization steps</li>
</ul>
<h3>Testing Approach</h3>
<p>For testing, I employ:</p>
<ul>
<li>Jest for JavaScript unit tests</li>
<li>Cypress for end-to-end testing</li>
<li>Manual testing across devices and browsers</li>
<li>Accessibility validation tools</li>
</ul>
<h3>Browser Tools and Extensions</h3>
<p>Essential browser tools include:</p>
<ul>
<li>Firefox Developer Edition as my primary browser</li>
<li>Chrome for cross-browser testing</li>
<li>DevTools for performance analysis</li>
<li>React and Redux DevTools</li>
<li>Accessibility checkers</li>
</ul>
<h2>Deployment Pipeline</h2>
<p>My approach to deployment emphasizes security and reliability.</p>
<h3>Secure Deployment Process</h3>
<p>As you might have noticed from my <a href="/content/posts/2025-03-08-my-dev-environment-2025.html">.env.gpg file</a>, I take security seriously:</p>
<ul>
<li>Credentials stored in GPG-encrypted files</li>
<li>Separate development and production configurations</li>
<li>Principle of least privilege for service accounts</li>
<li>Regular security audits</li>
</ul>
<h3>Automation Scripts</h3>
<p>My deployment is automated through:</p>
<ul>
<li>Custom shell scripts for build and deploy</li>
<li>Validation steps before deployment</li>
<li>Rollback capabilities</li>
<li>Notification systems for success/failure</li>
</ul>
<h3>CI/CD Considerations</h3>
<p>While not using a formal CI/CD pipeline for this personal site, I follow similar principles:</p>
<ul>
<li>Pre-commit checks for code quality</li>
<li>Automated testing before deployment</li>
<li>Consistent build environments</li>
<li>Deployment approval steps</li>
</ul>
<h3>Monitoring and Analytics</h3>
<p>For site monitoring, I use:</p>
<ul>
<li>Simple analytics for privacy-respecting visitor tracking</li>
<li>Uptime monitoring</li>
<li>Performance metrics collection</li>
<li>Error logging and alerting</li>
</ul>
<h2>Future Improvements</h2>
<p>My environment continues to evolve. Areas I&#39;m exploring include:</p>
<ul>
<li>Further integration between Emacs and system tools</li>
<li>More comprehensive test automation</li>
<li>Expanded use of Guix channels for package management</li>
<li>Improved mobile development workflow</li>
</ul>
<h2>Conclusion</h2>
<p>A development environment is deeply personal, reflecting both technical needs and individual preferences. Mine has evolved through years of experimentation, learning, and refinement.</p>
<p>The most important lesson I&#39;ve learned is that tools should serve your workflow, not dictate it. Be willing to experiment, but also recognize when a tool is working well enough that further optimization yields diminishing returns.</p>
<p>I hope sharing my setup provides some inspiration for your own environment. I&#39;d love to hear about your setup and what tools have made the biggest difference in your workflow.</p>
<p>What aspects of your development environment have you found most valuable? Are there tools or approaches you think I should consider? Let me know!</p>
]]></content:encoded>
<link>https://glenneth.org/content/posts/2025-03-08-my-dev-environment-2025.html</link>
<guid isPermaLink="true">https://glenneth.org/content/posts/2025-03-08-my-dev-environment-2025.html</guid>
<pubDate>Sat, 08 Mar 2025 00:00:00 GMT</pubDate>
<author>Glenn Thompson</author>
<category>development, guix, tools, workflow, productivity, web</category>
</item>
<item>
<title>From Hugo to Haunt to Custom: My Journey in Static Site Generation</title>
<description>A reflection on my evolving journey through static site generators - from Hugo to Haunt, and finally to building my own custom solution, highlighting the valuable lessons learned along the way.</description>

47
deploy/index.html
View File

@ -61,7 +61,26 @@
<div class="grid gap-8 md:grid-cols-2">
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>development</span><span>•</span><span>guix</span><span>•</span><span>tools</span><span>•</span><span>workflow</span><span>•</span><span>productivity</span><span>•</span><span>web</span>
<span>•</span>
<time datetime="2025-03-08">March 8, 2025</time>
</div>
<h3 class="text-xl font-serif font-bold text-accent-yellow mb-3">
<a href="/content/posts/2025-03-08-my-dev-environment-2025.html" class="hover:text-accent-cyan transition-colors">
My Development Environment in 2025: From Editor to Deployment
</a>
</h3>
<p class="text-palenight-100 mb-4">The tools we use shape how we work. Over the years, my development environment has evolved alongside my technical journey through different programming languages, paradigms, and projects. This post of...</p>
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guix</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tools</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">workflow</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">productivity</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">web</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>web</span><span>•</span><span>development</span><span>•</span><span>javascript</span><span>•</span><span>static-site</span><span>•</span><span>haunt</span><span>•</span><span>guile</span><span>•</span><span>hugo</span>
<span>•</span>
@ -73,14 +92,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">My journey with static site generators has been one of continuous learning and evolution. It started with Hugo, transitioned through Haunt, and has now led me to build my own custom solution. Each ste...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">web</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">javascript</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">static-site</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">haunt</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guile</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">hugo</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>tech</span><span>•</span><span>guile</span><span>•</span><span>scheme</span><span>•</span><span>development</span><span>•</span><span>functional-programming</span>
<span>•</span>
@ -92,14 +111,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">A few months ago, I shared my journey into learning Scheme through building stash, a symlink manager. Since then, I've discovered that the gap between learning Scheme and applying it to real-world pro...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guile</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">scheme</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">functional-programming</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>personal</span><span>•</span><span>tech</span><span>•</span><span>guile</span><span>•</span><span>scheme</span><span>•</span><span>gnu</span><span>•</span><span>development</span>
<span>•</span>
@ -111,14 +130,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">I've spent my career as an electrical engineer, not a software developer. However, my recent journey in to GNU/Liniux required a tool for managing symlinks, and that's how I began learning Scheme—spec...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">personal</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guile</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">scheme</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">gnu</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>personal</span><span>•</span><span>tech</span><span>•</span><span>gnu</span><span>•</span><span>guix</span><span>•</span><span>swaywm</span><span>•</span><span>nvidia</span>
<span>•</span>
@ -130,14 +149,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">As a long-time user of Arch Linux, I decided to explore the world of GNU Guix to see if it could better suit my needs, especially with my growing interest in functional package management. The journey...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">personal</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">gnu</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guix</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">swaywm</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">nvidia</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>personal</span><span>•</span><span>tech</span><span>•</span><span>keyboards</span><span>•</span><span>glove80</span>
<span>•</span>
@ -149,14 +168,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">Hello there! I'm Glenn Thompson, and today, I want to share a significant part of my recent journey into the world of Scheme, GNU Guix, and static site generation.</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">personal</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">keyboards</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">glove80</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>work</span><span>•</span><span>travel</span>
<span>•</span>
@ -168,14 +187,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">Two weeks ago was a whirlwind of events, taking me from the conforting embrace of Amman, Jordan to the vibrant streets of Newcastle, England. It was a journey filled with highs and lows, professional...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">work</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">travel</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>personal</span><span>•</span><span>tech</span><span>•</span><span>keyboards</span><span>•</span><span>glove80</span>
<span>•</span>
@ -187,7 +206,7 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">As my career trajectory veered from being an integral member of an electrical engineering team to assuming the role of Deputy Project Manager, the nature of my daily activities underwent a significant...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">personal</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">keyboards</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">glove80</span>
</div>
</article>

4
deploy/js/md-to-html.js
View File

@ -280,7 +280,7 @@ async function updateIndexWithSummaries() {
// Create the HTML for blog posts
const postsHtml = posts.map(post => `
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
${post.tags.map(tag => `<span>•</span><span>${tag}</span>`).join('')}
<span>•</span>
@ -292,7 +292,7 @@ async function updateIndexWithSummaries() {
</a>
</h3>
<p class="text-palenight-100 mb-4">${post.summary}</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
${post.tags.map(tag => `<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">${tag}</span>`).join('')}
</div>
</article>

211
feed.xml
View File

@ -6,7 +6,7 @@
<link>https://glenneth.org</link>
<atom:link href="https://glenneth.org/feed.xml" rel="self" type="application/rss+xml" />
<language>en-us</language>
<lastBuildDate>Thu, 02 Jan 2025 08:57:11 GMT</lastBuildDate>
<lastBuildDate>Sat, 08 Mar 2025 10:36:20 GMT</lastBuildDate>
<item>
<title>Aesthetic Meets Ergonomics: My Deep Dive into the Glove80 Keyboard</title>
@ -41,6 +41,215 @@
<category>["personal", "tech", "keyboards", "glove80"]</category>
</item>
<item>
<title>My Development Environment in 2025: From Editor to Deployment</title>
<description>A comprehensive look at my current development setup in 2025, covering everything from my GNU Guix system foundation to editor configurations, terminal tools, and deployment processes.</description>
<content:encoded><![CDATA[<h2>Introduction</h2>
<p>The tools we use shape how we work. Over the years, my development environment has evolved alongside my technical journey through different programming languages, paradigms, and projects. This post offers a snapshot of my current setup in early 2025, detailing the choices I&#39;ve made and why they work for me.</p>
<h2>System Foundation: ArcoLinux with GNU Guix</h2>
<p>My journey to <a href="https://guix.gnu.org/">GNU Guix</a> began through my exploration of Scheme programming, as I detailed in my <a href="/content/posts/2024-07-26-gnu-guix-journey.html">GNU Guix Journey</a> post. While I initially experimented with Guix System, I&#39;ve settled on a hybrid approach: running Guix as a package manager on top of ArcoLinux (an Arch-based distribution).</p>
<h3>Current Configuration Approach</h3>
<p>I manage my development environment using a combination of Arch&#39;s pacman, AUR, and Guix&#39;s declarative package management. My Guix configuration lives in a Git repository, allowing me to:</p>
<ul>
<li>Track changes to my development environment over time</li>
<li>Reproduce my development setup on new hardware</li>
<li>Roll back to previous package states when needed</li>
<li>Share configuration snippets with the community</li>
</ul>
<h3>Key Packages and Tools</h3>
<p>I maintain a hybrid package approach:</p>
<p><strong>System packages (via pacman/AUR):</strong></p>
<ul>
<li>Base system utilities and desktop environment</li>
<li>Graphics drivers and hardware support</li>
<li>Some GUI applications</li>
</ul>
<p><strong>Development tools (via Guix):</strong></p>
<pre><code class="language-scheme">;; My primary development tools managed by Guix
(specifications-&gt;manifest
&#39;(&quot;emacs&quot; &quot;git&quot; &quot;openssh&quot; &quot;ripgrep&quot; &quot;fd&quot; &quot;exa&quot; &quot;bat&quot;
&quot;guile&quot; &quot;node&quot; &quot;python&quot; &quot;gcc-toolchain&quot; &quot;make&quot;
&quot;nss-certs&quot; &quot;glibc-locales&quot;))
</code></pre>
<p>This hybrid approach gives me the best of both worlds: Arch&#39;s extensive package repository and up-to-date system packages, combined with Guix&#39;s reproducible development environments.</p>
<h3>Reproducibility Benefits</h3>
<p>The reproducibility of Guix for development environments has been invaluable. I can:</p>
<ul>
<li>Spin up development environments with precise dependencies</li>
<li>Ensure consistent behavior across machines</li>
<li>Isolate project-specific dependencies using Guix environments</li>
<li>Share exact environment specifications with collaborators</li>
</ul>
<h3>Challenges and Solutions</h3>
<p>Working with this hybrid approach isn&#39;t without challenges:</p>
<ul>
<li><p><strong>Challenge</strong>: Keeping Guix packages in sync with system libraries<br><strong>Solution</strong>: Careful management of library paths and containerization when needed</p>
</li>
<li><p><strong>Challenge</strong>: Learning curve for Guix&#39;s declarative configuration<br><strong>Solution</strong>: Incremental adoption and community resources</p>
</li>
<li><p><strong>Challenge</strong>: Occasional conflicts between package managers<br><strong>Solution</strong>: Clear separation of responsibilities (system vs. development tools)</p>
</li>
</ul>
<h2>Editor Environment: Emacs</h2>
<p>After experimenting with various editors, I&#39;ve settled on Emacs as my primary development environment. Its extensibility and Scheme-based configuration language (Emacs Lisp) align well with my interests.</p>
<h3>Configuration Approach</h3>
<p>I use a literate configuration with Org mode, which allows me to:</p>
<ul>
<li>Document my configuration choices</li>
<li>Organize settings by purpose rather than file</li>
<li>Selectively load components based on context</li>
<li>Share readable documentation with others</li>
</ul>
<h3>Key Extensions</h3>
<p>My most valuable Emacs extensions include:</p>
<ul>
<li><strong>Magit</strong>: Git interface that has transformed my version control workflow</li>
<li><strong>LSP Mode</strong>: Language server integration for intelligent code assistance</li>
<li><strong>Org Mode</strong>: For notes, task management, and literate programming</li>
<li><strong>Projectile</strong>: Project navigation and management</li>
<li><strong>Company</strong>: Completion framework</li>
<li><strong>Consult/Vertico/Marginalia</strong>: Modern completion UI</li>
<li><strong>Tree-sitter</strong>: Improved syntax highlighting and structural editing</li>
</ul>
<h3>Language-Specific Setups</h3>
<p>For my primary languages:</p>
<ul>
<li><strong>Scheme/Guile</strong>: Geiser for REPL integration</li>
<li><strong>JavaScript/TypeScript</strong>: TypeScript LSP, prettier, eslint integration</li>
<li><strong>Python</strong>: Pyright LSP, black formatting</li>
<li><strong>Web Development</strong>: Web mode, emmet, css-mode</li>
</ul>
<h3>Productivity Enhancements</h3>
<p>Some productivity boosters in my setup:</p>
<ul>
<li>Custom keybindings for frequent operations</li>
<li>Snippets for common code patterns</li>
<li>Template generation for new projects</li>
<li>Integration with system notifications</li>
</ul>
<h2>Terminal and CLI Tools</h2>
<p>While Emacs handles many tasks, I still rely heavily on terminal tools for specific workflows.</p>
<h3>Shell Configuration</h3>
<p>I use Zsh with a custom configuration that provides:</p>
<ul>
<li>Intuitive aliases</li>
<li>Helpful prompts with Git integration</li>
<li>Command history management</li>
<li>Directory navigation shortcuts</li>
</ul>
<h3>Custom Scripts and Utilities</h3>
<p>I&#39;ve developed several custom scripts to streamline repetitive tasks:</p>
<ul>
<li>Project initialization templates</li>
<li>Deployment automation</li>
<li>System maintenance routines</li>
<li>Content management for this blog</li>
</ul>
<h3>Task Automation</h3>
<p>For task automation, I use a combination of:</p>
<ul>
<li>Shell scripts for simple operations</li>
<li>Guile scripts for more complex logic</li>
<li>Make for build processes</li>
<li>Cron for scheduled tasks</li>
</ul>
<h3>Version Control Workflow</h3>
<p>My Git workflow relies on:</p>
<ul>
<li>Branch-per-feature approach</li>
<li>Interactive rebasing for clean history</li>
<li>Commit message templates</li>
<li>Hooks for quality checks</li>
</ul>
<h2>Web Development Stack</h2>
<p>As the creator of this website, my web development setup has been refined through experience.</p>
<h3>Local Development Server</h3>
<p>For local development, I use:</p>
<ul>
<li>Live-server for static sites</li>
<li>Custom Node.js servers for API development</li>
<li>Docker containers for complex dependencies</li>
</ul>
<h3>Build Tools and Processes</h3>
<p>My build process typically involves:</p>
<ul>
<li>Tailwind CSS for styling</li>
<li>Minimal JavaScript bundling</li>
<li>Custom static site generation (as detailed in my <a href="/content/posts/2025-01-02-from-haunt-to-custom.html">previous post</a>)</li>
<li>Automated optimization steps</li>
</ul>
<h3>Testing Approach</h3>
<p>For testing, I employ:</p>
<ul>
<li>Jest for JavaScript unit tests</li>
<li>Cypress for end-to-end testing</li>
<li>Manual testing across devices and browsers</li>
<li>Accessibility validation tools</li>
</ul>
<h3>Browser Tools and Extensions</h3>
<p>Essential browser tools include:</p>
<ul>
<li>Firefox Developer Edition as my primary browser</li>
<li>Chrome for cross-browser testing</li>
<li>DevTools for performance analysis</li>
<li>React and Redux DevTools</li>
<li>Accessibility checkers</li>
</ul>
<h2>Deployment Pipeline</h2>
<p>My approach to deployment emphasizes security and reliability.</p>
<h3>Secure Deployment Process</h3>
<p>As you might have noticed from my <a href="/content/posts/2025-03-08-my-dev-environment-2025.html">.env.gpg file</a>, I take security seriously:</p>
<ul>
<li>Credentials stored in GPG-encrypted files</li>
<li>Separate development and production configurations</li>
<li>Principle of least privilege for service accounts</li>
<li>Regular security audits</li>
</ul>
<h3>Automation Scripts</h3>
<p>My deployment is automated through:</p>
<ul>
<li>Custom shell scripts for build and deploy</li>
<li>Validation steps before deployment</li>
<li>Rollback capabilities</li>
<li>Notification systems for success/failure</li>
</ul>
<h3>CI/CD Considerations</h3>
<p>While not using a formal CI/CD pipeline for this personal site, I follow similar principles:</p>
<ul>
<li>Pre-commit checks for code quality</li>
<li>Automated testing before deployment</li>
<li>Consistent build environments</li>
<li>Deployment approval steps</li>
</ul>
<h3>Monitoring and Analytics</h3>
<p>For site monitoring, I use:</p>
<ul>
<li>Simple analytics for privacy-respecting visitor tracking</li>
<li>Uptime monitoring</li>
<li>Performance metrics collection</li>
<li>Error logging and alerting</li>
</ul>
<h2>Future Improvements</h2>
<p>My environment continues to evolve. Areas I&#39;m exploring include:</p>
<ul>
<li>Further integration between Emacs and system tools</li>
<li>More comprehensive test automation</li>
<li>Expanded use of Guix channels for package management</li>
<li>Improved mobile development workflow</li>
</ul>
<h2>Conclusion</h2>
<p>A development environment is deeply personal, reflecting both technical needs and individual preferences. Mine has evolved through years of experimentation, learning, and refinement.</p>
<p>The most important lesson I&#39;ve learned is that tools should serve your workflow, not dictate it. Be willing to experiment, but also recognize when a tool is working well enough that further optimization yields diminishing returns.</p>
<p>I hope sharing my setup provides some inspiration for your own environment. I&#39;d love to hear about your setup and what tools have made the biggest difference in your workflow.</p>
<p>What aspects of your development environment have you found most valuable? Are there tools or approaches you think I should consider? Let me know!</p>
]]></content:encoded>
<link>https://glenneth.org/content/posts/2025-03-08-my-dev-environment-2025.html</link>
<guid isPermaLink="true">https://glenneth.org/content/posts/2025-03-08-my-dev-environment-2025.html</guid>
<pubDate>Sat, 08 Mar 2025 00:00:00 GMT</pubDate>
<author>Glenn Thompson</author>
<category>development, guix, tools, workflow, productivity, web</category>
</item>
<item>
<title>From Hugo to Haunt to Custom: My Journey in Static Site Generation</title>
<description>A reflection on my evolving journey through static site generators - from Hugo to Haunt, and finally to building my own custom solution, highlighting the valuable lessons learned along the way.</description>

47
index.html
View File

@ -61,7 +61,26 @@
<div class="grid gap-8 md:grid-cols-2">
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>development</span><span>•</span><span>guix</span><span>•</span><span>tools</span><span>•</span><span>workflow</span><span>•</span><span>productivity</span><span>•</span><span>web</span>
<span>•</span>
<time datetime="2025-03-08">March 8, 2025</time>
</div>
<h3 class="text-xl font-serif font-bold text-accent-yellow mb-3">
<a href="/content/posts/2025-03-08-my-dev-environment-2025.html" class="hover:text-accent-cyan transition-colors">
My Development Environment in 2025: From Editor to Deployment
</a>
</h3>
<p class="text-palenight-100 mb-4">The tools we use shape how we work. Over the years, my development environment has evolved alongside my technical journey through different programming languages, paradigms, and projects. This post of...</p>
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guix</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tools</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">workflow</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">productivity</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">web</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>web</span><span>•</span><span>development</span><span>•</span><span>javascript</span><span>•</span><span>static-site</span><span>•</span><span>haunt</span><span>•</span><span>guile</span><span>•</span><span>hugo</span>
<span>•</span>
@ -73,14 +92,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">My journey with static site generators has been one of continuous learning and evolution. It started with Hugo, transitioned through Haunt, and has now led me to build my own custom solution. Each ste...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">web</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">javascript</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">static-site</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">haunt</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guile</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">hugo</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>tech</span><span>•</span><span>guile</span><span>•</span><span>scheme</span><span>•</span><span>development</span><span>•</span><span>functional-programming</span>
<span>•</span>
@ -92,14 +111,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">A few months ago, I shared my journey into learning Scheme through building stash, a symlink manager. Since then, I've discovered that the gap between learning Scheme and applying it to real-world pro...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guile</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">scheme</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">functional-programming</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>personal</span><span>•</span><span>tech</span><span>•</span><span>guile</span><span>•</span><span>scheme</span><span>•</span><span>gnu</span><span>•</span><span>development</span>
<span>•</span>
@ -111,14 +130,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">I've spent my career as an electrical engineer, not a software developer. However, my recent journey in to GNU/Liniux required a tool for managing symlinks, and that's how I began learning Scheme—spec...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">personal</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guile</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">scheme</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">gnu</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">development</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>personal</span><span>•</span><span>tech</span><span>•</span><span>gnu</span><span>•</span><span>guix</span><span>•</span><span>swaywm</span><span>•</span><span>nvidia</span>
<span>•</span>
@ -130,14 +149,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">As a long-time user of Arch Linux, I decided to explore the world of GNU Guix to see if it could better suit my needs, especially with my growing interest in functional package management. The journey...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">personal</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">gnu</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">guix</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">swaywm</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">nvidia</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>personal</span><span>•</span><span>tech</span><span>•</span><span>keyboards</span><span>•</span><span>glove80</span>
<span>•</span>
@ -149,14 +168,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">Hello there! I'm Glenn Thompson, and today, I want to share a significant part of my recent journey into the world of Scheme, GNU Guix, and static site generation.</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">personal</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">keyboards</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">glove80</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>work</span><span>•</span><span>travel</span>
<span>•</span>
@ -168,14 +187,14 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">Two weeks ago was a whirlwind of events, taking me from the conforting embrace of Amman, Jordan to the vibrant streets of Newcastle, England. It was a journey filled with highs and lows, professional...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">work</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">travel</span>
</div>
</article>
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
<span>•</span><span>personal</span><span>•</span><span>tech</span><span>•</span><span>keyboards</span><span>•</span><span>glove80</span>
<span>•</span>
@ -187,7 +206,7 @@
</a>
</h3>
<p class="text-palenight-100 mb-4">As my career trajectory veered from being an integral member of an electrical engineering team to assuming the role of Deputy Project Manager, the nature of my daily activities underwent a significant...</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">personal</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">tech</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">keyboards</span><span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">glove80</span>
</div>
</article>

4
src/js/md-to-html.js
View File

@ -280,7 +280,7 @@ async function updateIndexWithSummaries() {
// Create the HTML for blog posts
const postsHtml = posts.map(post => `
<article class="bg-base-darker p-6 rounded-lg shadow-lg border border-palenight-400/20 hover:border-accent-purple/40 transition-colors">
<div class="flex items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<div class="flex flex-wrap items-center gap-2 text-accent-yellow text-sm mb-2 font-bold">
<span>Tech</span>
${post.tags.map(tag => `<span>•</span><span>${tag}</span>`).join('')}
<span>•</span>
@ -292,7 +292,7 @@ async function updateIndexWithSummaries() {
</a>
</h3>
<p class="text-palenight-100 mb-4">${post.summary}</p>
<div class="flex gap-2">
<div class="flex flex-wrap gap-2">
${post.tags.map(tag => `<span class="text-accent-yellow px-2 py-1 rounded-full bg-base-bg text-xs">${tag}</span>`).join('')}
</div>
</article>

BIN
website-deploy.zip
View File

Binary file not shown.