개인 기술 블로그

이 기술 블로그는 Cline 확장과 Claude LLM를 활용하여 제작되었습니다. Next.js와 React를 기반으로 제작되었으며, 마크다운 기반의 콘텐츠 관리, 태그 시스템, 검색 기능, 댓글 시스템 등 다양한 기능을 제공합니다.

지속적인 업데이트를 통해 추후 블로그 테마로 배포할 계획입니다.

• ✨ 마크다운 기반 콘텐츠: 마크다운 파일로 블로그 포스트 작성 및 관리
• 🔍 검색 기능: 제목, 내용, 태그 기반 포스트 검색
• 🏷️ 태그 시스템: 포스트 분류 및 태그별 모아보기
• 📱 반응형 디자인: 모바일부터 데스크탑까지 모든 화면 크기 지원
• 🌓 다크 모드: 사용자 환경에 맞는 테마 자동 적용 및 수동 전환
• 💬 댓글 시스템: GitHub Discussions 기반 Giscus 댓글 기능
• 📑 목차: 포스트 내용 기반 자동 반응형 목차 생성
• 🔗 SEO 최적화: 검색 엔진 최적화를 위한 메타데이터 관리
• 🔒 Private 포스팅 관리: GitHub의 private 레포지토리를 통한 포스팅 콘텐츠 보호

이 블로그는 코드베이스는 public으로 공개하면서 포스팅 내용은 private으로 관리할 수 있도록 설계되었습니다. 이를 위해 Git submodule을 사용합니다:

1. 메인 레포지토리 (public): 블로그의 코드, 디자인, 설정 등이 포함됩니다.
2. 포스트 레포지토리 (private): 블로그 포스팅 내용만 포함하며, 메인 레포지토리에 submodule로 연결됩니다.

1. GitHub에 private 레포지토리 생성 (예: blog-posts)
2. 메인 블로그 레포지토리에 submodule로 추가:

   git submodule add git@github.com:YOUR_USERNAME/blog-posts.git src/content/posts

3. GitHub Actions에서 private 레포지토리에 접근할 수 있도록 Personal Access Token 설정:
   • GitHub에서 Personal Access Token 생성 (repo 권한 필요)
   • 메인 레포지토리의 Settings > Secrets and variables > Actions에서 ACCESS_TOKEN 시크릿 추가

1. 레포지토리 클론 시 submodule 함께 가져오기:

   git clone --recurse-submodules git@github.com:YOUR_USERNAME/blog.git

2. 이미 클론한 경우 submodule 초기화:

   git submodule update --init --recursive

3. 포스트 작성 후 private 레포지토리에 먼저 커밋 및 푸시:

   cd src/content/posts
   git add .
   git commit -m "Add new post"
   git push

4. 메인 레포지토리에서 submodule 참조 업데이트:

   cd ../../../
   git add src/content/posts
   git commit -m "Update posts submodule"
   git push

이 블로그는 클라이언트 사이드 검색 기능을 제공합니다. 검색 데이터는 빌드 시점에 생성되며, 다음과 같이 사용할 수 있습니다:

1. 개발 환경에서 검색 데이터 생성:

   node scripts/generate-search-data.js

   이 명령어는 public/search-data.json 파일을 생성합니다.

2. 빌드 시 자동 생성: 빌드 과정에서 postbuild 스크립트가 자동으로 검색 데이터를 생성합니다.

3. 검색 사용: 네비게이션 바의 검색창에 검색어를 입력하고 엔터를 누르면 검색 결과 페이지로 이동합니다.

커스텀 시 아래 파일의 텍스트 수정이 필요합니다.

추후 config 파일 하나에서 수정 가능하도록 개선할 계획입니다.

blog/
└── src/
  ├── app
  │ ├── layout.tsx
  │ └── page.tsx
  └── components
    └── Navbar.tsx