노션을 프론트로..?

mcyoo.log·2022년 10월 8일
post-thumbnail

신박한 스택

  • 노션 with Oopy
  • React
  • spring-boot
  • AWS

내가 만든 CRUD TEST 프로젝트
https://crudtest.oopy.io/

노션을 웹사이트로 바꿔주는 서비스가 있다 바로 우피!

보통 노션 Web 공유를 하면 URL 이 만들어진다.
https://mcyoo.notion.site/52137e3e8b224d9da389025086cce

우피는 이 URL을 Custom URL 로 변경시켜주고 기존에 있던 도메인을 연결할 수도 있다...!
벌써 많이 사용하고 있다

회원가입 하면 나오는 콘솔 창이다. 테마, 폰트 등등 노션에서 하지 못한 스타일을 적용할 수 있다!!
(자세한 화면 커스텀 방식은 우피사이트에서 확인해주세요!)

일단 내가 필요한건 백엔드 API와 통신을 해야했다.
근데 프론트는 만들기 귀찮았따. 노션 페이지가 제일 깔끔하고 좋았다.
노션 페이지를 가져오고 싶었다.

그래! 그냥 API 통신하는 웹페이지만 만들어서 노션에 갖다 붙이자!

노션에서는 안되지만 우피에서는 가능했다. 바로 Oopy HTML 코드 블럭 기능이다..!
https://www.oopy.io/ko/guides/oopy-html-code-block


나의 노션 페이지

노션 페이지에서 /code 를 입력하고 HTML 로 변환 후 코드를 입력, caption 에 oopy 입력
(나는 React 로 버튼 화면을 만들고 import 했다.)

이렇게 하고 우피 연동하면 내가 만든 페이지가 노션에 나온다..!

요약
Oopy 서비스를 활용하여 유연한 노션 페이지를 만들 수 있다. 끝.

0개의 댓글