Studying/React

리액트 공부하기 - 시작에 앞서서

creamymood 2025. 4. 3. 22:21

큰 개념별 정리 (목차)

 

1. 실행 환경 (런타임)

Node.js → JavaScript를 서버에서 실행할 수 있게 해주는 환경

브라우저(크롬, 사파리 등)에서도 JavaScript를 실행할 수 있지만, Node.js를 사용하면 브라우저 없이 실행 가능

 

2. 패키지 매니저

npm (Node Package Manager) → JavaScript의 패키지(라이브러리)를 관리하는 도구

Node.js를 설치하면 npm도 같이 설치됨

npm install [패키지명]을 사용해서 패키지를 설치할 수 있음

 

3. 패키지 (Package)

npm을 통해 설치할 수 있는 코드 묶음

예시:

react → React 라이브러리를 포함한 패키지

express → Express.js 웹 프레임워크를 포함한 패키지

 

4. 라이브러리 (Library)

특정 기능을 수행하는 코드 모음 (패키지 안에 포함될 수도 있음)

예시:

React → UI를 만들기 위한 라이브러리

Lodash → 자주 쓰이는 유틸리티 함수들을 모아둔 라이브러리

 

5. 프레임워크 (Framework)

라이브러리보다 더 큰 개념으로, 개발에 필요한 기본 구조와 규칙을 제공

예시:

Express.js → Node.js를 위한 웹 프레임워크 (서버 만들 때 사용)

Next.js → React 기반의 프레임워크 (서버 사이드 렌더링 가능)

 

✨ 이 개념들이 어떻게 연결될까?

  1. Node.js 설치 → JavaScript 실행 환경이 생김
  2. npm 사용 → 패키지(라이브러리) 설치 가능
  3. React (라이브러리) 설치 → UI 개발 가능