Building the New Vector Site: A Look Under the Hood

After a few months of focused work, I wanted to walk you through the changes to our website. This new version has been in active development for the last three months, and while it would have been done sooner, 2025 has been a busy year.

This new site isn’t just a facelift; it’s a reflection of everything we’ve learned over the course of 14 client projects. It incorporates our best practices with i18n, our in-house atomic component structure, and a more refined development approach. It’s been a true labor of love, and I’m honestly proud of where it landed.

Under the Hood

We’re running the site in a Docker container on a Coolify instance with a very small set of libraries. The philosophy was simple: keep things lean and mean.

Backend & Infrastructure

The foundation is built on Astro 5 with server-side rendering, which gives us the best of both worlds: static performance where it counts and dynamic capabilities where we need them. We’re using the Node.js adapter in standalone mode to keep our deployment footprint minimal.

For our internationalization, I implemented a standard i18n approach with a twist—keeping the majority of content in modular JSON files rather than scattered throughout components. It was vital that this respected our ethos and our connection to Latin America, ensuring every word was translated with care, not just automated.

Frontend & Styling

On the frontend, we’re using React 19 for the more interactive pieces (like our 3D gradients and rotating icons), while most of the site uses standard Astro components for optimal performance. Tailwind CSS 4 handles all our styling, with the typography plugin making the blog content look great.

That atomic component structure I mentioned? It’s now a solid base layer of reusable buttons, headers, and text components. On top of that, we have specialized components for the blog, shared sections, and even some canvas-based animations using Three.js.

Development & Deployment

The entire stack is containerized with Docker and runs on Coolify for painless deployment and scaling. We’re using Bun for package management and Prettier (with Astro and Tailwind plugins) to keep the code consistent without having to think about it. It’s a lean setup that delivers speed while giving us the flexibility to integrate with our home-built CRM suite down the line.

Projects & Services

The projects section now has a clean, filterable interface to let visitors explore our portfolio by category. The services section uses a similar approach, with expandable cards that break down our offerings. Both are fully internationalized and responsive, making it easy for potential clients to see what we do, no matter their language. We also integrated a live search filter on both pages to make finding specific content a breeze.

Forms & Communication

We decided to go with Resend after a lot of back and forth with SMTP relays. To be honest, we just weren’t happy with the instability and arbitrary rules of our previous email provider (Google Workspace). Asking our clients to go in and start modifying their office solutions also felt like a misstep and a lack of foresight on our end. We’re much happier with the current implementation.

The new forms integrate honeypots, use custom TypeScript components to handle delivery, and will soon be fully equipped with Resend to protect submissions. I also implemented direct links for WhatsApp and Telegram as alternative contact methods.

The Blog Experience

I’m particularly proud of the work we did on the blog. We added a few amenities to make the reading experience more comfortable, allowing users to switch between dark and light mode, change the font size, and adjust letter spacing. These settings persist, so returning users won’t have to reset their preferences on every visit.

The share component is also working marvelously, letting you share posts to the most popular platforms. I’ll be refining this in the future to add better support for Bluesky, email, and Telegram.

Analytics

We went back and forth on this one. While there are some amazing options out there, we ultimately settled on Google Analytics. For now, it gives us what we need without overcomplicating things or requiring us to get too nitty-gritty with data points. I’m sure this will change as we grow, but it’s the right fit for today.

Looking Ahead

A project like this is never truly “done.” The foundation we’ve built is solid, but there’s always a list of improvements and new features buzzing in my head. Here’s a peek at the current to-do list:

• Fine-tuning the scroll-to behavior so the navigation doesn’t obstruct content.
• Adjusting the sticky positioning on the share component to feel more natural.
• Giving the page backgrounds a bit more visual impact.
• General tweaks to the overall fit and finish.

Thanks for taking a look. I’m excited to see where we can take this platform next.