1. 웹페이지 렌더링 방식 CSR, SSR, SSG
🔷 1. CSR (Client-Side Rendering, 클라이언트 사이드 렌더링)
✅ 설명:
- HTML, CSS, JS 등 최소한의 파일만 서버에서 전달하고, 실제 페이지 렌더링은 브라우저(클라이언트)에서 JavaScript로 수행합니다.
- 대표적인 예: React, Vue 같은 SPA(Single Page Application)
✅ 특징:
- 초기 로딩은 느릴 수 있음 (JS 다운로드 + 실행 필요)
- 이후 페이지 전환은 매우 빠름 (서버 요청 없이 JS로 처리)
- SEO(검색 최적화)에 불리 (검색 엔진이 JS 실행 못할 경우)
✅ 흐름:
- 브라우저가 최소 HTML과 JS를 받음
- JS 실행 → 데이터 API 요청 → 렌더링 진행
🔷 2. SSR (Server-Side Rendering, 서버 사이드 렌더링)
✅ 설명:
- 페이지를 서버에서 완전히 렌더링한 후 HTML을 클라이언트로 전송합니다.
- React의 Next.js 등에서 지원
✅ 특징:
- 초기 로딩 속도 빠름 (브라우저가 바로 완성된 HTML 받음)
- SEO에 유리 (서버에서 HTML로 응답하므로 검색엔진이 읽기 쉬움)
- 매 요청마다 서버에서 렌더링 → 서버 부하 가능
✅ 흐름:
- 클라이언트가 요청
- 서버가 HTML 생성
- 클라이언트에 완성된 HTML 전송
🔷 3. SSG (Static Site Generation, 정적 사이트 생성)
✅ 설명:
- 빌드 시점에 페이지를 미리 HTML로 생성해 두고, 요청 시 정적 파일로 서빙합니다.
- 블로그, 문서 사이트 등 변경이 적은 페이지에 적합
- 대표적인 프레임워크: Next.js (getStaticProps), Gatsby
✅ 특징:
- 매우 빠른 응답 속도 (서버에서 처리 없이 정적 HTML 바로 제공)
- 서버 부하 없음
- 데이터 변경 시 다시 빌드 필요
✅ 흐름:
- 빌드할 때 HTML 생성
- 사용자는 정적 HTML을 바로 받아봄
🔸 요약 비교표:
항목CSRSSRSSG
| 렌더링 위치 | 클라이언트 | 서버 | 빌드 시 |
| 초기 속도 | 느림 | 빠름 | 매우 빠름 |
| 페이지 전환 | 빠름 | 느림 (요청마다 렌더링) | 빠름 |
| SEO | 불리 | 유리 | 매우 유리 |
| 서버 부하 | 적음 | 높음 | 없음 |
| 데이터 실시간성 | 높음 | 높음 | 낮음 (빌드 필요) |
2. 관계형 데이터베이스를 사용하는 이유
관계형 데이터베이스 정리
✅ 1. 데이터 구조화가 명확하다
- 데이터를 테이블(표) 형식으로 저장 (행 = 레코드, 열 = 속성)
- 테이블 간 관계(relationship) 정의 가능 (외래 키 등)
- 구조가 명확하므로 이해, 설계, 유지보수가 용이
✅ 2. 정합성과 무결성 보장
- 제약조건 (Constraints) 사용 가능
- 예: NOT NULL, UNIQUE, PRIMARY KEY, FOREIGN KEY
- ACID 특성 제공:
- Atomicity (원자성)
- Consistency (일관성)
- Isolation (고립성)
- Durability (지속성)
- 복잡한 트랜잭션에서도 데이터 오류를 줄임
ACID
| A | Atomicity (원자성) | 트랜잭션의 작업들이 모두 수행되거나, 전혀 수행되지 않아야 함 |
| C | Consistency (일관성) | 트랜잭션이 수행되기 전과 후에 데이터의 무결성이 유지되어야 함 |
| I | Isolation (고립성) | 동시에 여러 트랜잭션이 실행될 때 서로 간섭하지 않아야 함 |
| D | Durability (지속성) | 트랜잭션이 완료되면, 그 결과는 시스템 오류가 나도 영구적으로 저장되어야 함 |
데이터 정합성 / 무결성
정합성: 데이터 간 논리적인 모순 없이 올바른 관계가 유지되는 성질
- A 고객이 탈퇴했는데 주문 내역은 남아 있다면 → 정합성 오류
- 상품 재고가 0인데 주문이 계속 들어간다면 → 정합성 오류
무결성: 데이터가 정확하고, 신뢰할 수 있으며, 유효한 상태로 유지되는 성질.
- 나이 필드에 음수가 들어가지 않도록 제한
- 고객 ID가 중복되지 않도록 제한
- 주문 데이터에 없는 고객 ID가 들어가지 않도록 제한 (외래 키 제약)
무결성 종류
| 도메인 무결성 | 각 컬럼에 허용된 값만 들어가도록 제한 (예: 나이는 0~150) (각 컬럼은 도메인만 들어감) |
| 개체 무결성 | 각 행(Row)은 고유한 식별자(PK)를 가져야 함 (각 행 (튜플)은 고유한 개체여야 함) |
| 참조 무결성 | 외래 키(FK)는 참조하는 테이블의 값과 일치해야 함 (외래키는 원본과 일치해야함) |
| 사용자 정의 무결성 | 업무 규칙에 따른 조건 (예: 할인율은 0~50%) (사용자 정의) |
✅ 3. SQL이라는 표준화된 언어 사용
- 데이터를 조작하는 데 SQL(Structured Query Language) 사용
- 쿼리 작성이 직관적이고 강력함 (JOIN, GROUP BY, 서브쿼리 등)
✅ 4. 복잡한 질의 처리에 유리
- 다양한 JOIN을 통해 여러 테이블에서 데이터를 쉽게 조합
- 대규모 분석 및 통계 처리를 위한 강력한 쿼리 기능
✅ 5. 보안 및 접근 제어 기능
- 사용자 권한 관리 기능 내장 (READ/WRITE 권한 등)
- 민감한 데이터를 안전하게 보호 가능
✅ 6. 검증된 기술과 도구 생태계
- 수십 년 동안 사용되어 온 안정적이고 신뢰할 수 있는 기술
- MySQL, PostgreSQL, Oracle, SQL Server 등 다양한 RDBMS 존재
- 도구, 라이브러리, 커뮤니티 등 생태계가 풍부
🔸 언제 관계형 데이터베이스가 적합할까?
상황적합 여부
| 데이터 간 명확한 관계가 있는 경우 | ✅ 매우 적합 |
| 트랜잭션이 중요한 경우 (은행, 주문 등) | ✅ 매우 적합 |
| 정형화된 데이터가 많은 경우 | ✅ 적합 |
| 복잡한 검색, 필터링, JOIN이 필요한 경우 | ✅ 적합 |
| 빠른 확장성과 유연한 구조가 필요한 경우 | ❌ 비관계형(NoSQL)이 더 나을 수 있음 |