Expanding My Skills Beyond Front-End Development

As a front-end developer, I’ve recently had the opportunity to work on projects that pushed me beyond my usual domain. These experiences have not only broadened my technical skills but also reshaped the way I collaborate with other teams. Here’s a look at what I’ve been working on and the key lessons I’ve learned along the way.

Setting Up Self-Hosted Services 🤖

Self-Hosted Sentry

Due to strict security policies, our team couldn’t use cloud-based Sentry. So, I was tasked with setting up a self-hosted version in our closed network environment.

• Deploying Sentry using Docker Compose on Google Compute Engine
• Configuring Nginx as a reverse proxy for domain routing
• Setting up firewall rules to secure access to our internal network

This project was a crash course in containerization, cloud infrastructure, and network security. While challenging, it helped me understand how front-end error tracking integrates into a larger system architecture.

Self-Hosted GitHub Actions Runner

I also set up a self-hosted GitHub Actions runner. It was useful when our team reached the GitHub Action available time limit. I became adept at troubleshooting by analyzing error logs and understanding the underlying infrastructure. Specific challenges I tackled included:

• Increasing partition sizes when we underestimated the runner’s disk space requirements
• Finding workarounds for the missing cache feature in our self-hosted setup
• Quickly resolving issues by effectively interpreting error logs

Transitioning CI/CD from Jenkins to GitHub Actions 😎

One of my major tasks was helping to migrate our CI pipeline from Jenkins to GitHub Actions. This involved:

1. Writing CI scripts for various tasks (ex. CI Scripts for Deploying to Different Environments)
2. Deploying Storybook to Google Cloud Storage and securing it with Cloud Armor
3. Implementing semantic versioning via Semantic Release
4. Setting up private package distribution with Verdaccio

This project significantly expanded my understanding of CI/CD practices, cloud services, and package management. I now have a clearer view of how our code transitions from development to production.

Enhanced Cross-Team Communication 🗣️

These experiences have transformed how I collaborate with other teams:

1. When discussing CORS issues with backend developers, I can now communicate more effectively thanks to my improved understanding of the network layer.
2. I’ve become much quicker at problem-solving, especially when analyzing Kubernetes pod logs alongside our DevOps team.
3. In architecture design meetings, I can now contribute insights not just from a front-end perspective, but with consideration for the entire system.

Impact on My Work 🔮

These experiences have naturally influenced my approach to front-end development. Here are some changes I’ve noticed in my day-to-day work:

• Broader perspective on implementations: When working on front-end features, I now consider how they interact with our broader infrastructure. This sometimes leads to more discussions with other teams, but often results in more robust solutions.
• Improved troubleshooting skills: Exposure to various systems has helped me approach debugging more systematically. When facing issues that span multiple services, I feel better equipped to collaborate with other teams to find solutions.
• More active in technical discussions: With a better understanding of our overall system architecture, I find myself contributing more frequently in cross-team planning sessions. While I’m still learning, it’s been rewarding to offer a front-end perspective on broader technical decisions.

While my primary focus is still front-end development, these additional skills have allowed me to be more versatile within our team. When the need arises, I can now assist with some basic infrastructure or DevOps tasks, which has been helpful during crunch times.