"프레임워크 vs 라이브러리 차이"(개념, 경험, 비교, 장단점)

개발을 처음 시작했을 때 가장 혼란스러운 개념 중 하나가 바로 ‘프레임워크’와 ‘라이브러리’의 차이다. 둘 다 외부 도구이면서 코드를 도와주는 도구이긴 한데, 도대체 뭐가 어떻게 다른 건지 혼란스러운 경우가 많다. 게다가 React는 라이브러리라면서 왜 프레임워크처럼 쓰는 걸까? Express는 프레임워크라는데 왜 그렇게 자유롭지? 이 글에서는 단순한 이론적 정의가 아닌, 실제 개발자의 시각에서 두 개념을 비교하고, 코드 예시와 함께 실전에서 어떻게 체감되는지 설명한다.

프레임워크와 라이브러리의 기본 개념

프레임워크는 건물의 뼈대, 라이브러리는 자재라고 말할 수 있다. 프레임워크는 애플리케이션의 구조와 흐름을 결정한다. 즉, 프레임워크를 사용하면 그 틀 안에서 코드를 작성해야 한다. 반면, 라이브러리는 특정 기능을 수행하는 코드 묶음으로, 내가 직접 필요한 기능을 골라서 호출한다. 주도권의 차이가 핵심이다.

프레임워크: 사용자가 프레임워크의 규칙과 흐름에 맞춰 개발함. 예: Angular, Django, Spring
라이브러리: 사용자가 필요할 때 가져다 쓰는 기능 모음. 예: React, Lodash, jQuery

즉, 프레임워크는 내가 ‘호출당하는’ 입장이고, 라이브러리는 내가 ‘호출하는’ 입장이다. 이를 Hollywood Principle이라고 부르기도 한다. “Don’t call us, we’ll call you.”

사례 중심으로 보는 실제 사용 경험

이론은 이해했지만, 실무에서는 어떻게 다르게 느껴질까? 예를 들어 React는 라이브러리이지만, 실제 프로젝트에서 React-Router, Redux, Vite, ESLint, Prettier 등 온갖 툴이 결합되면서 일종의 ‘React 생태계 프레임워크’처럼 작동한다. 즉, 프레임워크인지 라이브러리인지는 기술 자체보다도 ‘어떻게 쓰느냐’가 더 중요하다.

반대로 Vue.js는 처음에는 프레임워크에 가깝지만, 사용자의 선택에 따라 간단한 라이브러리처럼도 사용할 수 있다. 예를 들어 다음과 같이 Vue를 CDN으로 불러와 간단한 템플릿 렌더링만 할 수도 있다.

<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<div id="app">{{ message }}</div>
<script>
new Vue({
  el: '#app',
  data: { message: 'Hello Vue!' }
});
</script>

이처럼 개발자는 특정 기술을 어떻게 조합하고 활용하느냐에 따라 그것을 프레임워크처럼 쓸 수도, 라이브러리처럼 쓸 수도 있다. Express도 마찬가지다. Express는 Node.js의 대표적인 웹 프레임워크지만, 최소한의 구조만 제공하고 나머지 흐름은 개발자에게 맡긴다. 그래서 처음 접하면 라이브러리처럼 느껴지기도 한다.

코드 구조와 주도권 비교: 실전 코드 예시

프레임워크와 라이브러리의 차이는 코드 구조에서도 명확히 드러난다. 아래는 프레임워크(Spring Boot)와 라이브러리(React)의 구조 차이를 비교한 예시다.

Spring Boot (프레임워크)

// Application.java
@SpringBootApplication
public class Application {
  public static void main(String[] args) {
    SpringApplication.run(Application.class, args);
  }
}

// UserController.java
@RestController
@RequestMapping("/users")
public class UserController {
  @GetMapping
  public List<User> getUsers() {
    return userService.getAllUsers();
  }
}

Spring Boot에서는 프로젝트의 시작점, 라우팅 방식, 디렉터리 구조, 의존성 관리까지 프레임워크가 정해놓은 방식대로 따라야 한다. 개발자는 그 틀 안에서 동작을 구현하는 역할을 한다.

React (라이브러리)

// App.jsx
import React from 'react';
import UserList from './UserList';

function App() {
  return (
    <div>
      <h1>사용자 목록</h1>
      <UserList />
    </div>
  );
}

export default App;

React는 UI를 그리기 위한 ‘도구’일 뿐이다. 프로젝트 구조, 상태 관리, 데이터 처리 방식은 모두 개발자가 선택한다. 라우터를 쓸지, 상태 관리를 어떤 방식으로 할지는 전적으로 사용자의 몫이다. 이 점이 프레임워크와 명확히 구분되는 부분이다.

개발자 입장에서의 장단점 비교

프레임워크와 라이브러리는 각기 다른 장단점이 있다. 개발자의 성향, 팀 규모, 프로젝트의 요구사항에 따라 선택 기준은 달라진다.

프레임워크 장점

구조와 규칙이 있어 빠른 팀 온보딩 가능
기능이 내장되어 있어 생산성이 높음
대규모 프로젝트에 적합

프레임워크 단점

학습 곡선이 존재
프레임워크에 종속되기 쉬움
유연성 부족

라이브러리 장점

유연한 조합 가능
필요한 부분만 선택적으로 사용 가능
작은 프로젝트에 적합

라이브러리 단점

구조를 직접 설계해야 하므로 경험이 필요
기능이 많아지면 프로젝트가 복잡해질 수 있음
기술 스택 관리가 어려울 수 있음

결론: 프레임워크 vs 라이브러리, 중요한 건 ‘사용자’

프레임워크와 라이브러리는 명확히 구분되지만, 실무에서는 그 경계가 흐려지는 경우가 많다. 중요한 것은 ‘기술이 무엇이냐’보다 ‘내가 그것을 어떻게 활용하느냐’이다. 프레임워크는 규칙을 주고 라이브러리는 자유를 준다. 초보자에게는 프레임워크가 안전할 수 있고, 숙련자에게는 라이브러리가 더 강력할 수 있다.

두 개념을 마치 흑백처럼 나눌 필요는 없다. 오히려 실전에서는 두 접근을 유연하게 결합하는 능력이 중요하다. 그리고 그 출발점은 단순한 기능 숙지가 아니라 ‘철학의 이해’에 있다. 도구를 쓰는 사람은 많지만, 도구를 이해하는 사람은 많지 않다. 오늘부터는 단지 사용하는 것을 넘어서, 그것이 왜 그렇게 작동하는지를 고민해보자. 그게 바로 진짜 개발자의 길이다.

유라's 힐링 타임 즐기기