Medium 번역기(with 크롬 익스텐션)

영어를 잘 못하는 사람의 입장에서 미디엄 글을 읽을 때면 크롬의 번역기를 잘 이용하고 있었습니다.
그러다 문득 영어를 못하지만 원문으로 글을 읽고 싶다는 생각이 들었습니다.
원문으로 글을 읽다가 모르는 단어가 보이면 papago에 검색을 해보거나, 번역기를 눌러서 해당 텍스트를 찾아서 이해하고 넘어가는 경우들이 있었습니다.

뭔가 원문으로 읽으면 탭의 전환을 해서 검색하고 다시 돌아와서 읽으려고 하니 흐름도 끊기고, 읽기가 싫어지는 느낌이 들었습니다.

불편함을 개선하기 위한 방법으로 크롬에서 사용할 익스텐션을 만들어 보기로 했습니다.
이전에도 한번 만들어보고 싶었는데, 이번 기회에 시도를 해보면 좋을 것 같아서 진행하였습니다.

 

Google vs Papago

2개의 API에서 어떤 것을 쓸지 고민했지만, 크롬 익스텐션에서 사용할 서비스라는 생각에 google을 사용하도록 하였습니다.

---

1-1. Google API 발급
- API key 발급 - https://cloud.google.com/translate?hl=ko

- Translation API 사용해보기 클릭

- 처음 Google Cloud를 사용하는 경우 카드 등록부터 생성까지 진행해야 합니다.

- Google API를 사용하기 위해서는 가입이 필요합니다.

- 저의 경우 번역기를 사용하기 위해서 API를 발급받았습니다.

사용 버튼 클릭

 

- 이미지에서 보다시피 사용자 인증 정보 만들기 버튼을 클릭하면 사용자 인증 정보를 만들 수 있습니다.

- API 키를 선택하여 API 키를 생성합니다.

- 생성한 API 키를 복사합니다.( 개인 API 키를 이용해서 번역할 수 있도록 구성하였습니다.)

 

1-2. 발급받은 API 키 등록

- 세부정보를 클릭합니다.

- 확장 프로그램 옵션을 선택합니다.

- Google API Key 설정 창에 발급받으신 API 키를 넣으시고 저장버튼을 눌러주시면 등록이 완료됩니다.

등록 후 실제 미디엄에서 사용했을 때입니다.

- 현재는 미디엄으로 지정했지만, 이후에는 다른 사이트에도 진행할 수 있도록 하려고 합니다.

 

시연영상

 

 

 

익스텐션에서 사용 방법을 보러 오신 분들은 위에 API 키를 발급받으시고 등록 과정까지만 진행해 주시면 됩니다.

- 구현 코드는 github에 올려놓도록 하겠습니다. - github

---

필요한 것이 있으면 세부적인 기획이 필요할 수도 있지만 일단 빠르게 만들어 보는 게 좋다고 생각한다.

일단 내가 필요해서 만들었으나, 누군가에게도 필요할 것이라고 생각합니다.

 

Ref.

 

https://blog.naver.com/mimongxx_page/223019815322

구글 번역 API KEY 발급방법

https://developer.chrome.com/docs/extensions/get-started?hl=ko

확장 프로그램 / 시작하기  |  Get started  |  Chrome for Developers

https://admd13.tistory.com/389

구글 크롬 웹스토어 앱 출시하기 (크롬 확장 프로그램, chrome extension)