<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Gareth Dunne</title>
    <description>The latest articles on Forem by Gareth Dunne (@dunne_dev).</description>
    <link>https://forem.com/dunne_dev</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3849373%2F7e6915c6-fd5a-4fd0-811b-37bcf5e8ac6d.png</url>
      <title>Forem: Gareth Dunne</title>
      <link>https://forem.com/dunne_dev</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/dunne_dev"/>
    <language>en</language>
    <item>
      <title>Exploring MCP UI - the next integral UI layer</title>
      <dc:creator>Gareth Dunne</dc:creator>
      <pubDate>Mon, 30 Mar 2026 14:00:04 +0000</pubDate>
      <link>https://forem.com/dunne_dev/exploring-mcp-ui-the-next-integral-ui-layer-inp</link>
      <guid>https://forem.com/dunne_dev/exploring-mcp-ui-the-next-integral-ui-layer-inp</guid>
      <description>&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fvwjfcshu5otzqfc6amfo.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fvwjfcshu5otzqfc6amfo.png" alt="Exploring MCP UI - the next integral UI layer" width="800" height="338"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Quick note: I'm looking to dive deeper into the technical nature of MCP UI in a separate post. In this post, I want to cover who is adopting MCP UI and why you should care.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What is MCP UI?
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs2ek1d96ulve99adtt9n.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs2ek1d96ulve99adtt9n.png" alt="Exploring MCP UI - the next integral UI layer" width="800" height="585"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://mcpui.dev/?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;MCP UI&lt;/a&gt; is the natural evolution of the Modal Context Protocol. We've seen MCP servers adopted by many providers to give agents access to tools that a server would use.&lt;/p&gt;

&lt;p&gt;However, we didn't have a real UI baked into the LLM user experience. ChatGPT or Claude, only serving text, is quite limiting when trying to take action for a user.&lt;/p&gt;

&lt;p&gt;Think of all the significant effort that's gone into optimising web component libraries in e-commerce, travel, task managers, and analytics tools throughout the years.&lt;/p&gt;

&lt;p&gt;All these tried and tested UX principles are currently being omitted from the LLM user experience. You're telling me that after all these years of handcrafting these component libraries, we don't get to use them in this next wave of web interactions?&lt;/p&gt;

&lt;p&gt;Well, not quite, because MCP UI allows us to bring the UI back into the forefront of the LLM experience. There is currently too much negativity about the role of FE developers in this AI world, so I believe MCP UI could inject a bit of life and complexity back into the frontend space. As a result, I want to explore who is using it.&lt;/p&gt;

&lt;h2&gt;
  
  
  Who are the big players betting on MCP UI?
&lt;/h2&gt;

&lt;p&gt;A new protocol is only as good as its adopters, and reassuringly, some big names have already embraced MCP UI.&lt;/p&gt;

&lt;h3&gt;
  
  
  Shopify
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1p7ed1m3pe3hmei2b72d.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1p7ed1m3pe3hmei2b72d.png" alt="Exploring MCP UI - the next integral UI layer" width="412" height="122"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Shopify appear to be a huge advocate of MCP UI. They see the huge potential upside in the future of &lt;a href="https://shopify.dev/docs/agents?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;agentic commerce&lt;/a&gt;. They are an early adopter of MCP UI in their agent MCP server.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://shopify.dev/docs/agents/catalog?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcxlom002ugq8hdil74dg.webp" alt="Exploring MCP UI - the next integral UI layer" width="800" height="546"&gt;&lt;/a&gt;&lt;br&gt;
&lt;em&gt;Shopify's Catalog MCP&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Shopify provide a very nice developer experience here, and the adoption makes perfect sense in the context of e-commerce. Bringing elements such as product cards and checkout systems into agentic search seems like a natural fit.&lt;/p&gt;

&lt;p&gt;Providing another vertical where developers can build in opens up a huge ecosystem for MCP UI applications. It's definitely worth keeping an eye on how things progress here. A lot of standards for MCP UI has the potential to be molded by Shopify given their track record for great developer experience.&lt;/p&gt;

&lt;p&gt;Admittedly, I am not fully tuned into the latest in Shopify developer experience, but I have previously built a handful of apps within the ecosystem. I found the experience to be much better than other similar ecommerce platforms.&lt;/p&gt;

&lt;p&gt;The engineering org within Shopify is well respected in the industry, and I'd recommend looking at some of the &lt;a href="https://shopify.engineering/?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;engineering content&lt;/a&gt; they are putting out.&lt;/p&gt;

&lt;h2&gt;
  
  
  OpenAI and Stripe (Agentic Commerce Protocol)
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuhc6a440y45hmfxoj6mv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuhc6a440y45hmfxoj6mv.png" alt="Exploring MCP UI - the next integral UI layer" width="800" height="442"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The &lt;a href="https://www.agenticcommerce.dev/?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;Agentic Commerce Protocol&lt;/a&gt; is an open standard for programmatic commerce flows between buyers, AI agents, and businesses. This lets businesses render checkout elements in an AI chat.&lt;/p&gt;

&lt;p&gt;It's an open-source project, but OpenAI and Stripe initially developed it and are now pushing it as the de facto standard in this new wave of shopping through agents.&lt;/p&gt;

&lt;p&gt;The &lt;a href="https://github.com/agentic-commerce-protocol/agentic-commerce-protocol?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;breakdown&lt;/a&gt;of the protocol can be summarised here:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;For businesses&lt;/strong&gt;  - Make your products and services available for purchase through AI agents.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;For AI Agents&lt;/strong&gt;  - Embed commerce into your AI chat without being the merchant of record.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;For payment providers&lt;/strong&gt;  - Process agentic transactions by passing secure payment tokens between buyers and businesses through AI agents.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I've worked on checkout systems in the past; they are hugely complex, with every payment method having its own unique integration and compliance requirements.&lt;/p&gt;

&lt;p&gt;It only makes sense that massive tech companies are trying to build a stable protocol around this. Especially, given the precarious nature of AI agents, such as prompt injection, hallucinations etc.&lt;/p&gt;

&lt;p&gt;From my perspective, the transactional nature of e-commerce and buyers' intent as reflected in search terms via AI chat are enough to spur this agentic technology forward.&lt;/p&gt;

&lt;p&gt;How UI elements are built in an agentic commerce flow is going to be particularly important as the conversion rate depends on well-defined and contextual components.&lt;/p&gt;

&lt;p&gt;Building UI in this system requires a reframing of how users transact. No longer will there be a branded storefront surrounding the checkout process; instead, there will be micro elements that will need to be more direct and clear than ever before.&lt;/p&gt;

&lt;p&gt;The agent owns the checkout flow end-to-end. It surfaces options, captures payment details and keeps buyers in the loop. For us developers, this alone requires a rethink of the UI for a buyer/seller model.&lt;/p&gt;

&lt;h2&gt;
  
  
  Security Concerns
&lt;/h2&gt;

&lt;p&gt;By integrating with an MCP provider like Shopify, many of the typical security considerations are offloaded to a third party. This doesn't mean there aren't any to consider, but compared to something like &lt;a href="https://www.bitsight.com/blog/openclaw-ai-security-risks-exposed-instances?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;Clawbot&lt;/a&gt;, which notoriously gives free rein to an agent in your OS - developing with MCP UI seems like an agentic area where one doesn't need to worry nearly as much about a brittle unsecure ecosystem.&lt;/p&gt;

&lt;p&gt;It's also completely feasible that I'm wrong here, and this wave of MCP UI comes with an onslaught of dependencies with critical vulnerabilities.&lt;/p&gt;

&lt;h2&gt;
  
  
  Powering up the widget
&lt;/h2&gt;

&lt;p&gt;Nothing is certain in this ever-changing space, but I'm starting to hedge my bets on the MCP UI/Agentic Commerce being the future. Imagine bringing the complex logic of a web application into a widget chat. It flips the conventional client-server narrative on its head. Because now we have a client, a sever and an agent in the flow. Although adding another point of failure comes with its own set of problems, I'm sure they will pan out as this technology expands.&lt;/p&gt;

&lt;p&gt;Listen, a lot of my career has been frontend dominant, so I have a natural bias towards a new wave of frontend problems to solve. But if this truly is how we will provide UI for users going forward, we have to adapt to this user experience. It's a narrower focus for sure, but the problems we will be solving have the potential to be interesting, complex and industry-specific (e.g., e-commerce).&lt;/p&gt;

</description>
      <category>shopify</category>
      <category>mcp</category>
      <category>mcpui</category>
      <category>typescript</category>
    </item>
    <item>
      <title>https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm</title>
      <dc:creator>Gareth Dunne</dc:creator>
      <pubDate>Sun, 29 Mar 2026 14:39:58 +0000</pubDate>
      <link>https://forem.com/dunne_dev/httpsdevtodunnedevwhy-im-pivoting-to-security-as-a-frontend-engineer-4nkm-5if</link>
      <guid>https://forem.com/dunne_dev/httpsdevtodunnedevwhy-im-pivoting-to-security-as-a-frontend-engineer-4nkm-5if</guid>
      <description>&lt;div class="ltag__link--embedded"&gt;
  &lt;div class="crayons-story "&gt;
  &lt;a href="https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm" class="crayons-story__hidden-navigation-link"&gt;Why I'm pivoting to security as a Frontend Engineer.&lt;/a&gt;


  &lt;div class="crayons-story__body crayons-story__body-full_post"&gt;
    &lt;div class="crayons-story__top"&gt;
      &lt;div class="crayons-story__meta"&gt;
        &lt;div class="crayons-story__author-pic"&gt;

          &lt;a href="/dunne_dev" class="crayons-avatar  crayons-avatar--l  "&gt;
            &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3849373%2F7e6915c6-fd5a-4fd0-811b-37bcf5e8ac6d.png" alt="dunne_dev profile" class="crayons-avatar__image" width="576" height="576"&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;div&gt;
          &lt;div&gt;
            &lt;a href="/dunne_dev" class="crayons-story__secondary fw-medium m:hidden"&gt;
              Gareth Dunne
            &lt;/a&gt;
            &lt;div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"&gt;
              
                Gareth Dunne
                
              
              &lt;div id="story-author-preview-content-3425377" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0"&gt;
                &lt;div class="gap-4 grid"&gt;
                  &lt;div class="-mt-4"&gt;
                    &lt;a href="/dunne_dev" class="flex"&gt;
                      &lt;span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"&gt;
                        &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3849373%2F7e6915c6-fd5a-4fd0-811b-37bcf5e8ac6d.png" class="crayons-avatar__image" alt="" width="576" height="576"&gt;
                      &lt;/span&gt;
                      &lt;span class="crayons-link crayons-subtitle-2 mt-5"&gt;Gareth Dunne&lt;/span&gt;
                    &lt;/a&gt;
                  &lt;/div&gt;
                  &lt;div class="print-hidden"&gt;
                    
                      Follow
                    
                  &lt;/div&gt;
                  &lt;div class="author-preview-metadata-container"&gt;&lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;

          &lt;/div&gt;
          &lt;a href="https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm" class="crayons-story__tertiary fs-xs"&gt;&lt;time&gt;Mar 29&lt;/time&gt;&lt;span class="time-ago-indicator-initial-placeholder"&gt;&lt;/span&gt;&lt;/a&gt;
        &lt;/div&gt;
      &lt;/div&gt;

    &lt;/div&gt;

    &lt;div class="crayons-story__indention"&gt;
      &lt;h2 class="crayons-story__title crayons-story__title-full_post"&gt;
        &lt;a href="https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm" id="article-link-3425377"&gt;
          Why I'm pivoting to security as a Frontend Engineer.
        &lt;/a&gt;
      &lt;/h2&gt;
        &lt;div class="crayons-story__tags"&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/newsletter"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;newsletter&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/frontend"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;frontend&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/security"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;security&lt;/a&gt;
        &lt;/div&gt;
      &lt;div class="crayons-story__bottom"&gt;
        &lt;div class="crayons-story__details"&gt;
            &lt;a href="https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center"&gt;
              Comments


              &lt;span class="hidden s:inline"&gt;Add Comment&lt;/span&gt;
            &lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="crayons-story__save"&gt;
          &lt;small class="crayons-story__tertiary fs-xs mr-2"&gt;
            5 min read
          &lt;/small&gt;
            
              &lt;span class="bm-initial"&gt;
                

              &lt;/span&gt;
              &lt;span class="bm-success"&gt;
                

              &lt;/span&gt;
            
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;

&lt;/div&gt;


</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>security</category>
      <category>career</category>
    </item>
    <item>
      <title>Why I'm pivoting to security as a frontend engineer.

https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm</title>
      <dc:creator>Gareth Dunne</dc:creator>
      <pubDate>Sun, 29 Mar 2026 14:37:28 +0000</pubDate>
      <link>https://forem.com/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-2bai</link>
      <guid>https://forem.com/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-2bai</guid>
      <description>&lt;div class="ltag__link--embedded"&gt;
  &lt;div class="crayons-story "&gt;
  &lt;a href="https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm" class="crayons-story__hidden-navigation-link"&gt;Why I'm pivoting to security as a Frontend Engineer.&lt;/a&gt;


  &lt;div class="crayons-story__body crayons-story__body-full_post"&gt;
    &lt;div class="crayons-story__top"&gt;
      &lt;div class="crayons-story__meta"&gt;
        &lt;div class="crayons-story__author-pic"&gt;

          &lt;a href="/dunne_dev" class="crayons-avatar  crayons-avatar--l  "&gt;
            &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3849373%2F7e6915c6-fd5a-4fd0-811b-37bcf5e8ac6d.png" alt="dunne_dev profile" class="crayons-avatar__image" width="576" height="576"&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;div&gt;
          &lt;div&gt;
            &lt;a href="/dunne_dev" class="crayons-story__secondary fw-medium m:hidden"&gt;
              Gareth Dunne
            &lt;/a&gt;
            &lt;div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"&gt;
              
                Gareth Dunne
                
              
              &lt;div id="story-author-preview-content-3425377" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0"&gt;
                &lt;div class="gap-4 grid"&gt;
                  &lt;div class="-mt-4"&gt;
                    &lt;a href="/dunne_dev" class="flex"&gt;
                      &lt;span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"&gt;
                        &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3849373%2F7e6915c6-fd5a-4fd0-811b-37bcf5e8ac6d.png" class="crayons-avatar__image" alt="" width="576" height="576"&gt;
                      &lt;/span&gt;
                      &lt;span class="crayons-link crayons-subtitle-2 mt-5"&gt;Gareth Dunne&lt;/span&gt;
                    &lt;/a&gt;
                  &lt;/div&gt;
                  &lt;div class="print-hidden"&gt;
                    
                      Follow
                    
                  &lt;/div&gt;
                  &lt;div class="author-preview-metadata-container"&gt;&lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;

          &lt;/div&gt;
          &lt;a href="https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm" class="crayons-story__tertiary fs-xs"&gt;&lt;time&gt;Mar 29&lt;/time&gt;&lt;span class="time-ago-indicator-initial-placeholder"&gt;&lt;/span&gt;&lt;/a&gt;
        &lt;/div&gt;
      &lt;/div&gt;

    &lt;/div&gt;

    &lt;div class="crayons-story__indention"&gt;
      &lt;h2 class="crayons-story__title crayons-story__title-full_post"&gt;
        &lt;a href="https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm" id="article-link-3425377"&gt;
          Why I'm pivoting to security as a Frontend Engineer.
        &lt;/a&gt;
      &lt;/h2&gt;
        &lt;div class="crayons-story__tags"&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/newsletter"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;newsletter&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/frontend"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;frontend&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/security"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;security&lt;/a&gt;
        &lt;/div&gt;
      &lt;div class="crayons-story__bottom"&gt;
        &lt;div class="crayons-story__details"&gt;
            &lt;a href="https://dev.to/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center"&gt;
              Comments


              &lt;span class="hidden s:inline"&gt;Add Comment&lt;/span&gt;
            &lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="crayons-story__save"&gt;
          &lt;small class="crayons-story__tertiary fs-xs mr-2"&gt;
            5 min read
          &lt;/small&gt;
            
              &lt;span class="bm-initial"&gt;
                

              &lt;/span&gt;
              &lt;span class="bm-success"&gt;
                

              &lt;/span&gt;
            
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;

&lt;/div&gt;


</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>career</category>
      <category>security</category>
    </item>
    <item>
      <title>Why I'm pivoting to security as a Frontend Engineer.</title>
      <dc:creator>Gareth Dunne</dc:creator>
      <pubDate>Mon, 02 Mar 2026 15:26:00 +0000</pubDate>
      <link>https://forem.com/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm</link>
      <guid>https://forem.com/dunne_dev/why-im-pivoting-to-security-as-a-frontend-engineer-4nkm</guid>
      <description>&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fp0r77e1z7cgj3bwxuzsy.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fp0r77e1z7cgj3bwxuzsy.jpg" alt="Why I'm pivoting to security as a Frontend Engineer." width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Security from a Frontend perspective
&lt;/h2&gt;

&lt;p&gt;I’ve been lucky to work as a software engineer for past decade. For those first 5 years, I’ve focused primary on the frontend. I’ve leaned into full stack in recently but I still primarily view things through a frontend lens.&lt;/p&gt;

&lt;p&gt;With doom and gloom consuming a lot of the frontend space (a recent &lt;a href="https://www.businessinsider.com/tailwind-engineer-layoffs-ai-github-2026-1?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;Tailwind story&lt;/a&gt; comes to mind!) - I’ve had to reassess what aspects of the role are worth doubling down on.&lt;/p&gt;

&lt;p&gt;Thankfully, I’ve been exposed to a lot of the security space in my full time job (Cloudsmith). Tracking the lifecycle of our precious NPM dependencies has really opened my eyes to how vulnerable libraries in our projects truly are.&lt;/p&gt;

&lt;p&gt;With that in mind, I want to go over why I’m pivoting to a more security focused view of the frontend role and why I think it’s beneficial to frontend developers career.&lt;/p&gt;

&lt;h3&gt;
  
  
  Why this, why now?
&lt;/h3&gt;

&lt;p&gt;When I talk about security in the frontend, I’m not exactly talking about cross-site scripting (XSS), session hijacking, unsantized inputs etc. While these are important security fundamentals, security issues are cropping up more generally in a frontend developers workflow.&lt;/p&gt;

&lt;p&gt;This could be in:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;NPM packages we pull in&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Visual studio code extensions we install&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;CI/CD deployment flows we use&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;AI and flavor of the month agentic tools that we use&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That list is only a snapshot of vulnerable areas. In a way, it feels like the walls are closing in on us in relation to attack vectors across the whole lifecycle of frontend code.&lt;/p&gt;

&lt;p&gt;I want to zone in on a couple of specific incidents that should really highlight how close to home security incidents are becoming for the frontend.&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;Critical Security Vulnerability in React Server Components&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fimages.unsplash.com%2Fphoto-1633356122544-f134324a6cee%3Fcrop%3Dentropy%26cs%3Dtinysrgb%26fit%3Dmax%26fm%3Djpg%26ixid%3DM3wzMDAzMzh8MHwxfHNlYXJjaHwyfHxyZWFjdHxlbnwwfHx8fDE3Njk3ODUwNDZ8MA%26ixlib%3Drb-4.1.0%26q%3D80%26w%3D1080" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fimages.unsplash.com%2Fphoto-1633356122544-f134324a6cee%3Fcrop%3Dentropy%26cs%3Dtinysrgb%26fit%3Dmax%26fm%3Djpg%26ixid%3DM3wzMDAzMzh8MHwxfHNlYXJjaHwyfHxyZWFjdHxlbnwwfHx8fDE3Njk3ODUwNDZ8MA%26ixlib%3Drb-4.1.0%26q%3D80%26w%3D1080" alt="Why I'm pivoting to security as a Frontend Engineer." width="1080" height="720"&gt;&lt;/a&gt;&lt;br&gt;
&lt;em&gt;Photo by Lautaro Andreani on Unsplash&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;This incident was perhaps unavoidable for any modern FE developer. We most likely all deal with the server app pattern in our projects - whether that’s in Nextjs or otherwise.&lt;/p&gt;

&lt;p&gt;The ability to call a server function from the client is a novel piece of functionality, however, if a potential attacker is unauthenticated, they were still able to achieve remote code execution - which is exactly what happened &lt;a href="https://react.dev/blog/2025/12/03/critical-security-vulnerability-in-react-server-components?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;here&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;The knock on effect to other frameworks increased the likelihood of your project being affected.&lt;/p&gt;

&lt;p&gt;These included:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Nextjs&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;React Router&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;React Native&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The industry pivot towards the &lt;a href="https://nextjs.org/docs/app?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;app router pattern&lt;/a&gt; increased the complexity of the frontend domain but it also widened the surface area of frontend vulnerabilities. It’s something I’ve taken for granted with new innovations in our space.&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;NPM supply chain attack (&lt;/strong&gt;&lt;a href="https://www.cisa.gov/news-events/alerts/2025/09/23/widespread-supply-chain-compromise-impacting-npm-ecosystem?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;Shai-Hulud&lt;/a&gt;)
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fimages.unsplash.com%2Fphoto-1543966888-7c1dc482a810%3Fcrop%3Dentropy%26cs%3Dtinysrgb%26fit%3Dmax%26fm%3Djpg%26ixid%3DM3wzMDAzMzh8MHwxfHNlYXJjaHwxfHxucG18ZW58MHx8fHwxNzY5Nzg1MDI3fDA%26ixlib%3Drb-4.1.0%26q%3D80%26w%3D1080" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fimages.unsplash.com%2Fphoto-1543966888-7c1dc482a810%3Fcrop%3Dentropy%26cs%3Dtinysrgb%26fit%3Dmax%26fm%3Djpg%26ixid%3DM3wzMDAzMzh8MHwxfHNlYXJjaHwxfHxucG18ZW58MHx8fHwxNzY5Nzg1MDI3fDA%26ixlib%3Drb-4.1.0%26q%3D80%26w%3D1080" alt="Why I'm pivoting to security as a Frontend Engineer." width="1080" height="692"&gt;&lt;/a&gt;&lt;br&gt;
&lt;em&gt;Photo by Paul Esch-Laurent on Unsplash&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Perhaps the most significant &lt;a href="https://www.cisa.gov/news-events/alerts/2025/09/23/widespread-supply-chain-compromise-impacting-npm-ecosystem?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;NPM attack in years&lt;/a&gt;, the Shai-Hulud malware attack really made the world take notice.&lt;/p&gt;

&lt;p&gt;Essentially, billions of weekly downloads on NPM were at risk because of a malware injection due to a compromised NPM author due to a successful phishing email.&lt;/p&gt;

&lt;p&gt;This was such a wide surface area that it should have been absolutely catastrophic, however, the malware targeted crypto wallets and didn’t seem to come away with a massive haul.&lt;/p&gt;

&lt;p&gt;Regardless, this left a lot of organization and developers reflect on what dependencies are being pulled into their projects and why.&lt;/p&gt;

&lt;p&gt;But take a look at some of these dependencies that were affected:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;code&gt;chalk@5.6.1&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;&lt;code&gt;debug@4.4.2&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;&lt;code&gt;ansi-styles@6.2.2&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;As a frontend developer, these names should seem familiar as they commonly feature in the &lt;strong&gt;package.json&lt;/strong&gt; files of many project.&lt;/p&gt;

&lt;p&gt;But they don’t have to be just referenced there, one of your dependencies could just reference any of the above packages as their sub dependencies and your project would be at risk.&lt;/p&gt;

&lt;p&gt;This is when it started to unravel for me the endless loop of dependencies pulling sub dependencies really affects a developer’s visibility.&lt;/p&gt;

&lt;p&gt;Unfortunately, this was only phase one of the Shai-Hulud wave of attacks. I will cover the subsequent waves in later posts as they were even more sophisticated with a wider impact (&lt;a href="https://www.paloaltonetworks.com/blog/cloud-security/shai-hulud-2-0-npm-worm-detection-blocking/?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;Shai-Hulud 2.0&lt;/a&gt;).&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;Visual Studio Code Compromises&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fimages.unsplash.com%2Fphoto-1649180564403-db28d5673f48%3Fcrop%3Dentropy%26cs%3Dtinysrgb%26fit%3Dmax%26fm%3Djpg%26ixid%3DM3wzMDAzMzh8MHwxfHNlYXJjaHwxfHx2aXN1YWwlMjBzdHVkaW98ZW58MHx8fHwxNzY5Nzg0OTk3fDA%26ixlib%3Drb-4.1.0%26q%3D80%26w%3D1080" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fimages.unsplash.com%2Fphoto-1649180564403-db28d5673f48%3Fcrop%3Dentropy%26cs%3Dtinysrgb%26fit%3Dmax%26fm%3Djpg%26ixid%3DM3wzMDAzMzh8MHwxfHNlYXJjaHwxfHx2aXN1YWwlMjBzdHVkaW98ZW58MHx8fHwxNzY5Nzg0OTk3fDA%26ixlib%3Drb-4.1.0%26q%3D80%26w%3D1080" alt="Why I'm pivoting to security as a Frontend Engineer." width="1080" height="727"&gt;&lt;/a&gt;&lt;br&gt;
&lt;em&gt;Photo by Rubaitul Azad on Unsplash&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;I’m also concerned that threat actors are weaponizing the Visual Studio Code (VSC) extension ecosystem.&lt;/p&gt;

&lt;p&gt;This is especially egregious as malware has been published via the ESlint Prettier &lt;a href="https://snyk.io/blog/maintainers-of-eslint-prettier-plugin-attacked-via-npm-supply-chain-malware/?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;config linting extension&lt;/a&gt;, which incredibly common to be installed within a dev’s workspace.&lt;/p&gt;

&lt;p&gt;And there seems to be a playbook for malicious actors to create fake &lt;a href="https://visualstudiomagazine.com/articles/2025/12/08/threat-actors-keep-weaponizing-vs-code-extensions.aspx?ref=frontendfirewall.com" rel="noopener noreferrer"&gt;Prettier extensions&lt;/a&gt; as another entry point for vulnerabilities.&lt;/p&gt;

&lt;p&gt;Many developers (including myself at times) would rarely give second thought to installing a VSC extension. The assumption being that the marketplace is curated and there is good quality control. But assumptions like these create the right environment for these incidents to happen.&lt;/p&gt;

&lt;p&gt;It’s why I want to learn more about preventive measures and best practices, especially as it relates to frontend tools and deployments.&lt;/p&gt;

&lt;p&gt;There has been such a wide ecosystem being created by NPM and with it, so many dependencies being pulled into our frontend projects. A more critical eye is required to avoid security headaches.&lt;/p&gt;

&lt;p&gt;I will be leaning into the security side of the frontend, but will continue to cover other interesting topics too. If that interests you, please follow me at &lt;a href="https://www.frontendfirewall.com/why-im-pivoting-to-security-as-a/" rel="noopener noreferrer"&gt;Frontend Firewall&lt;/a&gt; for more!&lt;/p&gt;




</description>
      <category>newsletter</category>
      <category>frontend</category>
      <category>security</category>
    </item>
  </channel>
</rss>
