┌─── 과대 기대의 정점
        │    (Peak of Inflated Expectations)
        │
   기   │    /\
   대   │   /  \
   치   │  /    \       ┌─── 생산성 안정기
        │ /      \     /    (Plateau of Productivity)
        │/        \   /
        │          \_/  ← 환멸의 골짜기
        │               (Trough of Disillusionment)
        │
        └──────────────────────────── 시간

각 단계:
1. 기술 촉발 (Technology Trigger)
   "이런 게 나왔대!"

2. 과대 기대의 정점 (Peak of Inflated Expectations)
   "이거 안 쓰면 뒤처짐!" / "XX는 죽었다!"

3. 환멸의 골짜기 (Trough of Disillusionment)
   "아 생각보다 별로인데..." / "한계가 명확하네"

4. 깨달음의 오르막 (Slope of Enlightenment)
   "이런 상황에서는 확실히 좋구나"

5. 생산성 안정기 (Plateau of Productivity)
   "적절한 곳에 적절하게 쓰자"

대부분의 과대광고 기술이 3단계에서 죽음.
살아남는 건 4-5단계까지 가는 기술뿐임.

현재 위치: 생산성 안정기 (이미 성숙)
위협 요인: Server Components 복잡성, 번들 사이즈, 학습 곡선 증가

React의 강점:
+ 압도적 생태계 (npm 패키지의 70%가 React 호환)
+ Facebook의 실사용
+ 거대한 개발자 커뮤니티
+ React Native (모바일)
+ Next.js, Remix 등 메타프레임워크

React의 약점:
- Server Components가 너무 복잡해지고 있음
- "use client" / "use server" 멘탈 모델이 혼란스러움
- 훅의 규칙이 직관적이지 않음
- 번들 사이즈가 커지고 있음
- 새로운 패러다임(Signals)을 따라가지 못하고 있다는 비판

현재 위치: 과대 기대의 정점 ~ 환멸의 골짜기 진입 중
위협 요인: Vercel 종속, 복잡성 증가, 경쟁자 다수

Next.js의 강점:
+ React 풀스택 프레임워크의 표준
+ Vercel의 강력한 지원과 마케팅
+ App Router의 혁신적 기능들
+ 기업 생태계 (Fortune 500 다수 사용)

Next.js의 약점:
- Vercel에 대한 종속성 우려
- App Router의 학습 곡선
- 캐싱 전략이 너무 복잡함
- 빌드 시간이 길어짐
- 오픈소스지만 Vercel이 방향을 독점

위협하는 기술:
- Astro (콘텐츠 사이트에서 강력한 대안)
- Remix (React Router v7으로 합쳐짐)
- Nuxt (Vue 생태계)
- SvelteKit (Svelte 생태계)

현재 위치: 생산성 안정기 (가장 안전)
위협 요인: 거의 없음 (현재로서는)

TypeScript의 강점:
+ JavaScript의 상위 집합 (마이그레이션 비용 최소)
+ 모든 프레임워크가 TypeScript 지원
+ IDE 지원 최강 (VS Code + TSServer)
+ 점진적 도입 가능
+ Microsoft 지원 (근데 오픈소스)

TypeScript의 약점:
- 빌드 단계 필요 (근데 점점 해결되고 있음)
- 타입 시스템이 점점 복잡해짐
- 런타임 타입 검사 미지원
- JSDoc 주석으로 타입 대체 가능하다는 주장

현재 위치: 생산성 안정기 진입
위협 요인: CSS 자체의 발전, 반대파의 비판

Tailwind의 강점:
+ 일관된 디자인 시스템 강제
+ HTML에서 바로 스타일링 (컨텍스트 스위칭 없음)
+ 퍼지(purge)로 작은 번들 사이즈
+ 커스터마이징이 쉬움
+ v4에서 Rust 기반 엔진으로 성능 개선

Tailwind의 약점:
- HTML이 클래스명으로 도배됨 (가독성 논란)
- CSS 지식이 결국 필요함
- 복잡한 인터랙션에는 한계
- CSS-in-JS, CSS Modules와의 철학 충돌

현재 위치: 깨달음의 오르막
위협 요인: 생태계 규모, 기업 채택 부족

Svelte의 강점:
+ 런타임 없음 (컴파일 시 최적화)
+ 반응형이 기본 (Runes with Svelte 5)
+ 번들 사이즈 최소
+ 학습 곡선이 낮음
+ 개발자 만족도 최상위

Svelte의 약점:
- 생태계 규모가 React의 1/20
- 대기업 채택 사례 부족
- 핵심 개발자 수가 적음 (Rich Harris + 소수)
- Vercel에서 일하는 Rich Harris (Vercel 종속 우려)
- TypeScript 지원이 React만큼 성숙하지 않음

현재 위치: 과대 기대의 정점
위협 요인: 학습 곡선, 웹 개발에서의 실용성

Rust in Web의 현재:
- SWC (Rust 기반 JS 컴파일러) → Next.js에서 사용
- Turbopack (Rust 기반 번들러) → Vercel 개발
- Rspack (Rust 기반 Webpack 호환 번들러)
- Lightning CSS (Rust 기반 CSS 파서)
- Biome (Rust 기반 린터/포매터)
- Oxc (Rust 기반 JS 툴체인)

Rust가 웹 개발 도구를 장악하고 있음.
근데 이건 "개발 도구"지 "앱 코드"는 아님.

현재 위치: 과대 기대의 정점 (2024-2025)
위협 요인: 정확도, 보안, 저작권

AI 코딩 도구 현황:
- GitHub Copilot — 코드 자동 완성
- Claude Code — AI 에이전트 코딩
- Cursor — AI 네이티브 IDE
- Windsurf — AI 코딩 어시스턴트
- v0 — UI 코드 생성
- bolt.new — 풀스택 앱 생성

AI가 잘하는 것:
+ 보일러플레이트 코드 생성
+ 패턴 매칭 기반 코드 제안
+ 문서 기반 코드 작성
+ 테스트 코드 생성
+ 리팩토링 제안

AI가 못하는 것 (아직):
- 복잡한 아키텍처 설계
- 비즈니스 로직의 미묘한 엣지 케이스
- 대규모 코드베이스의 전체 맥락 이해
- 성능 최적화의 미묘한 트레이드오프
- 보안 취약점의 완전한 방지

═══════════════════════════════════════════
살아남는 기술의 5가지 특성
═══════════════════════════════════════════

1. 개방성 (Openness)
   죽은 것: Flash (독점), Silverlight (독점), ActiveX (독점)
   산 것: HTML/CSS/JS (표준), React (오픈소스), TypeScript (오픈소스)
   교훈: 한 회사에 종속된 기술은 그 회사 결정에 운명이 달림

2. 점진적 도입 (Incremental Adoption)
   죽은 것: AngularJS→Angular (전면 재작성), CoffeeScript (전체 전환)
   산 것: TypeScript (점진적 도입), React (부분 적용 가능)
   교훈: "전부 아니면 전무" 기술은 도입 장벽이 높아 확산이 느림

3. 문제 해결의 지속성 (Problem Persistence)
   죽은 것: jQuery (IE 호환성 문제가 사라짐), CoffeeScript (JS가 개선됨)
   산 것: Git (버전 관리는 영원), SQL (데이터 쿼리는 영원)
   교훈: 해결하는 문제가 사라지면 도구도 사라짐

4. 생태계 규모 (Ecosystem Size)
   죽은 것: Windows Phone (앱 부족), Backbone (대안 대비 생태계 작음)
   산 것: React (npm 생태계), Java (기업 생태계)
   교훈: 기술의 가치 = 기술 자체 + 생태계

5. 적응 능력 (Adaptability)
   죽은 것: Flash (모바일 못 따라감), IE (표준 못 따라감)
   산 것: MS (오픈소스로 전환), React (클래스→훅→서버 컴포넌트)
   교훈: 변화하지 않는 기술은 죽음

// 기술을 3개 계층으로 나눠서 투자

interface TechPortfolio {
    // 핵심 (70%) — 절대 안 죽는 기본기
    core: [
        'JavaScript/TypeScript 깊은 이해',
        'HTML/CSS 기본기',
        'HTTP, REST, 네트워크 기초',
        'Git, CLI, 개발 도구',
        '자료구조, 알고리즘, 디자인 패턴',
        'SQL, 데이터베이스 기초',
        '테스트 작성 능력',
    ];

    // 전문 (20%) — 현재 수요가 높은 기술
    specialty: [
        'React/Next.js (현재 시장 지배)',
        'Node.js / Bun',
        'PostgreSQL / Redis',
        'Docker / Kubernetes',
        'AWS / Azure / GCP',
        'CI/CD 파이프라인',
    ];

    // 탐색 (10%) — 미래를 위한 투자
    exploration: [
        'Rust (시스템 프로그래밍)',
        'AI/ML 기초 (LLM 활용)',
        'WebAssembly',
        'Signals 패러다임 (Solid, Svelte 5)',
        '새로 뜨는 도구들 (Bun, Deno, Vite)',
    ];
}

// 핵심을 탄탄히 하면:
// - 프레임워크가 바뀌어도 금방 적응 (React → 다음 것)
// - 도구가 사라져도 개념은 남음 (jQuery → 네이티브 API)
// - 기술 면접에서도 유리 (기본기를 묻는 회사가 좋은 회사)

현재 프론트엔드에서 보이는 경고 신호:

⚠️ 복잡성의 증가
   - Next.js App Router의 캐싱 전략
   - React Server Components의 멘탈 모델
   - "이거 왜 이렇게 복잡한데?" ← AngularJS 말기와 같은 증상

⚠️ 빌드 도구의 폭발
   - Webpack → Vite → Turbopack → Rspack
   - 1-2년마다 "이제 이걸로 바꿔야 함" ← 프레임워크 피로

⚠️ "풀스택 JavaScript"의 과도한 확장
   - 프론트, 백엔드, 인프라, 모바일, 데스크톱 전부 JS/TS
   - "하나의 언어로 모든 것" ← Ballmer의 "Windows Everywhere"와 비슷

⚠️ 특정 기업에 대한 의존
   - Next.js → Vercel
   - Bun → Oven
   - Deno → Deno Land
   - 한 회사의 결정에 생태계가 좌우되는 구조

╔════════════════════════════════════════════════════════════════╗
║                                                                ║
║                   프레임워크 묘지 출구                         ║
║                                                                ║
║    "여기서 본 것들을 기억하셈.                                 ║
║     니가 지금 쓰는 기술도 언젠간 여기 올 수 있음.             ║
║     근데 괜찮음.                                               ║
║     기술이 죽어도 니가 배운 건 살아남으니까.                   ║
║                                                                ║
║     다음에 새 기술이 나오면 이렇게 물어보셈:                  ║
║     '이게 해결하는 문제가 5년 후에도 존재할까?'               ║
║                                                                ║
║     그 질문에 답할 수 있으면                                   ║
║     어떤 기술이 와도 살아남을 수 있음."                        ║
║                                                                ║
║    — 프레임워크 묘지 관리인                                    ║
║                                                                ║
╚════════════════════════════════════════════════════════════════╝