TIL 2021.7.8 : 프레임워크와 라이브러리의 차이는?

SPA를 만드는 프론트엔드 엔지니어라면 기본 상식으로
리액트는 UI 라이브러리, Vue랑 Angular는 프레임워크이자 템플릿언어라는걸 압니다.
근데 이거 라이브러리랑 프레임워크가 어떻게 다른지 구별 가능한가요?
구별해봅시다.

1. 라이브러리

응용프로그램 개발을 위해 필요한 기능들을 모아 놓은 소프트웨어
공통으로 사용될 수 있는 특정한 기능들을 모듈화 한 것
프로그래머가 개발하는데 필요한 것들을 모아둔 것.

1. 특정기능들을 미리 만들어 두고 여러 소프트웨어에서 import해서 쓸 수 있게 한 것들의 모음.

2. 자신이 직접 라이브러리를 만들 수도 있고, 남들이 만든 라이브러리를 가져다가 쓸 수도 있다.

3. 필요한 곳에 쓰기 위해서 '미리' 만들어 놓은 기능들의 집합

4. 작은 기능들을 함수 단위로 만들어서 제공

5. 기능 사용법은 사용자가 결정 = 사용자가 코드를 제어한다 = 사용자가 라이브러리를 부른다.

6. 리액트 = UI를 만들기 위한 자바스크립트 라이브러리

7. 리액트 코드 첫줄이 바로 아래와 같이 import로 시작하니, 리액트는 빼박 라이브러리다.

import React from 'react'

 

2. 프레임워크

소프트웨어의 특정 문제를 해결하기 위해서 상호협력하는 클래스와 인터페이스의 집합
소프트웨어 개발을 위한 개발 환경, 토대, 기반시설을 제공하는 것.
응용프로그램이나 소프트웨어의 솔루션 개발을 수월하게 하기 위해서 제공된 소프트웨어 환경.

1. 개발에 필수적인 코드, 알고리즘, 데이터베이스 연동 기능들을 위한 '뼈대'를 제공

2. 이런 뼈대 위에서 프로그래머가 코드를 작성해 제품을 완성해야 함

3. 프레임워크는 전체적인 규칙을 제공하며, 프로그래머는 그 규칙을 따라가면서 개발해야 한다.

4. 기능 사용법은 프레임워크가 결정 = 프레임워크가 코드를 제어한다

5. 아래의 로고들이 가리키는 것들은 모두 프레임워크다.

 

3. 라이브러리 vs 프레임워크

말보다는 먼저 그림으로 이해해보자!

짤방 출처 : 유튜버 얇팍한 코딩 사전의 MVC 웹 프레임워크가 뭔가요?

라이브러리는 '가져다 쓰는 것' 

프레임워크는 기본틀에 살을 붙여서 만들어가는 것

얇코님의 설명을 요약하면,

라이브러리 = 재료는 내가 알아서 취사선택해서 개발한다 = 사용자 마음대로 한다.
프레임워크 = 주어진 틀에 맞춰서 개발한다 = 사용자 맘대로 안되고 틀의 규칙대로 해야한다.

그러니 라이브러리와 프레임워크는 사용자의 자유도 여부에 차이가 있다.

 

그리고 또다른 큰 차이점이자 핵심 차이점은 다음 그림으로 설명하겠다.

이미지 출처 : https://daheenallwhite.github.io/programming/2019/07/15/library-framework-api/

왼쪽이 라이브러리, 오른쪽이 프레임워크

라이브러리는 라이브러리가 없어도 프로그램이 동작하지만, 프레임워크에서는 프레임워크가 없이는 프로그램이 동작하지 않는다. 왜냐면 프레임워크는 소프트웨어가 개발되고 동작하는 기반 시설의 역할을 하므로, 프레임워크가 없이는 프로그램이 동작할 수 없다. 반면 라이브러리는 특정 기능을 미리 만들어두고 필요한 경우 호출해서 쓰는 것인데, 소프트웨어 내부에 같은 기능을 구현한 코드가 있다면 굳이 라이브러리를 호출하지 않아도 프로그램이 동작한다. 

 

이미지 출처 : https://daheenallwhite.github.io/programming/2019/07/15/library-framework-api/

위 개념도처럼 코드의 관계에도 차이가 있다. 프레임워크는 기반 요소이므로 그 안의 코드를 프레임워크가 불러서 실행된다. 반면 라이브러리는 프로그래머가 짠 코드가 라이브러리를 필요시 호출해서(import) 사용한다.

프레임워크 : 프레임워크가 코드를 호출, 라이브러리 : 코드가 라이브러리를 호출

 

참고 사이트

유튜버 얇팍한 코딩 사전의 MVC 웹 프레임워크가 뭔가요?

https://velog.io/@tjdud0123/API-vs-%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC-vs-%ED%94%84%EB%A0%88%EC%9E%84%EC%9B%8C%ED%81%AC

API vs 라이브러리 vs 프레임워크

https://mangkyu.tistory.com/4

프레임워크와 라이브러리의 차이점

https://daheenallwhite.github.io/programming/2019/07/15/library-framework-api/

용어 정리 - Framework, Library, API