2. 프레임워크란?

✅ 프레임워크(Framework)란?

프레임워크는 소프트웨어 개발을 쉽게 할 수 있도록 제공되는 뼈대(틀) 또는 구조야.
개발할 때 자주 사용하는 기능(예: 데이터 관리, UI 구성, 라우팅 등)이 미리 만들어져 있어서,
개발자가 필요한 부분만 추가하면 돼.

 

1. Vue가 뭐야? 
2. 프레임워크란?
3. Vue3 기본 문법
4. Vue Router (<router-link>, <router-view>)
5. Pinia (상태 관리 라이브러리)
6. Vue3 Composition API
7. Pinia Store에서 ref와 reactive를 사용하는 방법
8. Pinia에서의 Composition API 스타일과 Options API 스타일

🎯 프레임워크 vs 라이브러리 차이점

구분프레임워크라이브러리

개념	개발의 기본 구조를 제공하고, 개발자가 그 구조 안에서 코드를 작성해야 함	특정 기능을 제공하는 코드 묶음으로, 필요할 때 가져다 씀
예제	Vue.js, React, Angular, Django	Lodash, Axios, jQuery, Moment.js
흐름 제어	프레임워크가 코드 실행 흐름을 제어	개발자가 원하는 곳에서 라이브러리를 호출

👉 쉽게 말하면?
- 프레임워크는 집을 짓기 위한 설계도 같은 거야. 정해진 틀을 따라가면서 개발해야 해.
- 라이브러리는 가구나 공구 같은 거야. 필요한 기능만 가져다 쓰면 돼.

🚀 대표적인 프레임워크 예시

🔹 프론트엔드(Frontend) 프레임워크

• Vue.js → 가볍고 배우기 쉬운 UI 프레임워크
• React → 페이스북이 만든 컴포넌트 기반 라이브러리 (SPA 개발에 강점)
• Angular → 구글이 만든 강력한 프레임워크 (대형 프로젝트에 적합)

🔹 백엔드(Backend) 프레임워크

• Express.js (Node.js 기반) → 간단한 API 서버 개발에 많이 사용
• Django (Python 기반) → 보안이 강하고 빠른 개발 가능
• Spring Boot (Java 기반) → 기업용 웹 애플리케이션 개발에 많이 사용

📌 왜 프레임워크를 사용할까?

✔ 빠른 개발 → 기본적인 기능이 이미 구현되어 있어서 개발 속도가 빨라져.
✔ 일관성 유지 → 팀 프로젝트에서 코드 스타일을 통일할 수 있어.
✔ 유지보수 용이 → 구조가 체계적이라 기능 추가나 수정이 쉬워.
✔ 보안 강화 → 보안 기능이 내장된 경우가 많아(예: Django의 보안 기능).

👉 결론:

프레임워크는 개발을 편하게 해주는 "설계도 + 도구 모음" 같은 거야! 😃
Vue.js도 프론트엔드 개발을 도와주는 대표적인 프레임워크 중 하나야. 🎨🚀

 

이전: 1. Vue가 뭐야?

다음 : 3. Vue3 기본 문법