티스토리 뷰
라이브러리
소프트웨어를 개발할 때 컴퓨터 프로그램이 사용하는 비휘발성 자원의 모임이다.
즉, 특정 기능을 모아둔 코드, 함수들의 집합이며 코드 작성 시 활용 가능한 도구들을 의미한다.
예시
- Node.js에서 npm으로 설치한 모듈
- HTML의 클라이언트 사이드 조작을 단순화하는 JQuery
- 웹에서 사용자 인터페이스 개발에 사용되는 React.js
- Python pip로 설치한 패키지/모듈 (tensorflow, pandas, beautifulsoup 등등)
React가 여태 프레임워크라고 생각하고 있었다.
하지만 리액트 홈페이지에서도 그렇고 프레임워크로 분류되지 않고 라이브러리로 분류된다고 한다.
따라서 React.js 웹 서비스 중에서 사용자 인터페이스 개발을 위해 사용되는 라이브러리이다.
프레임워크
원하느 기능 구현에 집중하여 개발할 수 있도록 일정한 형태와 필요한 기능을 갖추고 있는 골격, 뼈대를 의미한다.
애플리케이션 개발 시 필수적인 코드, 알고리즘, DB 연동과 같은 기능들을 위해 어느 정도 뼈대(구조)를 제공하며 이러한 뼈대 위에서 사용자는 코드를 작성하여 애플리케이션을 개발한다. 앱/서버 등의 구동, 메모리 관리, 이벤트 루프 등의 공통된 부분은 프레임워크가 관리하며, 사용자는 프레임워크가 정해준 방식대로 클래스, 메서드들을 구현하면 된다.
예시
- Java 서버 개발에 사용되는 Spring
- Python 서버 개발에 사용되는 Django, Flask
- 안드로이드 앱 개발에 사용되는 Android
- 아이폰 앱 개발에 사용되는 Cocoa Touch
- 웹 개발에 사용되는 Angular, Vue.js 등
- 자바 기반의 JSP를 위한 프레임워크 Struts
- 루비로 작성된 MVC패턴을 이요하는 Ruby on Rails
- Node.js에서 가장 인기가 많은 Web Framework 인 Express.js
라이브러리 vs 프레임워크
라이브러리를 사용하는 애플리케이션 코드는 애플리케이션 흐름을 직접 제어한다.
단지 동작하는 중에 필요한 기능이 있을때 능동적으로 라이브러리를 사용할 뿐이다.
반면에 프레임워크는 거꾸로 애플리케이션 코드가 프레임워크에 사용된다.
프레임워크에는 분명한 "제어의 역전" 개념이 적용되어 있어야한다.
애플리케이션 코드는 프레임워크가 짜 놓은 틀에서 수동적으로 동작해야 한다.
프레임워크와 라이브러리의 차이점은 "제어 흐름"의 권한이 어디에 있는가이다.
라이브러리를 사용할때 사용자는 애플리케이션 코드의 흐름을 직접 제어해야 한다. 개발 시 필요한 기능이 있을 경우 능동적으로 라이브러리를 호출하여 사용하거나 기존에 구성된 함수나 코드를 가져다 써야 한다.
반면 프레임워크는 애플리케이션의 코드가 프레임워크에 의해 사용된다.
애플리케이션 코드는 프레임워크가 짜 놓은 틀에서 수동적으로 동작하기 때문에 제어의 흐름은 프레임워크가 가지고 있고 사용자가 그 안에 필요한 코드를 작성하게 된다.
여기서 제어의 역전(IoC, Inversion of Control)이란,
어떠한 일을 하도록 만들어진 Framework에 Control 권한을 위임하는 것을 의미하는데,
간단히 말해 프로그램의 제어 흐름 구조가 뒤바뀐 것을 뜻한다.
라이브러리의 경우 애플리케이션의 흐름을 사용자가 직접 제어해야 하지만 프레임워크의 경우 코드를 연결할 수 있는 위치를 제공하고 필요에 따라 사용자가 연결한 코드를 호출하는 제어 흐름 권한을 가지고 있다.
정리
- 라이브러리는 자유롭게 호출하여 사용할 수 있는 함수나 클래스의 집합이며, 개발자가 필요한 부분에서 사용된다.
- 프레임워크는 코드를 작성하는 방법에 대한 구체적인 가이드라인을 제공하여 개발자가 안정적이고 효율적으로 코드를 작성할 수 있도록 도와주는 도구이다.
참고자료
https://substantial-eoraptor-be9.notion.site/4-10-5a6bf94ac8554f65914687ab0ac1904e
'개발공부 > 기술면접 대비' 카테고리의 다른 글
HTTP, HTTPS (0) | 2023.04.13 |
---|---|
[JS] event.target vs event.currentTarget (0) | 2023.04.12 |
[CSS] position, flex (0) | 2023.04.12 |
dependencies & devDependencies(in package.json) (0) | 2023.04.12 |
[JS] call vs apply vs bind (0) | 2023.04.11 |
- Total
- Today
- Yesterday
- getCurrentPosition
- 브라우저 저장소
- new Date()
- classList
- setitem
- removeitem
- 스코프
- Let
- localStorage
- createElement
- const
- console.log
- setinterval
- 깊은복사
- padStart
- 호이스팅
- e.preventDefault()
- useState
- innerText
- Geolocation
- react
- var
- Return
- Navigator
- 교착상태
- 데드락
- getitem
- setTimeout
- Hook
- 얕은복사
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |