세션 *
세션 선택
React가 뭔가? 왜 jQuery 대신 React인가?
PostgreSQL 세계관 — MySQL 개발자를 위한 패러다임 전환
Next.js란? React와 무엇이 다른가 — SSR·SSG·ISR 패러다임 완전 이해
Docker가 뭔데? — VM vs Container, 왜 쓰는가
HTML 파일에 React 올리기 (CDN, Babel)
Docker로 환경 구축 — docker-compose + pgAdmin 4 완전 세팅
프로젝트 생성 & 구조 완전 해부 — App Router vs Pages Router
Docker 설치 & 핵심 명령어 완전 정복
모던 JavaScript 핵심만 (ES6+)
설정 파일 완전 해부 — postgresql.conf · pg_hba.conf
파일 기반 라우팅 — 폴더 구조가 URL이 된다
Dockerfile 작성법 — 나만의 이미지 만들기
JSX란 무엇인가 - HTML인듯 HTML아닌 JSX
psql CLI 완전 정복 — 터미널에서 모든 것을 다루다
Layout & Template — 공통 레이아웃 시스템 마스터
볼륨 & 네트워크 — 데이터는 어떻게 살아남나
함수 컴포넌트 - 함수가 HTML을 반환한다
롤(Role) & 권한 시스템 — MySQL User와 다른 PostgreSQL의 권한 철학
Link & Navigation — next/link, useRouter, redirect 완전 정복
Docker Compose 완전 분해 — yml 파일 해부학
Props - 컴포넌트에 데이터 전달하기
DB · Schema · Tablespace — MySQL에 없는 3계층 구조 완전 이해
Server Component vs Client Component — 경계 이해가 전부다
n8n을 Docker Compose로 띄우기 — 실전 입문
컴포넌트 합성 - 레고처럼 조립하기
고유 데이터 타입 총정리 — JSONB · Array · UUID · ENUM · NUMERIC · tstzrange
Server Actions — 서버에서 실행되는 함수, form 없이 API 없이
환경변수 & .env 파일 — 시크릿 안전하게 관리
조건부 렌더링 - if로 화면 분기하기
CI4 + PostgreSQL 연결 — MyModel 패턴 그대로 PostgreSQL로 전환하기
데이터 페칭 기초 — fetch API, 캐싱 전략, 재검증
Named Volume vs Bind Mount — 데이터 영속성 완전 정복
리스트 렌더링 - 배열을 화면으로
CREATE TABLE 심화 — CHECK · EXCLUDE · GENERATED 컬럼 · DEFAULT 전략
loading.tsx & Suspense — 로딩 UI 자동화
n8n 프로덕션 설치 — PostgreSQL 연동 완전 가이드
useState - 변하는 데이터 관리
PK 전략 대전 — serial vs BIGSERIAL vs UUID vs ULID vs IDENTITY
error.tsx & not-found.tsx — 에러 처리 시스템 구축
백업 전략 — 업데이트 전 반드시 해야 할 것들
이벤트 핸들링 - onClick, onChange 마스터
ALTER TABLE 무중단 전략 — 운영 중 컬럼 추가·삭제·타입 변경
Route Handlers — API Routes 만들기 (GET·POST·PUT·DELETE)
안전한 버전 업그레이드 — 단계별 업데이트 SOP
폼 다루기 - controlled component
시퀀스(Sequence) 마스터 — 직접 제어하고 재사용하고 공유하는 법
Parallel Routes & Intercepting Routes — 모달 UI 구현
롤백 — 5분 안에 이전 버전으로 되돌리기
useEffect - 컴포넌트 생명주기 이해
뷰 & Materialized View — 쿼리를 자산화, 언제 무엇을 쓸 것인가
Static Generation(SSG) — generateStaticParams 완전 정복
헬스체크 & 자동 재시작 — 24/7 무중단 운영
데이터 fetch - API 호출과 로딩/에러 처리
파티셔닝 기초 — Range · List · Hash 파티션
Server Side Rendering(SSR) — 요청마다 새로운 데이터
Harbor란? — 왜 내부 레지스트리가 필요한가
커스텀 훅 만들기 - 로직 재사용
파티셔닝 심화 — 운영 환경 파티션 추가·삭제·이동 실전
Incremental Static Regeneration(ISR) — 정적의 속도 + 동적의 신선함
Harbor 설치 완전 가이드 — Docker Compose로 5분 만에
Context API - 전역 상태 관리 입문
외래키 전략 & 테이블 상속 — CASCADE 옵션 전략
Middleware — 요청 가로채기, 인증 게이트, A/B 테스트
이미지 Push/Pull & 태깅 전략 — 버전 관리 완전 정복
컴포넌트 분리 전략 - 언제 쪼갤까?
B-Tree 인덱스 완전 이해 — 동작원리부터 실전 설계까지
Cookie & Session 관리 — 서버/클라이언트 양쪽에서
Harbor 프로젝트 관리 & 접근 제어
스타일링 전략 - 인라인, 클래스 조건부
GIN · GiST · BRIN · Hash — 언제 어떤 인덱스를 선택할 것인가
환경변수 & 보안 — NEXT_PUBLIC_ 규칙과 시크릿 관리
n8n 이미지를 Harbor에 저장 — 영구 안전 보관소 구축
성능 최적화 기초 (useMemo, useCallback, React.memo)
복합 인덱스 & Covering Index — 컬럼 순서가 성능을 결정한다
Tailwind CSS 통합 — Next.js 공식 스타일 솔루션 실전
배포 자동화 SOP — 표준 운영 절차서 완성
useReducer - 복잡한 상태 관리
부분 인덱스 & 표현식 인덱스 — 조건부 인덱스로 크기는 줄이고 속도는 높이고
next/image — 이미지 자동 최적화, WebP 변환, lazy loading
최종 실전: 두려움 없는 인프라 완성
ref와 DOM 직접 접근 (useRef)
EXPLAIN & EXPLAIN ANALYZE — 실행계획 완전 해석
next/font — 폰트 최적화, FOUT 제거, 커스텀 폰트
고차 컴포넌트(HOC) 패턴
통계 & 데이터 분포 분석 — 인덱스가 무용지물 되는 순간과 해결책
Metadata API — SEO 완전 정복, OG 이미지 자동 생성
Render Props 패턴
슬로우 쿼리 탐지 — pg_stat_statements · auto_explain 실전
성능 최적화 — Bundle 분석, Dynamic Import, 코드 스플리팅
에러 바운더리
REINDEX CONCURRENTLY — 운영 중 무중단 인덱스 재구성 전략
국제화(i18n) — 다국어 사이트 구축
실전 프로젝트 - CI4 View에 완성형 React 컴포넌트 통합
Window Function 완전 정복 — ROW_NUMBER · RANK · LAG · LEAD · PARTITION BY
인증(Auth) 구현 — NextAuth.js v5로 소셜 로그인부터 JWT까지
CTE(WITH) & 재귀 쿼리 — 트리 구조 조회 · 점진적 집계
데이터베이스 연동 — Prisma + PostgreSQL 완전 통합
JOIN 완전 정복 — LATERAL · CROSS JOIN LATERAL · 성능 비교
CI4 백엔드 연동 — PHP API → Next.js 프론트엔드 통합
JSONB 쿼리 심화 — 연산자 총정리 · GIN 인덱싱 · CI4에서 다루기
테스트 — Jest + React Testing Library + Playwright E2E
Array 타입 실전 — 배열 조회·수정·인덱싱 · ANY/ALL 활용
Vercel 배포 & 도메인 연결 — 프로덕션 운영 가이드
Full-Text Search — tsvector · tsquery · 한국어 형태소 · 랭킹
실전 프로젝트 — Next.js + CI4 풀스택 앱 완성
트랜잭션 격리 수준 & MVCC — PostgreSQL이 동시성을 지키는 방법
PL/pgSQL 저장 프로시저 & 함수 — 선언·제어흐름·예외처리 · CI4에서 호출하기
트리거(Trigger) 완전 정복 — BEFORE/AFTER · 감사 로그 자동화 실전
VACUUM & AUTOVACUUM — 테이블 부풀음(Bloat) 원인 · 자동청소 튜닝
백업 & 복구 전략 — pg_dump · pg_basebackup · PITR 시나리오
Streaming Replication 구축 — Docker로 Primary–Replica 실습
Logical Replication — Publication · Subscription · 선택적 복제
PgBouncer Connection Pooling — 연결 폭발 방지 · Transaction mode 설정
모니터링 완전 가이드 — pg_stat_* 뷰 총정리 · 대시보드 읽는 법
Row Level Security (RLS) — 행 단위 보안 · 멀티테넌트 설계
성능 튜닝 실전 — 메모리·체크포인트·병렬쿼리 설정 최적화
CI4 마이그레이션으로 DDL 관리 — PostgreSQL 특화 타입 마이그레이션 작성법
PostgreSQL 특화 기능 × CI4 — JSONB · Array · Window를 쿼리빌더로
트랜잭션 & 잠금 완전 정복 — CI4에서 Savepoint · FOR UPDATE · NOWAIT
MyModel 패턴 PostgreSQL 확장 — 기존 패턴 100% 유지하며 PG 기능 추가
풀스택 CRUD API 실전 — CI4 + PostgreSQL로 REST API 완성
벡터 임베딩 세계관 & pgvector 설치 — 임베딩이란 무엇인가
임베딩 저장 & 유사도 검색 — L2 · Cosine · Inner Product 비교
IVFFlat & HNSW 인덱스 — 수백만 벡터에서 ms 검색
RAG 파이프라인 완성 — 문서 청킹 → 임베딩 → PG 저장 → 유사도 검색 → LLM 연동 → CI4 API
타입 *
📄 document (Markdown 문서)
💻 practice (실습 JSON)
🎯 quiz (퀴즈 JSON)
💡 실습 JSON 형식 안내 instructions: 실습 안내,
starter_code: 시작 코드,
solution_code: 정답 코드,
test_cases: 테스트 조건 배열 (check: contains/contains_tag),
language: jsx,
preview_type: react
💻 실습 JSON
💡 퀴즈 JSON 형식 안내 questions: 문제 배열 (각 문제: id, question, options 배열, answer 인덱스(0부터), explanation),
pass_score: 통과 점수(%),
time_limit: 제한시간(초, 0=무제한)
🎯 퀴즈 JSON