프레임워크란?
라이브러리와의 차이·종류와 선택법
앱의 구조와 실행 흐름을 정해 반복 설정을 줄이는 개발 기반입니다.
프레임워크은 무엇인가요?
프레임워크는 애플리케이션의 실행 흐름과 파일 구조, 확장 방법을 미리 정해 둔 개발 기반입니다. 반복되는 설정을 줄이는 대신 정해진 규칙을 따라야 합니다.
라이브러리는 필요한 순간 코드가 호출하는 도구에 가깝고, 프레임워크는 전체 실행 흐름 안에서 작성한 코드를 호출한다는 차이가 있습니다.
먼저 이해할 핵심 개념
도구 이름보다 각 요소가 맡는 책임과 서로 연결되는 방식을 먼저 이해하는 것이 좋습니다.
규약
라우팅과 파일 위치처럼 팀이 반복해서 결정할 항목을 기본값으로 제공합니다.
렌더링
CSR, SSR, SSG와 스트리밍 중 화면을 언제 어디서 만들지 정합니다.
데이터 경계
서버와 클라이언트 코드가 실행되는 위치와 전달 가능한 값을 구분합니다.
확장과 탈출구
플러그인과 설정만으로 해결되지 않을 때 얼마나 유연하게 벗어날 수 있는지 봅니다.
실무에서 함께 쓰는 기술
한 제품을 완성할 때는 한 가지 도구가 아니라 역할이 다른 여러 기술을 조합합니다.
React 기반
Next.js·Remix·Gatsby
Vue 기반
Nuxt·Quasar
Svelte 기반
SvelteKit
콘텐츠·서버 우선
Astro·Eleventy·Hugo
실무에서는 이렇게 진행합니다
- 01
요구사항 분류
콘텐츠, 상호작용, 인증과 서버 기능의 비중을 나눕니다.
- 02
렌더링 선택
검색 노출과 개인화 범위에 맞는 렌더링 방식을 고릅니다.
- 03
작은 검증
핵심 라우트 하나로 데이터 로딩과 배포 환경을 시험합니다.
- 04
운영 규칙
업데이트, 캐시, 오류 처리와 폴더 경계를 문서화합니다.
선택하고 구현할 때 확인할 것
- 01팀이 해당 기반 기술을 유지할 수 있는가
- 02필요한 렌더링과 배포 방식을 지원하는가
- 03인증과 데이터 처리를 어디에 둘지 명확한가
- 04업데이트와 마이그레이션 비용을 감당할 수 있는가
- 05생태계 규모보다 실제 요구사항에 맞는가
자주 묻는 질문
React는 프레임워크인가요?
React 공식 문서는 React를 UI 라이브러리로 설명합니다. 라우팅과 서버 렌더링까지 포함하려면 Next.js 같은 프레임워크를 함께 선택할 수 있습니다.
프레임워크를 쓰면 성능이 자동으로 좋아지나요?
아닙니다. 좋은 기본값은 제공하지만 데이터 로딩, 번들 크기, 캐시와 이미지 전략을 잘못 구성하면 느려질 수 있습니다.