{
  "items": [
    {
      "id": "server-infra",
      "tag": "INFRASTRUCTURE",
      "title": {
        "ko": "라즈베리파이에서 클라우드까지, 자체 서버 운영",
        "en": "From Raspberry Pi to cloud: running my own servers"
      },
      "summary": {
        "ko": "라즈베리파이 3B와 Oracle Cloud Ampere A1에 Docker 기반 서버를 직접 구축하고, Cloudflare Tunnel로 외부와 연결했습니다.",
        "en": "Built Docker-based servers on Raspberry Pi 3B and Oracle Cloud Ampere A1, connected to the outside world through Cloudflare Tunnel."
      },
      "thumb": "assets/img/opt/webserver.webp",
      "chips": [
        "Raspberry Pi",
        "Oracle Cloud",
        "Docker",
        "Cloudflare Tunnel"
      ],
      "detail": {
        "cover": "assets/img/opt/webserver.webp",
        "blocks": [
          {
            "type": "heading",
            "level": 2,
            "text": {
              "ko": "프로젝트 개요",
              "en": "Overview"
            }
          },
          {
            "type": "paragraph",
            "text": {
              "ko": "가정 내 라즈베리파이 3B와 Oracle Cloud의 Ampere A1 인스턴스를 활용하여 두 대의 서버를 구축하고 운영하고 있습니다. 모든 서비스는 Docker 컨테이너로 격리되어 관리됩니다.",
              "en": "Operating two servers using a home Raspberry Pi 3B and an Oracle Cloud Ampere A1 instance. All services are isolated and managed through Docker containers."
            }
          },
          {
            "type": "divider"
          },
          {
            "type": "heading",
            "level": 3,
            "text": {
              "ko": "기술 스택",
              "en": "Tech Stack"
            }
          },
          {
            "type": "list",
            "style": "bullet",
            "items": [
              {
                "ko": "Docker — 컨테이너 기반 서비스 격리 및 배포",
                "en": "Docker — Container-based service isolation and deployment"
              },
              {
                "ko": "Cloudflare Tunnel — 두 서버의 서비스를 외부와 연결",
                "en": "Cloudflare Tunnel — Connect both servers to the outside world"
              },
              {
                "ko": "두 서버로 역할 분담 — 집 안의 서비스와 24시간 서비스를 나누어 운영",
                "en": "Split across two servers — Separate home services from those that run 24/7"
              }
            ]
          },
          {
            "type": "callout",
            "emoji": "💡",
            "text": {
              "ko": "24시간 구동이 필요한 서비스는 Oracle Cloud로, 가정 환경 전용 서비스는 라즈베리파이에서 운영합니다.",
              "en": "Services requiring 24/7 uptime run on Oracle Cloud, while home-environment services run on the Raspberry Pi."
            }
          }
        ]
      }
    },
    {
      "id": "portfolio-site",
      "tag": "WEB DEVELOPMENT",
      "title": {
        "ko": "프레임워크 없이 만든 포트폴리오 사이트",
        "en": "A portfolio site built without a framework"
      },
      "summary": {
        "ko": "Vanilla JS와 CSS만으로 설계·개발했습니다. 다크/라이트 테마, 한·영 다국어, 반응형, 접근성, CSP 보안 정책을 직접 적용했어요.",
        "en": "Designed and developed with Vanilla JS and CSS. Built in dark/light themes, Korean and English, responsive layouts, accessibility, and a CSP security policy."
      },
      "thumb": "assets/img/opt/web.webp",
      "chips": [
        "HTML / CSS / JS",
        "i18n",
        "A11y",
        "CSP"
      ],
      "detail": {
        "cover": "assets/img/opt/web.webp",
        "blocks": [
          {
            "type": "heading",
            "level": 2,
            "text": {
              "ko": "프로젝트 개요",
              "en": "Overview"
            }
          },
          {
            "type": "paragraph",
            "text": {
              "ko": "프레임워크 없이 Vanilla JavaScript와 CSS만으로 개인 포트폴리오 웹사이트를 설계하고 개발했습니다. 외부 라이브러리 의존성을 최소화하면서도 현대적인 웹 표준을 충실히 따랐습니다.",
              "en": "Designed and developed a personal portfolio website using only Vanilla JavaScript and CSS without any framework. Followed modern web standards while minimizing external library dependencies."
            }
          },
          {
            "type": "divider"
          },
          {
            "type": "heading",
            "level": 3,
            "text": {
              "ko": "주요 기능",
              "en": "Key Features"
            }
          },
          {
            "type": "list",
            "style": "bullet",
            "items": [
              {
                "ko": "다크/라이트 테마 전환 (시스템 설정 감지 + 수동 토글)",
                "en": "Dark/light theme toggle (system preference detection + manual toggle)"
              },
              {
                "ko": "한국어/영어 다국어 지원 (JSON 기반 i18n)",
                "en": "Korean/English bilingual support (JSON-based i18n)"
              },
              {
                "ko": "모바일 반응형 레이아웃",
                "en": "Mobile responsive layout"
              },
              {
                "ko": "WAI-ARIA 접근성 속성 적용",
                "en": "WAI-ARIA accessibility attributes"
              },
              {
                "ko": "Content Security Policy 보안 헤더",
                "en": "Content Security Policy security headers"
              },
              {
                "ko": "ES Module 기반 모듈화 아키텍처",
                "en": "ES Module-based modular architecture"
              }
            ]
          },
          {
            "type": "callout",
            "emoji": "🏗️",
            "text": {
              "ko": "모든 콘텐츠가 JSON 데이터 파일로 분리되어, 코드 수정 없이 내용만 교체할 수 있습니다.",
              "en": "All content is separated into JSON data files, allowing content updates without code changes."
            }
          }
        ]
      }
    }
  ],
  "versions": [
    {
      "tag": "2025.10 · v1",
      "title": "Markdown Version",
      "desc": {
        "ko": "처음 만든 마크다운 기반 사이트",
        "en": "The first markdown-based site"
      },
      "thumb": "assets/img/opt/old_mark.webp",
      "href": "oldMarkdown/"
    },
    {
      "tag": "2025.11 · v2",
      "title": "Glassmorphism Version",
      "desc": {
        "ko": "블러와 그라디언트를 쓴 글래스모피즘",
        "en": "Glassmorphism with blur and gradients"
      },
      "thumb": "assets/img/opt/old_glass.webp",
      "href": "oldGlass/"
    },
    {
      "tag": {
        "ko": "지금 · v3",
        "en": "Now · v3"
      },
      "title": {
        "ko": "현재 버전",
        "en": "Current version"
      },
      "desc": {
        "ko": "지금 보고 있는 이 사이트",
        "en": "The site you're looking at"
      },
      "thumb": null,
      "href": null,
      "current": true
    }
  ]
}
