DEV Community

Cover image for Stop Letting Third-Party Libraries Hold Your Codebase Hostage
Doogal Simpson
Doogal Simpson

Posted on • Originally published at doogal.dev

Stop Letting Third-Party Libraries Hold Your Codebase Hostage

#java #beginners #webdev #programming

The "DMZ Strategy" for unbreakable architecture.

Modern software development is, to be honest, mostly gluing together other people’s code. We npm install a library for HTTP requests, another for date formatting, and another for UI components. It feels productive. It feels efficient.

But there is a hidden cost to this convenience.

Third-party code is like a houseguest: helpful, maybe even entertaining, but you never give them the keys to every single room in your house.

If you are importing axios, moment, or lodash directly into fifty different files, you have created a architectural vulnerability known as Vendor Lock-in. You have married that library. If they introduce a breaking change, abandon the project, or if a better alternative comes along, you are facing a massive, codebase-wide refactor.

There is a professional way to handle this. It’s called the DMZ (Demilitarized Zone) Strategy.

The Junior Trap: The "Vendor Hug"

The Junior mindset is optimistic. We trust the library authors. We assume axios will always be the best tool for the job. So, we sprinkle direct imports everywhere.

// [The Junior Trap]: The Vendor Hug
// File: UserProfile.js
import axios from 'axios'; // <--- Direct dependency

async function getUser(id) {
  try {
    // We are directly coupled to axios's specific syntax (e.g., .data)
    const response = await axios.get(`/users/${id}`);
    return response.data;
  } catch (error) {
    console.error(error);
  }
}

// File: OrderHistory.js
import axios from 'axios'; // <--- Repeating the dependency

async function getOrders() {
   // If we want to switch to 'fetch' later, we have to edit 
   // this file, UserProfile.js, and 48 others.
   const response = await axios.get('/orders');
   return response.data;
}
Enter fullscreen mode Exit fullscreen mode

The Reality:
When you write code like this, you don't own your application's networking layer—axios does. If you want to add a global authorization header or centralized error logging later, you have to hunt down every single place you imported the library.

The Pro Move: The DMZ Strategy (The Wrapper)

A Professional Junior creates a Demilitarized Zone. We wrap the third-party code in a simple interface that belongs to us.

We create a single file—let’s call it apiClient.js—that acts as the diplomat between our application and the outside world.

The Rule of the DMZ:
Your application logic should never know which library is making the HTTP request. It should only know that a request is being made.

Here is how we take back control:

// [The Pro Move]: The Diplomatic Buffer

// File: src/services/apiClient.js
// This is the ONLY file in the entire project that knows 'axios' exists.
import axios from 'axios';

// We define an interface that WE own.
const apiClient = {
  get: async (url) => {
    try {
      const response = await axios.get(url);
      return response.data; // We normalize the response here
    } catch (error) {
      // We can handle global error logging here
      console.error("API Error:", error.message);
      throw error;
    }
  },

  post: async (url, payload) => {
    const response = await axios.post(url, payload);
    return response.data;
  }
};

export default apiClient;
Enter fullscreen mode Exit fullscreen mode

Now, look at how clean the application code becomes:

// File: UserProfile.js
import api from '../services/apiClient'; // <--- We import OUR tool

async function getUser(id) {
  // logic is clean. We don't care if 'api' uses axios, fetch, or magic.
  const user = await api.get(`/users/${id}`);
  return user;
}
Enter fullscreen mode Exit fullscreen mode

Why This Matters

  1. Future-Proofing: If you want to switch from axios to the native fetch API next year, you only have to rewrite one file (apiClient.js). The rest of your application won't even notice the change.
  2. Centralized Control: Want to add an Auth Token to every request? You add it once in the wrapper. Want to log every 500 error to Sentry? You add it once in the wrapper.
  3. Testing: It is infinitely easier to mock your own apiClient than it is to mock the complex internals of axios or moment.

Stop letting vendors dictate your architecture. Create a buffer. Be the landlord of your own code, not just a tenant.

Stop writing code just to please the compiler.

This article was an excerpt from my handbook, "The Professional Junior: Writing Code that Matters."

It’s not a 400-page textbook. It’s a tactical field guide to unwritten engineering rules.

👉 Get the Full Handbook Here

Top comments (0)