Skip to content

빠른 시작

TechHub 기술 지식 베이스에 오신 것을 환영합니다! 이 가이드는 프로젝트 구조를 빠르게 파악하고, 로컬 개발 환경을 시작하며, 첫 번째 문서 버전을 게시하는 방법을 도와드립니다.

환경 요구 사항

  • Node.js 18 이상
  • npm / pnpm / yarn 중 아무 패키지 매니저나 사용

의존성 설치

bash
npm install

개발 서버 시작

bash
npm run docs:dev

시작 후 http://localhost:5173에 접속하면, 아무 Markdown 파일을 수정해도 실시간 핫 리로드로 미리보기가 반영됩니다.

디렉터리 구조

.
├── docs/
│   ├── .vitepress/          # VitePress 설정과 테마
│   │   ├── config.mjs       # 사이트 전역 설정(내비게이션/사이드바/검색 등)
│   │   └── theme/           # 테마 커스터마이징(스타일, 컴포넌트)
│   ├── public/              # 정적 리소스(이미지, favicon 등)
│   ├── index.md             # 홈페이지
│   ├── project/             # 본 사이트 프로젝트 자체 문서
│   ├── frontend/            # 프론트엔드 기술
│   ├── backend/             # 백엔드 기술
│   ├── languages/           # 프로그래밍 언어
│   ├── ai/                  # AI 분야
│   ├── paths/               # 학습 경로
│   ├── journals/            # 과정 기록(로그/문제 해결/회고)
│   ├── books/               # 독서 노트
│   └── papers/              # 논문 컬렉션
├── scripts/                 # 배포/롤백/변경 로그 스크립트
├── package.json
└── README.md

새 문서 추가

  1. 해당 디렉터리에 .md 파일을 새로 만듭니다. 예: docs/guide/example.md;
  2. 파일 상단에 Frontmatter 메타 정보를 작성합니다:
md
---
title: 예시 문서
description: 본 문서는 기본 사용법을 시연하기 위한 것입니다.
---

# 예시 문서

여기가 본문 내용입니다.
  1. 사이드바에 페이지를 추가합니다(docs/.vitepress/config.mjssidebar 설정 수정).

정적 사이트 빌드

bash
npm run docs:build

빌드 산출물은 docs/.vitepress/dist에 출력되며, 아무 정적 서버나 CDN에 바로 호스팅할 수 있습니다.

빌드 결과 로컬 미리보기

bash
npm run docs:preview

다음 단계

  • 더 풍부한 문서 내용을 작성하는 방법은 작성 가이드를 읽어보세요.
  • 문서를 온라인에 배포할 준비가 되었나요? 배포 가이드를 읽어보세요.

VitePress로 제작 · 지식 공유의 정신으로 콘텐츠 축적