Community

개발자 99% 커뮤니티에서 수다 떨어요!

← Go back
코린이가 만든 자동 한독 통역기 웹사이트
#side_projects
2년 전
3,914
4

자기소개

안녕하세요. 저는 독일유학을 목표로 공부 중인 코린이 입니다. 니코쌤의 기초 js수업들과 유튜브 클론 코딩을 완료 했고 새로 나온 줌 클론 코딩도 조금 봤습니다. 

undefined

한독통역기 

서비스 소개

제 웹사이트는 아주 간단합니다. 실시간으로 음성을 번역해주는 웹사이트 입니다. 현재는 한-독, 독-한만 지원합니다. (모든 언어를 지원하게 만들 수도 있는데 제가 아직 서버 인프라도 모르고 api사용도 익숙하지 않아서 한-독만 만들었습니다. 이용자가 많아지면 감당을 못할 거 같아서요).

한-독 독-한도 도메인을 나누었습니다. 트래픽을 나누려고 했습니다.

시작하게 된 계기 

지금까지의 모든 번역 웹사이트는 클릭하고 - 말하고 - 번역한 거 보고 이렇게 무한 반복이었습니다. 저는 이게 효율적이지 않다고 느꼇습니다. 진짜번역기면 내가 말하는 걸 알아서 듣고 바로바로 번역해줘야 하는 거 아닌가? 싶었습니다. 그래서 자동으로 말을 인식하고 바로바로 번역해주는 웹사이트를 만들었습니다.

개발

백엔드는 node.js express와 socket io를 썻습니다. socket.io는 완전 신세계더라구요. 즉각적인 req,res는 너무 좋았습니다. 프론트는 그냥 pug를 기반으로 하는 vanila js 로 만들었습니다. react는 현재 제가 배우지 않았고 그렇게 필요하지도 않았습니다. 개발에서 가장 중요한건 어떻게 api key를 백엔드에서 숨겨서 프론트로 전해줄까? 였습니다. 서버리스 함수를 쓰는 방법과 socket.io를 쓰는 방법 두개가 있었는데 전자는 요청 갯수 제한이 있어서 socket.io를 배웠습니다. 

배포는 Heroku로 했습니다.

아무래도 web speech api가 최신기술이다 보니 핸드폰에서 사용하기가 쉽지 않습니다. 그래서 설명서를 자세히 적었습니다. (이거 때문에 반응형 웹으로 만들었습니다)

바라는 것?

음.... 독일로 혹시 여행을 가시는 분이 계시다면 제 웹사이트를 한번 써주시면 감사드리겠습니다. 

4 comments