Welcome to my first tech blog post! Building reassembled.me has been an excellent way to utilize my "maker" instincts as a part of my healing process. Several months ago, in one of my counseling sessions, I'd had the idea that maybe I could find a way to build a community around CPTSD, and to "pay forward" some of the lessons I'd learned by creating a sort of multimedia gallery; a showcase of some of the many things that I've made, and to share with the world a bit about who I am, and that being "broken" by CPTSD does not actually mean I'm irreparable.
In short, I wanted to create a space where I could showcase my creative pursuits while also documenting my recovery journey with CPTSD. In this post, I'll share a bit about how I actually launched this concept, from soup to nuts.
Choosing the Right Technology Stack
When I started this project, I had several requirements in mind:
- The site needed to be secure and low-maintenance
- I wanted full creative control over the design
- Content management should be straightforward
- The site should be fast and accessible
- The development process itself should be enjoyable and therapeutic, and not one in which I'm obsessing over making the tech "work"
I started with the following prompt in Claude (using Sonnet 3.7):
I’m looking to create a website that is a bit of a multimedia gallery — I want it to focus on a bit about who I am, but also to chronicle and highlight all of my creative endeavors and pursuits.For instance, I: - love to cook, and cook many dishes at home that could easily be restaurant worthy - am a musician and songwriter and producer — music is a therapy mode that heals me - am a technologist — I build software and lead software engineering teams for a living, but I love pursuing and tinkering with technology in my spare time - like to paint — this is another therapeutic outlet for meI have been diagnosed with Complex PTSD. I have been in counseling and therapy for 27 of my 45 years of life. I have ideated about suicide hundreds of times in my life, and have attempted it to varying degrees of severity at least a dozen times.But I have also healed. I want to create a gallery that chronicles my life, in a semi-autobiographical form, but in a way that is distinctly focused on a way to pay forward all that I have learned and overcome from my CPTSD journey.To me, I want this website to serve as a beacon of hope — as a way to invite others to learn about my history, but also as a way for those who are themselves lost to find some hope in their own lives.Help me chart a technical path on where to begin. Should I select a hosting provider? Should I use a CMS? Should I roll my own handcrafted HTML?After a bit of iteration with Claude, I settled on the following.
1. 11ty (Eleventy) as the Static Site Generator
11ty provides the perfect balance of simplicity and flexibility. As a static site generator, it builds the entire site at compile time, resulting in extremely fast page loads and excellent security (there's no server-side code to exploit). Its template-driven approach keeps the codebase clean and maintainable.
Working with 11ty has been surprisingly straightforward. The clear separation between content, templates, and styles creates natural separation of concerns.
2. Sanity.io for Content Management
Sanity provides a headless CMS that lets me structure and manage content without being tied to specific presentation formats. This extends one more concern (content management) and delegates it to a new tool, giving me the freedom to evolve the site's design independently from the content.
3. Netlify for Hosting
Netlify's continuous deployment from Git makes updates seamless. I simply push changes to my repository, and the site automatically rebuilds and deploys. This automation reduces friction and anxiety around site maintenance.
4. Claude (via Claude Code and Windsurf) as my AI Development Partners
Perhaps the most revolutionary aspect of building this site was my use of Generative AI tools. As a technologist, I've been embracing AI tools as accelerators for both productivity and learning, and Claude proved to be an invaluable partner throughout this project.
I've been working in web development since ~1993 — when the web was nascent and making "home pages" was a vanity project for the truly nerdy. These days, the sheer multitude of approaches that one can take to get a website stood up is, frankly, daunting — even for the tech-savvy nerd. It was especially daunting for me — I think the sheer anxiety provoked by "doing it correctly" was a huge detractor in my getting started on this project, frankly.
However, as I've been continuing to integrate GenAI tools into my daily workflows, I thought I'd use Claude to help me get a jumpstart. And it allowed me to overcome that initial "coefficient of static friction" — to where I was able to launch a barebones site, from domain name registration to published content — within mere hours!
Leveraging GenAI in Development
CSS Refactoring and Font Selection
One of the most impressive aspects of working with Claude was how it helped refactor my CSS to be more efficient while preserving the site's aesthetic. This process would have taken me hours of manual work, but Claude analyzed the entire stylesheet, identified repetitive patterns, and consolidated them into a cleaner, more maintainable structure.
When selecting fonts, Claude suggested the combination of Cormorant Garamond for headings and Outfit for body text—a pairing that perfectly balanced artistic flair with readability, especially against a dark background. The AI handled all the font weight variables and letter-spacing customizations to create a cohesive typography system.
All it required was some basic prompting and iteration using Claude Code — and I had a working site on localhost within a few minutes.
Stub Page Generation
While building the site incrementally, I needed placeholder content for sections I hadn't fully developed yet. Claude generated thoughtful "coming soon" pages that maintained consistency with my site's theme of healing through creativity. Each stub page featured relevant quotes, placeholder images, and appropriate messaging—creating a complete site structure even while content was in development.
Knowledge Integration
What was nice was that in generating stubs and placeholders, the basic prompts I'd used allowed Claude to seamlessly incorporate mental health themes in my project. It didn't just help with technical implementation—it suggested content structures and design elements that aligned with the therapeutic aspects of creative expression. It's not been perfect, and I definitely think sometimes — Claude goes a bit overboard (see, e.g., the last sentence about "therapeutic aspects of creative expression" 😉).
Design Philosophy: Reflecting My Healing Journey
The site's design deliberately mirrors aspects of my recovery process:
Dark Theme with Moments of Light
The dark background creates a sense of containment and safety, while accent colors and highlighted elements represent moments of brightness and hope. This visual contrast reflects the non-linear nature of healing—there are darker periods punctuated by moments of clarity and growth.
Structured Yet Fluid Layout
The grid-based layout provides structure and predictability, while interactive elements and subtle animations add a sense of organic movement and life. This balance between order and flexibility mirrors the recovery process: maintaining helpful structures while allowing for natural evolution and change.
Accessibility Focus
Making the site accessible to everyone, regardless of ability, aligns with my values around inclusion and empathy—qualities I've developed more deeply through my own healing journey.
Technical Challenges and Solutions
Integrating 11ty with Sanity
The biggest technical challenge was setting up the data flow between Sanity and 11ty. I solved this by:
- Creating a dedicated Sanity client in 11ty to fetch data at build time
- Implementing a fallback system that uses placeholder data during development
- Setting up incremental builds on Netlify to update the site when content changes in Sanity
Responsive Design Implementation
Creating a site that works well across all devices was crucial. I adopted a "mobile-first" approach using CSS Grid and Flexbox, with carefully placed media queries to enhance the experience on larger screens.
Monorepo Structure
I chose to keep both the 11ty site and Sanity studio in a single repository, which simplifies deployment and ensures consistency between the content models and their presentation.
Personal Reflections
Building this site has become an unexpected part of my therapy. The process of creating something from scratch—making countless decisions about structure, functionality, and aesthetics—has been empowering in a journey where control has often felt elusive.
Writing code requires presence and focus, drawing me into a flow state that provides relief from hypervigilance and rumination. There's also something symbolically appropriate about assembling components into a cohesive whole—reassembling pieces into something new and meaningful, which mirrors my personal healing journey.
The collaborative aspect of working with AI has taught me that asking for help and leveraging available tools isn't a sign of weakness but of wisdom. In both technology and healing, we don't have to do everything alone or reinvent every wheel.
Next Steps
As I continue developing this site, I plan to:
- Enhance interactive elements with subtle animations
- Implement a more sophisticated tagging system
- Create specialized page templates for different content types
- Add progressive web app functionality for offline access
- Improve performance optimizations for images and other assets
- Further explore how AI tools can enhance both my development process and creative expression
I hope sharing both my technical process and personal journey will resonate with others who might be using creative pursuits as part of their healing. Technology doesn't have to be cold or impersonal—it can be a powerful medium for self-expression and growth, especially when augmented by thoughtful AI collaboration.
If you have questions about the technical aspects of this site, how I've integrated AI tools into my workflow, or how creative coding might fit into your own journey, feel free to reach out through the contact page.