본문 바로가기

유틸리티

노션에 글쓰고 티스토리로 자동 업로드2022년 최신판!! 초보자용 가이드 공개합니다!!(미친 효율과 최적화)

안녕하세요 요약이입니다. 오늘 포스팅할 내용은 많이들 아시는 노션 협업툴에서 티스토리와 미친 연동이 가능한 프로세스를 만드는 것에 대해 다룰 예정입니다. 우선.. 해당 작업을 하기까지 해당 과정을 거치기까지 정말 30~45개의 포스팅 글을 보고 참고하고 배웠던 것 같습니다. 제가 이렇게까지 해당 프로세스를 갖고자 했던 이유는

저한테 한정된 시간 안에서 더 빠르고 좋은 퀄리티의 포스팅이 하고 싶었던게 전부입니다..

단지 그런 마음에서 시작되었던 작업이 5시간씩 걸리면서 공부를 하게 된 상황이네요..하하하하

목차

해당 프로세스의 역사(?)

Notion2Tstory라는 프로그램으로 간단하게 업로드가 가능했습니다. gif 파일과 100% 최적화된 양식 제작까지는 불가능했던 것으로 알고 있습니다. 가능했던 환경이라면 개발적 지식이 조금은 필요했거나 엄청나게 복잡했던 과정으로 그냥 단순 포스팅 속도가 더 빠를 수 있는 상황이였어요.. 근데 지금 제가 포스팅하는 이 방법도 막혔다는 여론이 있었는데 제가 직접 해본 결과 아직 가능하다고 말씀 드릴 수 있을 것 같아요. 블로그를 다시 하기로 결심하면서 예전 Notion2Tstory 프로그램을 다시 해보고자.. 아니 더 좋은 프로세스가 있다면 도입해보고자 눈에 불을 키고 찾았습니다. 그리고 오늘 이 포스팅은 22년 9월 기준 최신화이자 가장 어렵고 가장 편한 방법이라고 말씀 드릴 수 있을 것 같습니다.

어렵게 안 만큼 편한 오늘의 포스팅 프로세스

해당 기능을 추천하는 이유

  1. 블로그 포스팅할 때 홈페이지 환경이 너무 너무 불편하신분
  1. 노션으로 글 작성이 익숙하고 편하신분
  1. 노션으로 깔끔한 양식 정리에 능통하거나 노션의 디자인이 더 좋다고 생각하시는 분
  1. 티스토리 작성할 때 GIF을 쓰기 귀찮으신 분 (GIF 파일을 써서 포스팅 환경을 더 쾌적하게 하고 싶은 분)
  1. 노션으로 내가 정리한 요약본을 티스토리에 올릴 수 있으면 좋을 것 같다는 고민을 하신 분
  1. 답답하거나 효율적이지 않은 단계가 거슬리셨던 분(티스토리에 들어가서 카테고리 설정하고 사진 또 올리고 글씨 크기 또 볼드하고…등 등 등)

해당 기능이 어려울 수 있는 분들(경험기반)

  1. 코딩을 아예 모르는 분들(저는 코딩이 뭔지 아직도 모르겠습니다)
  1. 코딩 같이 복잡한 계산이나 공부를 기피하고 싶으신 분
  • 저도 기피하고 싶었던 순간이 너무 많아서 기피해도 인정입니다.
  1. 복잡한 프로그램 세팅을 만져야하는 것이 처음이신 분
  • 저도 처음부터 시작한만큼 10시간이 넘게 공부하고 따라하면서 얻은 방법입니다.
💡
오늘 제가 알려드리는 방법은 인터넷에서도 쉽게 알려주시지 않았던이 아닌 쉽게 이해할 수 없었던 비전공자 시선으로 끼적끼적 따라해서 성공한 내용을 공유하겠습니다.


잠깐!!!

오늘 포스팅은 Mac OS기 준으로 작성하는 점 양해 부탁드립니다!!!

WIN OS를 사용하시는 경우에는 아래의 블로그 포스팅을 참고 해주세요🙂

노션 글을 티스토리로 자동 업로드 - Notion to Tistory (N2TWinform)
티스토리(Tistory) 를 시작하면서 양식을 좀 더 이쁘고 간편하게 작성하여 업로드할 수 있는 방법은 없을지 생각하게 되었습니다. 그러면서 든 생각은 노션(Notion) 에 작성한 글이 그대로 티스토리(Tistory)에 업로드하면 좋겠다는 생각이였는데요. 한창 구글링을 통해 발견한 글이 있었습니다. 파이썬으로 구현한 소스를 오픈소스로 공유한 글이었는데요. 맥(Mac) OS에서 구현한 소스여서 그런지 제 윈도우(Windows) 환경에서는 정상 동작하지 않았습니다.
https://joel-helloworld.tistory.com/65

혹시 몰라서 위의 링크(윈도우용)를 첨부하고 직접 따라해보시는 것을 추천드려요!

N2TWinform이라는 이름으로 진행하는 방법입니다.


전반적인 구성

이렇게 작업이 진행됩니다.

전혀 모르겠던 내용인데 경험해보고 후기를 말씀드리면 11시 방향에서 양식에 맞게 글을 써보고 터미널로 경로 지정을 해주면 자동으로 업로드가 되는 과정입니다.

준비물

  • 2단계 인증을 해제한 카카오톡 계정
  • 노션 웹페이지
  • 작성용 템플릿(복제 사용)
  • 절대 지치지 않겠다는 약속과 맹세 그리고 사랑

참조링크

링크를 접속하면 이런 말도 이해하기 힘든 표시들이 가득합니다.. download zip을 누르면 또 어떻게 되는지도 모르겠고 개발자들의 영역이라고 치부해버리기 쉽게 저한테 너무 어려웠습니다.. 제가 한 방법으로 순서를 정리 해보겠습니다.

Step1_템플릿 복사

💡
시작하겠습니다. 우선 노션 템플릿을 복제해주세요
테이블 템플릿
A new tool for teams & individuals that blends everyday work apps into one.
https://jmjeon94.notion.site/08e08d36ac3544a7ab21f141232b311b?v=92376629a4d74c358d47228fbd9edcce
  • 카테고리

    카테고리의 변경과 상태의 변경으로 작성을 유동적으로 수정할 수 있습니다.

본인의 블로그 태그를 맞춰 작성해주시면 됩니다.

  • 상태

    수정 요청: 수정할 경우

    발행 요청: 작성 요청

    발행 완료: 발행이 완료되면 자동으로 체크

  • 링크

    작성을 하면 자동으로 블로그 주소로 연결 될 것입니다!

💡
테스트 페이지가 있긴한데 저는 카테고리를 제 블로그와 똑같이 구성하면서 테스트 해 본 결과 테스트 페이지 자체를 건드리는 것은 크게 문제가 되지 않았어요!

step2_코드 clone 하기(설치 파일 깔기 개념)

코드를 clone 하다.. 정말 어렵습니다. 검색해도 속 시원하게 답이 나오지 않았어요.
  • 복사하고 냅다 붙여넣기 하는 것입니다 정말 그게 끝이였어요.. 단!!!!!! colne을 하는 것은 원하는 디렉토리로 가서 코드를 붙여넣는다.

즉, 원하는 폴더에 가서 코드 내용을 설치한다. 로 정리 할 수 있을 것 같습니다.

  • 터미널에 냅다 복붙 해주세요. 설치가 진행됩니다.
git clone https://github.com/jmjeon94/N2T.git

메인 디스크에 자동으로 지정되었으면 다음 값을 입력합니다.

pip3 install -r requirements.txt

여기서 주의!!!!

• 로컬 PC의 원하는 디렉토리로 가서 코드를 clone 합니다.

작성자분의 코멘트인데 원하는 디렉토리가 원하는 경로인 것 같았어요.. 근데 이 부분이 참 어렵더라구요 저한테는… 그래서 저는 그냥 설치했습니다.

설치 후 제 맥 아이디 윈도우의 경우 user개념의 드라이브에서 N2T가 깔린 것을 확인했습니다.

서비스→폴더에서 새로운 폴더 열기를 진행해주셔야해요

저희는 원하는 도큐멘터리를 설정하지 않았기에 저희가 직접 경로를 지정해줘야하는 점 잊지 말아주세요. 원하는 도큐멘터리를 지정하는 것이 이제 개발적 지식을 요구하는 부분으로 전 이해하고 있습니다. 왜 이런 개념 있잖아요 경로를 지정했다가 풀어줬다가 이동했다가 그런 개념에 들어가는 순간 정말 어려워질 것 같은데 그걸 아는 사람들이 이 프로세스를 빠르게 알고 있고 개발자들인 경우가 많은 느낌이에요

코드를 입력하면 설치는 끝입니다!!


step3_config.py 파일 내용 정리(최종이자 가장 중요)

config.py를 더블클릭해서 본인의 티스토리 정보를 싹 싹 긁어모아야합니다.

💡
아래의 정보들을 알아가볼까요??
  1. App ID
  1. Secret Key
  1. 시크릿
  1. 데이터베이스 아이디
  1. 토큰
  1. Call back

작성자분의 예시에선 from utils.dotdict import dotdict이 없습니다..(이것 때문에 눈물을 흘렸던 아무것도 모르는 나)
원래 양식을 꼭 지키면 저와 같은 실수가 없을 겁니다.

주의사항 정리

  1. from utils.dotdict import dotdict는 절대 건드리지마세요
  1. ‘ ‘ 이 표시 또한 건들면 안됩니다.
  1. 카카오톡 티스토리 2단계 인증 시 진행이 안됩니다.
    다음 카카오톡, 티스토리 2단계 인증 및 2단계 인증해제 방법
    인터넷 등의 IT기술이 발전하고 상호 연결성이 높아지면서 정보보호의 중요성 은 커져가고 있습니다. 내 계정을 누군가 도용해서 업로드한 글과 사진들이 모두 사라지거나 다른 용도로 사용한다 생각하면 정말 끔찍한 일입니다. 더욱이 요즘엔 다음카카오나 네이버, 페이스북 계정으로 통합 로그인되는 사이트나 앱 이 늘어나고 있어서 하나가 노출이 된다면 그 파급되는 문제가 심각해지는 요즘입니다.
    https://dailyhappyday.tistory.com/762

step4_config.py 파일에 들어갈 티스토리 api 세팅

TISTORY
나를 표현하는 블로그를 만들어보세요.
https://www.tistory.com/auth/login?redirectUrl=http%3A%2F%2Fwww.tistory.com%2Fguide%2Fapi%2Fmanage%2Fregister

Open API(SECRET KEY, CLIENT ID, REDIRECT_URI)을 따봅시다!!!

💡
앱등록하고→앱 관리에서 위의 내용을 저장해두세요🙂

  • 서비스 명: 작성자 마음대로 작성(예. 테스트용 글)
  • 설명: 목적 작성을 써도 괜찮고 아무거나 괜찮아요.
  • 로고등록: 생략해도 괜찮습니다.
  • 서비스 URL: 개인 블로그 링크 작성 (http:// → https:// 형태로 삽입)
  • CallBack: API 사용 토큰을 발급받기 위해 사용한다는데 (위의 서비스 URL과 같은 링크 작성하면 됩니다)

step5_노션 웹페이지 토큰값 저장

노션 페이지에 토큰을 받는 작업인데 이때 매우 중요한 사항

💡
무.조.건 노션을 웹 로그인 후 이 작업을 해주세요! 오늘 220914 기준으로 확인 결과 앱에서 링크로 접속하니 내용이 안뜨네요

  1. 복제한 템플릿의 링크 생성
  1. 링크로 접속 후 토큰 권한 페이지 접속
    • 우클릭→검사
    • fn + f10
  1. 맨 아래 cookie value값을 또 복사하는 것 잊지마세요!

Step6_노션의 api도 따주기

Notion - The all-in-one workspace for your notes, tasks, wikis, and databases.
A new tool that blends your everyday work apps into one. It's the all-in-one workspace for you and your team
https://www.notion.so/my-integrations
  • 새 API 통합 만들기를 진행
  • 이름 아무거나 하고 제출하기 해주세요!

Step7_마무리 이후 끝

python3라는 모델로 main.py라는 프로그램을 켠다는 뜻입니다.

python3 main.py

무슨 뜻인지 모르겠으나 이것을 실행하는 것으로 종료입니다.

출처: smartworks님의 블로그

후기

너무 고생했지만 성공하고 소리를 질렀습니다.. 이게 개발 관련 지식이 하나도 없는 저한테 1부터 떠 먹여주는 사람이 없어서 더 고생한만큼 좋았던 것 같습니다.. 막상 적용하고 나니 별로다 이런 것 없이 블로깅 관점에서 정말 최고라고 말하고 싶어요. 이번 포스팅은 그냥 블로그를 오신 분들께 제가 느낀 고충을 똑같이 받지 않았으면 해서 정리를 한 것도 있고 제가 나중에 또 적용을 할 때 참고를 하고자 정성스럽게 준비해봤습니다.

이해가 안가거나 오류가 있는 분들은 댓글 주세요 .

긴 글 읽어주셔서 감사합니다. 오늘도 좋은 하루 보내세요

AS

발행할 페이지가 왜 없다는지 모르겠는뎁쇼??

발행 요청을 하십쇼.


Uploaded by N2T