라이브러리란

라이브러리는 폴더명 파일명 등에 대한 규칙이 없고 프레임워크에 비해 자유롭다

프레임워크란

프레임워크는 폴더명 파일명 등에 대한 규칙이 있고 라이브러리에 비해 엄격하다

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

공통으로 사용될 수 있는 특정한 기능들을 모듈화 해 놓은 것 다른 사람이 써 놓은 코드
즐 라이브러리(library)와 프레임워크(framework)는 모두 소프트웨어 개발에서 코드를 재사용하기 위한 도구이지만, 그 사용 방식과 제공하는 구조가 다름

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

1. 제어의 흐름(Control Flow):

   • 라이브러리: 라이브러리는 개발자가 호출하여 사용하는 코드 모음, 개발자는 필요할 때 라이브러리의 기능을 호출 즉, 개발자가 애플리케이션의 제어를 가지고 있음

   • 프레임워크: 프레임워크는 기본적인 구조와 흐름을 제공
     개발자는 프레임워크가 제공하는 틀 안에서 코드를 작성
     프레임워크가 애플리케이션의 제어를 가지고 있으며, 개발자가 작성한 코드를 호출, 제어의 역전(Inversion of Control)이 발생 함

2. 구조와 규칙:

   • 라이브러리: 라이브러리는 특정 기능을 수행하기 위한 도구나 함수의 모음
     개발자가 자유롭게 사용하고 조합할 수 있으며, 전체적인 애플리케이션 구조에는 영향을 미치지 않음
   • 프레임워크: 프레임워크는 애플리케이션의 구조를 정의 함
     특정한 규칙과 관례를 따라야 하며, 이 구조 내에서 코드를 작성해야 함
     프레임워크는 애플리케이션의 기본 골격을 제공하므로 개발자가 이를 따르는 것이 필수적임

3. 사용 예:

   • 라이브러리: 라이브러리의 대표적인 예로는 jQuery(JavaScript 라이브러리), NumPy(Python 라이브러리), STL(C++ 라이브러리), axios 등이 있음
     이러한 라이브러리는 특정 작업을 단순화하고 반복 코드를 줄이는 데 유용 함
   • 프레임워크: 프레임워크의 대표적인 예로는 Django(Python 웹 프레임워크), Spring(Java 프레임워크) 등이 있음
     이러한 프레임워크는 애플리케이션 개발의 전반적인 구조와 패턴을 제공하며, 대규모 애플리케이션 개발에 적합 함

4. 확장성:

   • 라이브러리: 라이브러리는 보통 특정 기능을 위해 설계되었기 때문에, 다른 기능을 추가하거나 확장하는 것이 제한적일 수 있음
   • 프레임워크: 프레임워크는 확장성을 염두에 두고 설계된 경우가 많아, 다양한 플러그인이나 모듈을 통해 기능을 확장할 수 있음

라이브러리와 프레임워크의 사용 예

라이브러리(axios)

axios.get('/user?ID=12345')
.then(function (response) {
// handle success
console.log(response);
})
.catch(function (error) {
// handle error
console.log(error);
})
.then(function () {
// always executed
});

HTTP 요청을 하고 그 응답을 받아야 하는 경우 라이브러리를 사용하여 쉽게 기능 구현 가능 함

프레임워크(vue.js)

<script>
	export default {
		data() {
			return {
				count: 0
			}
		}
	}
</script>
<template>
	<button @click="count++">Count is: {{ count }}</button>
</template>
<style scoped>
	button {
		font-weight: bold;
	}
</style>

프레임워크는 라이브러리보단 좀 더 엄격하며 라이브러리보다는 더 많은 기능을 제공함
앞의 코드를 보면 count라는 변수를 ++하기 위해서는 date(){ 메서드 안에 변수를 선언해야 한다는 규칙 등이 있음.
또한 style을 보면 scoped라는 것을 통해서 해당 컴포넌트기반에서만 작동되는 style 이라는 것을 정할 수 있음

react가 라이브러리인 이유

1. 많은 내장 기능이 부족하고, 타사 패키지(third-party packages)에 크게 의존
   ex) routing 을 위해 react-router 를 사용해야 하거나 API를 호출하기 위해 Axios나 fetch를 사용해야 함

2. 애플리케이션 개발을 위한 완전한 생태계를 제공하지 않으며, 디자인 시스템도 제공하지 않음 (React 에서는 무언가를 할 수 있는 "올바른" 방법이 없고, 스타일 가이드 또한 없음)
   즉, React를 이용하는 모든 프로젝트가 완전히 다르게 보일 수 있음

따라서 "프레임워크"는 애플리케이션 개발에 필요한 적절한 생태계를 제공하며, 보통 API, 라이브러리, 지원 프로그램, 컴파일러 등등과 함께 제공 되어야 함