# Obsidian + Next.js

- 저자: chorr
- URL: https://8log.kr/obsidian-next-js
- 날짜: 2024-11-27

---

## 공식 가이드

- [Next.js](https://nextjs.org/docs)
- [Tailwind CSS](https://tailwindcss.com/docs)
- [Vercel](https://vercel.com/docs)
- [shadcn/ui](https://ui.shadcn.com/docs)

## 목표

- Next.js v15 & App Router 최신 빌드 활용
- Markdown 파싱 일관화
- App 프로젝트와 Obsidian Vault 분리되지 않도록 유지
- SEO 관련 제어 가능
- main 브랜치 = 프로덕션 배포
- 가급적 Tailwind 모든 기능 학습
- Vercel, GitHub Action 워크플로우 학습

## 마크다운 전환 모듈

- remark-parse
- remark-rehype
- remark-gfm
- @r4ai/remark-callout
- rehype-stringify
- rehype-raw
- ~~rehype-slug~~
- rehype-pretty-code
- rehype-external-links

## Tasks

- [x] next.js, vercel 도입 검토
- [x] app+obsidian 프로젝트 구조 설계
- [x] 마크다운 파서 구현
- [x] 배포 검증
- [x] code highlight 설정
- [x] sitemap 설정
- [x] 도메인 설정
- [x] callout 마크다운 설정
- [x] rss feed 설정
- [x] 이미지 줌 스크립트 적용
- [x] a태그 링크 일괄 대응 방법 확인
- [x] footnotes 스타일링
- [x] [og images](https://nextjs.org/docs/app/api-reference/file-conventions/metadata/opengraph-image) 적용
- [x] backlink 구현
- [x] heading link 재구현
- [x] TypeScript 전환
- [x] Git Submodule 적용
- [x] shadcn/ui 적용
- [x] footer 다크모드 전환 추가

## 참고자료

- https://github.com/matthewwong525/linked-blog-starter

## 결과물

- https://8dlog.com/