다중 언어 번역기 만들기
Node.js 활용해서 쉽게 번역기 만들기
저는 현재 6개국어가 지원되는 앱을 만들고 있습니다.
아직까지 하나씩 번역해서 추가해도 크게 무리가 되지 않았는데,
이번에 9개국어로 늘리게 되니 노가다로는 답이 없었습니다.
그래서 다중 언어 번역기를 만들어보았습니다.
Blank를 누르세요!먼저 node.js(이하 노드)가 필요합니다. 저는 노드가 이미 설치된 c9 IDE를 이용해서 작업했습니다. c9에서 Create a new workspace를 눌러주고, 템플렛은 Node.js가 아니라 Blank를 사용합니다. Node.js를 선택하시면, 채팅 웹사이트를 만들어주기 때문에 일이 많아집니다. Blank를 선택해도 기본적인 노드와 npm은 다 설치되어있기 때문에 가장 빠르게 만들 수 있습니다.
생성하시면 아래와 같이 빈 화면이 나오게 됩니다.
텅빈 C9 IDE 화면입니다npm을 통해서 모듈을 설치해봅니다. 제가 사용한 모듈은 google-translate-api 입니다. 그럼 설치해봅시다.
모듈 설치하기
$ npm install --save google-translate-api
위의 코드를 입력해 설치해줍니다. 그러면 알아서 필요한 다른 모듈들도 설치가 완료됩니다.
설치가 끝났으면 이제 번역을 위한 코드를 써봅니다. translator.js라는 파일을 만들어보겠습니다.
위의 코드를 입력하고 파일을 저장합니다.
코드 설명
맨 윗 줄은 모듈을 참조하는 명령입니다.
translate에 첫번째 인자에는 '안녕하세요!'를 넣었습니다. 예측하셨겠지만 번역할 '문장'을 넣어줍니다. 두번째 인자에는 {from: 'ko', to: 'en'} 이 들어갔습니다. 한국어(ko)에서 영어(en)로 바꾸겠다는 의미입니다. 'ko'나 'en'을 locale이라고 부릅니다. locale을 검색해보시면 여러 국가 코드를 찾으실 수 있습니다. 이후 번역이 끝난 문장는 .then() 안의 명령을 받아 작동합니다. 'RUN' 버튼을 눌러 코드를 실행시켜보겠습니다.
"안녕하세요!"를 제 번역기는 "Good morning!"으로 번역했습니다. 구글 번역기와 동일한지 확인해봅시다.
동일하게 작동함을 확인할 수 있습니다.
여러 언어로 동시 번역하기
이제 다중 언어 번역기로 발전시켜봅니다. 번역할 대상 언어를 배열로 만듭니다.
let langAry = ['en', 'ko', 'ja', 'es'];
예에서 번역할 언어는 영어, 한국어, 일본어, 스페인어 입니다. 4개만 넣었지만 locale만 추가로 넣어주시면 동시에 수 십개의 언어도 번역할 수 있습니다.
다중 번역을 위한 함수를 만듭니다.
let multipleTranslator = (sentence) => { };
multipleTranslator함수 안에 아래의 코드를 넣어줍니다.
저는 번역한 언어를 순서대로 넣어서 보고 싶기 때문에 wordObj라는 객체를 만들었습니다. for문을 통해서 각각의 언어에 해당하는 번역을 순차적으로 진행시킵니다.
이와는 별개로 널체크를 위한 함수를 하나 만들었습니다. 이렇게 널체크하는 이유는 여러 언어의 번역이 비동기로 진행되기 때문입니다. hasNull함수를 통해 "다 완성되면 가지고 오라"는 명령을 내립니다.
다시 multipleTranslator함수에 아래의 코드를 넣어줍니다.
"1초마다 번역이 끝났는지 확인해서 완료되면 찍어서 보내"라는 의미를 담고 있습니다.
준비는 끝났으니 코드 맨 아래에 번역할 문장을 넣어 명령을 내립니다.
multipleTranslator('반갑습니다!');
결과를 보면 아래와 같이 정상적으로 작동합니다.
텍스트 파일로 만들기
동시에 여러 언어로 번역되는 번역기를 만드는건 성공했습니다. 그런데 저는 문장을 파일에 담아두고 싶습니다. 결과로 나타나는 문장을 파일에 추가만 하면 됩니다.
저는 구현을 위해 log-to-file 모듈을 사용했습니다.
$ npm install --save log-to-file
이 모듈을 사용하면 간편하게 console.log로 찍히는 텍스트를 파일에 넣어줄 수 있습니다. 먼저 파일 맨 위에 아래의 코드를 추가합니다.
const log = require('log-to-file');
코드 중간 부분을 아래와 같이 수정합니다.
주의해서 보실 부분은 console.log를 log로 바꾼 점과 쉼표 이후에 파일 이름이 들어갔습니다. '파일 이름'은 생성하거나 텍스트를 추가할 이미 있는 파일명을 넣어주시면 됩니다.
코드를 실행해보면 이번엔 console.log에 찍히지 않고, 파일이 생성됩니다. 파일을 열어봅니다.
파일에 정상적으로 추가되는걸 확인할 수 있습니다.
만들고 있는 서비스 링크
