테이블 오브 콘텐츠

toc 기능을 만들었다. table of contents 목차 기능이다.

자세한걸 올리고 싶은데 힘이 없어서 못 올리겠다.

h1, h2, h3 태그를 뽑은 후 intersectionObserver 로 해당 요소가 화면에 등장 했을 때 id를 업데이트해서 표시해주는 기능이다. 1300px 이상일 때만 나온다.

사실 별로 어려운 기능이 아닌데 오래 걸렸다 ㅠㅠ

next에서 dom이 완전히 로드되기 전에 intersection observer가 세팅이 돼서 제대로 값이 업데이트 안되는 이슈가 있었다. query selector로 찍었을 때는 분명히 태그가 다 나왔는데 dom의 완전한 로딩이 끝난 후에 처리한다는 개념을 몰라서 한참 고생했다.

    if (typeof window !== "undefined") {
      window.addEventListener("load", () => {
        setLoad(true);
      });
    }

이런 방식으로 dom의 로딩이 끝난 후 load 값을 변경해서 TocComponent 가 오픈되도록 했다. 이건 나중에 기회가 되면 따로 콘텐츠로 올려야 겠다. 지금은 아직도 예외 처리할게 남았다.

Pretendard 폰트

폰트를 프리텐다드로 바꿨다. 원래 폰트를 잘 안쓰는데 우연히 알게 된 분이 폰트를 바꿔보라고 해서 바꿨다. 근데 생각보다 마음에 든다. pretendard는 프로젝트에서 꼭 한 번 쓰고 싶었던 폰트다.

디자인

디자인은 해야지 하는데 시간이 없어서 항상 후순위였다. 나도 디자인 잘 할 수 있다규…

landing page의 개선

랜딩 페이지 개선은 꼭 해야 겠다.

animation 도입

애니메이션은 간단한것만 css로 만들어 쓰는데 framer motion (https://www.framer.com/motion/) 을 써보고 싶다. next랑 올렸을 때 살짝 안 맞는거 같기는 한데 아직 시간이 없어서 못봤다.

basic editor

basic editor도 해야 하는데… 기본적인 기능이라도 정리해야 할것 같다.

너무 힘들기는 한데 그래도 재밌다.

유료 기능

유료 기능은 생각보다 준비할게 많아서 꼼꼼히 준비 후 진행할 예정이다.