# 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/>