search

WonhyeongLee / Wonhyeong.develop.log

공부 기록용 블로그
BSD Zero Clause License
0 stars 0 forks source link

[Feat]: MD 파일에서 MDX를 사용하기 위한 작업 #23

Closed WonhyeongLee closed 5 months ago

WonhyeongLee commented 5 months ago

작업 목적

현재 프로젝트에서 MD 파일을 사용하고 있는데 MD를 사용할 때 dangerouslySetInnerHTML을 사용하지 않고 문서 안에 JSX를 활용할 수 있는 부분에서 MDX 형식을 사용해서 글을 작성하기 위해서 관련 코드를 수정합니다.

변경 예시

        <section
          css={articleBodyStyle}
          dangerouslySetInnerHTML={{ __html: post?.html || '' }}
          itemProp="articleBody"
        />

쿼리로 가져온 post 데이터를 md 문법을 변경 전엔 위 처럼 사용했던걸 아래처럼 개선합니다.

        <section css={articleBodyStyle} itemProp="articleBody">
          <MDXProvider components={shortcodes}>{children}</MDXProvider>
        </section>

기대 효과