Node.js in Flitto

1. p l a y . n o d e ( ) ; asbubam @ Flitto 집단지성 번역 플랫폼 플리토는 노드를 어떻게 사용하는가? photo by Jongho Jang

2. C, Java in 여기저기 Ruby on Rails, Node.js in News1 Node.js in Flitto Punk Band bass Fashion Photography in Tokyo Seungwoo Lee Engineer asbubam@Flitto.com … dalsdoll

3. 現 플리토 남성후디 전속모델 활동 중 특기: 역동적인 포즈 특이사항: 촬영 후 다이어트로 체중감량에 성공 스타트업 플리토의 개발자입니다. photo by Jongho Jang www.ﬂitto.com store

4. Flitto집단지성 번역 플랫폼 플리토

5. 곤니찌와 하지메마시떼. 와따시와슈우단시세혼야크플라토포므노 플리토데사-바카이하쯔오단또우시떼이루 이승우또모우시마스 쿄와플리토와노도제이에스오도우얏때 쯔깟데이루노까니쯔이떼핫표사세떼이따다쿠 코토니나리마시따. 도우죠요로시꾸오네가이시마스

6. 언어의장벽 ⾔語の壁 language barrier 어떠세요? 언어의 장벽이 팍팍 느껴지시죠?

7. 하지만 저는 플리토 번역요청기능을 통해 일본어와 한국어에 능통한 minj9땡땡 회원님의 도움을 받을 수 있었습니다. :)

8. 언어의장벽 ⾔語の壁 language barrier 플리토는 번역이 필요한 사람과 번역을 할 수 있는 사람을 똑똑하게 연결해주고, 집단지성의 힘을 통해 언어의 장벽을 뛰어넘는 서비스입니다.

9. www.Flitto.com www.Flitto.com 웹사이트 아이폰, 안드로이드 마켓에서 만나실 수 있습니다!

10. 50개 Node.js 프로젝트 (20개 데몬형태) 메인서버 약160 개 endpoint * CRUD REST API 오늘은 주요 부분만 설명합니다. Node.js in Flitto

11. 사용 기술 AWS 위에서 운용하고 있으며 아래 기술들을 사용합니다.

12. 사용 기술 backbone.js, angular.js는 어드민에서 사용하고 웹서비스 프론트는 jquery와 순수 자바스크립트로 구성되어 있습니다. sequelize는 백오피스에서 사용합니다.

13. 서버 구조 main server push admin crawler task api / front end 메인서버, 어드민, 크롤링, 테스트관리, 푸쉬를 처리하는 데몬들과 고유의 기능을 하는 작은 서비스들로 이뤄져있습니다.

14. 서버 구조 main server push admin crawler task api / front end PostgreSQL(RDS) 을 메인디비로 하고 용도에 따라서 휘발성, 비정형 데이터는 mongoDB에, 세션정보와 접근이 빈번한 데 이터는 Redis에 저장하고 있습니다.

15. 디렉터리 구조 - app - models - services - routes - views - utils - test - … - public 메인 서비스의 디렉터리 구조는 일반적인 express 프로젝트의 구조와 비슷합니다.

16. Node.js 4.2.1 production 전 서버에 적용 (2015/10/27) 주의 기존에 설치된 node_modules npm cache node_gyp 깔끔하게 지우고 재 설치 https://github.com/nodesource/distributions 참고

17. v0.8.x => 2012/10/17 AWS t1.micro 서버 생성 v0.10.x v0.10.８ => 2013/05/20 내가 입사한 날 v0.12.x v4.2.1 LTS => 2015/10/27 빨라진 것 같은 느낌적인느낌 Node.js 버전변화 v0.12.7: (57.3+60.8+61.5+66.4+69.3)/5 = 63.06 건 / sec v4.2.1: (57.1+73.9+74.8+75.4+78.4)/5 = 71.92 건 / sec (71.92-63.06)/63.06*100 = 약 14.05 % 성능향상 랜딩 화면을 2000번씩 5회 렌더링 테스트 특정 페이지를 2가지 버전 환경에서 테스트한 결과로 모든 환경을 통틀어 14.05%를 보장할 수는 없지만 실제 서비스 반영결과 버전업으로 만족할 만한 성능을 얻고 있다고 판단됩니다.

18. express 4.x.x express 4.8.x 를 프러덕션에서 문제없이 사용하고 있습니다.

19. 사용 패키지 aws-sdk cron geoip gm hiredis kue moment nodemailer qr-image … cron: 프로세스 내에서 정의하는 크론잡 실행 geoip: ip로 geolocation 정보 가져오기 gm: 이미지 변환, hiredis: redis LRANGE 등에서 성능향상 kue: redis 에 붙여서 큐잉, moment: 날짜 시간 i18n적용 nodemailer: 메일전송, qr-image: qr코드 생성

20. 개발환경 = + https://www.jetbrains.com/webstorm 최근엔 디버깅도 많이 좋아졌어요. :)

21. 코드 컨벤션 서버팀원이 3명이상이 되면서부터 코드 컨벤션을 위키에 정리하고 있어요.

22. db schema 버전관리 flyway flyway를 사용해서 db schema 버전관리를 하고 있어요. 개발자 간의, 혹은 서버 간의 db schema싱크에 편하고 좋아요.

23. step / async / promise Callback What? Callback 이 중첩되는 문제는 step을 많이 이용하다가 작년부터는 async로 이동하고 있고 특정부분에는 promise를 사용하고 있어요. 개인적인 생각이지만 Node.js로 개발하면서 Callback에 의한 문제는 크게 겪은 경험이 없어요. 오히려 비동기적인 설계경험이 아직 많지않아서 겪는 시행착오가 더 많은 것 같아요.

24. tpl() 메소드를 통한 백엔드 / 프론트엔드 그리기 파샬을 렌더링하는 tpl() 메소드를 정의하고 백엔드와, 프론트엔드에서 동일한 탬플릿 파일, 메소드를 이용해서 파샬을 그리고 있어요.

25. pg_node pg 를 래핑 트랜잭션 처리 추가 query string 출력 log() 추가 postgresql 연동 시 많이 사용하는 pg 모듈에 트랜잭션 처리를 래핑하고 query parameter를 넣어 log를 출력하는 log 메소드를 추가해서 사용해요.

26. 공통으로 사용하는 코드 모듈화 서비스 전역에서 사용하고, 공통되는 부분은 별도의 모듈로 분리해서 여러곳에서 사용하고 있어요.

27. 프론트엔드 패키징 자동화 변경 전: grunt + python 변경 후: grunt + gulp 스프라이트 이미지 생성 JS, css 압축 등 프론트엔드 패키징에 grunt + gulp 조합을 사용해요.

28. 서비스가 18개 언어 지원 -> error 메시지도 18개 언어로 서비스 내 모든 문구, 에러문구, api에 자체 구현한 i18n 반영 싱크는 redis pub/sub

29. getError(errCode, 사용자의 language 고유키); { statusCode: 404, body: { code: 404, desc: “Not Found”, message: “대상이 없습니다.” resource: “url…” } } errCode와 language 고유 키의 조합을 통해 사용자의 모국어로 오류코드를 출력하고 있어요. statusCode는 http스펙을 따르고 body.code는 디테일하게 정의해서 사용해요. 에러코드에 대응하는 서비스와 디버깅을 위해서 유저에게 보여지는 에러(녹색부분) 서버에 보여지는 에러(붉은색부분)를 구분해서 처리해요.

30. test mocha, should test는 mocha 와 should 조합을 사용해요.

31. forever -> pm2 프로세스 관리는 forever 에서 pm2로 넘어가서 최근 프로젝트는 대부분 pm2를 사용하고 있어요. pm2가 조금 더 이쁘고, 조금 더 안정적인 것 같아요.

32. 글로벌유저 대응 접속 위치 기준 타임존 계산 및 서비스 심야시간 푸쉬받지않기! 우리의 심야시간 != 유저의 심야시간 플리토는 현재 170여개국에서 사용 중이기 때문에, 실제 유저가 접속하는 위치의 타임 존에 맞게 서비스를 반영하고 있어요.

33. dev / staging / real 개발환경은 dev / staging / real 로 분리해서 사용하구요.

34. 배포 Fabric + 기존에는 Fabric만 사용해서 배포했었는데요. 팀원들이 늘고, 동시에 개발되는 피쳐도 늘어나면서 Jenkins를 도입하게 되었고 현재는 배포할 때 굉장히 편안하고 부담없이 하고 있어요.

35. AWS ELB 무중단 서비스 디플로이 AWS ELB를 물론 사용하고 있고 디플로이 시에, aws-sdk 로 구현한 배포로직을 통해 ELB에서 순차적으로 빼고 업데이트 하고 다시 넣고 하는 과정을 거치고 있어요.

36. logging winston / morgan 로깅은 프로젝트마다 조금 다르지만 대체적으로 winston 과 morgan을 사용해요.

37. 웹 푸쉬 socket.io + redis pub/sub socket.io + redis pub/sub 을 통해 웹서비스에 실시간 알람 기능을 구현했어요.

38. 실험적 admin 변경 전: backbone.js 변경 후: angular.js, sequelize 실험적인 기능이나, 기술의 반영은 메인서비스에도 많이 하지만 어드민에 특히 많이 시험삼아 도입해보고 있어요. 어드민은 기존에는 backbone.js를 사용하다가 최근에는 angular.js 와 sequelize를 사용하고 있어요.

39. 그밖에 노드로 하는 것 쉘스크립트, 크론잡 쉘 스크립트, 크론잡도 Node.js 스크립트로 구현하고 있어요. Node.js로 다할 수 있어요. :)

40. 그밖에 노드로 하는 것 u+ xpay, alipay, paypal giftishow, happymoney Node.js 포팅 기존에 php, java로 작성되어 있던 api들을 Node.js 로 포팅해서 사용해요.

41. 그밖에 노드로 하는 것 s3에서 파일 50만개 빨리 다운받기 aws-sdk, async(queue) var AWS = require(‘aws-sdk') , s3 = new AWS.S3() , fs = require(‘fs’) , targetFile = fs.createWriteStream(targetFilePath); var read = s3.getObject({ Bucket: bucket, Key: filePath }).createReadStream(); read.pipe(targetFile); AWS S3에서 수많은 파일을 동시에 옮겨야할 땐 aws-sdk + stream 조합이 최고에요.

42. 그밖에 노드로 하는 것 형태소 분석 “내일 아침까지 첨부된 엑셀파일에 포함된 문장 중에서 3글자 이상이면서 2번이상 반복되는 명사, 형용사 뽑아주세요.” “그리고 ~이런 느낌적인 느낌의 문장들도 뽑아주세요.” mecab-ffi 은전한닢(오픈소스 한국어 형태소 분석기 프로젝트)에서 사용하는 mecab-ko(오픈소스 형태소 분석 엔진인 MeCab를 한국어에 맞게 포팅)를 @xissy님이 Node.js 로 포팅

43. 그밖에 노드로 하는 것 형태소 분석 라네즈 파워 에센셜 스킨 200ml 제조년월일 13년 06월10일/개봉전 제조일로부터 30개월/개봉후 12개월/제조일은 상품 입출고일에 따로 수시로 변동 될수 있으므로 반드시 판매자에 문의 바랍니다. 1. 세안 후 500우너 동전크기 (지름 2.5cm)만큼 화장솜에 적셔 피부결에 따라 발라줍니다. 2.얼굴을 가볍게 닦아내는 기분으로 >사용하시면 투명케어에 더욱 효과적입니다. 1. 상처가 있는 부위 또는 습진 및 피부염 등의 이상이 있는 부위에는 사용하지 마십시오. 2. 화장품 을 사용하여 다>음과 같은 이상이 있을 경우에는 사용을 중지할 것이며. 계속 사용하면 증상을 악화시키므로 피부과 전문의 등에게 상담하십시오. 1) 사용 중 붉은 반점. 부어오름. 가려움증. 자극 등의 이상이 있는 경우 2) 적용부위가 직사 광선에 의하여 위와 같은 이상이 있을 경우 3. 보관 및 취급상의 주의사항 1) 사용 후에는 반드시 마개를 닫아 두십시오 2) 유소아의 손이 닿지 않는 곳에 보관하십시오 3) 고온 내지 저온의 장소. 직사광선이 닿는 곳에는 보관하지 마십시 오 1.모이스쳐(중>건성)-200ml, 2.라이트(지복합성)-200ml, 3.센서티브(민감성)-200ml 아모레퍼시픽/아모레퍼시픽 1.모이스쳐(중건성),2.라이트(지복합성),3.센서티브(민감성) 제조사 홈페이지 및 제조사 고객센타로 문의 또는 동봉된 사용설명서 참조 직사광선 | 2 모이스쳐 | 2 중건성 | 2 라이트 | 2 지복합성 | 2 센서티브 | 2 민감성 | 2 아모레퍼시픽 | 2 mecab-ffi 모듈을 통해 어렵지 않게 구현할 수 있었어요. :)

44. 시행착오

45. 시행착오 surrogate pair UTF-16(16-bit Unicode Transformation Format)은 유니코드 문자 인코딩 방식의 하나이 다. 주로 사용되는 기본 다국어 평면 (BMP, Basic multilingual plane)에 속하는 문자들은 그대로 16비트 값으로 인코딩이 되고 그 이상의 문자는 특별히 정해진 방식으로 32비트로 인코딩이 된다. 기본 다국어 평면에 포함되지 않는 문자들, 즉 16비트로 값을 표현할 수 없는 문자들은 서러 게이트(Surrogate) 문자 영역에 해당하는 두 개의 16비트 문자로 변환되어 이 한 쌍(즉 32 비트)이 그 문자를 나타내게 된다. https://ko.wikipedia.org/wiki/UTF-16 문제를 겪고 알게된 surrogate pair

46. 😃 https://www.flitto.com/twitter/158 우리가 흔히 접하는 emoji가 바로 surrogate pair에

47. > var str = ‘안녕하세요반가워요ud83dude03하이'; > str ‘안녕하세요반가워요😃하이’ > str.length str.length 의 값은 몇일까요?

48. > var str = ‘안녕하세요반가워요ud83dude03하이'; > str ‘안녕하세요반가워요😃하이’ > str.length 13 > encodeURI(str.slice(0,10)) URIError: URI malformed at encodeURI (native) … 네 13이에요. 그리고 10번째까지 자르면 스마일 emoji까지 slice되리라 생각했는데 오류가 발생하고 말았어요.

49. > var str = ‘안녕하세요반가워요ud83dude03하이'; > str ‘안녕하세요반가워요😃하이’ > str.length 13 > encodeURI(str.slice(0,10)) URIError: URI malformed at encodeURI (native) … > var decodedArr = punycode.ucs2.decode(str); > var slicedStr = punycode.ucs2.encode(decodedArr.slice(0,10)); > slicedStr ‘안녕하세요반가워요😃’ > encodeURI(slicedStr); 에러안남. https://goo.gl/uZIV7m node.js v0.6 버전부터 포함된 punycode를 통해 decoding한 결과를 사용해서 slice하면 이 문제를 해결할 수 있어요. 좀 더 자세한 설명은 여기에 -> https://t.co/fbehjnz8fQ

50. 시행착오 forEach 안에 비동기코드 엄~~청 많이 동시 실행 시스템 콜스택에도 한계가.. users.forEach(function(user) { 헨리를 팔로우한 전체 유저에게 비동기로 푸쉬 }); async.queue 등을 사용해서 동시 실행되는 비동기코드를 제어 항상 얼마나 많은 양의 코드가 동시에 비동기로 실행되고 있는 지 생각하고 또 생각해야 해요!

51. 시행착오 npm install 했더니 동작이 달라요. 버전올라가면서 변경된 사항 요체크! ex) "sequelize": “latest” sequelize v2하고 v3는 달라도 너무달라요. 모듈이 버전업 되면서 성능향상만 되는게 아니라 사용방법이나 파라미터타입이 바뀌는 경우가 있으니 모듈 릴리즈노트를 잘 살펴야해요!

52. 시행착오 서버는 3년으로 사지말고 aws가 가격인하를 계속 하고 새로운 상품도 나오고 하니 1년단위로.. 예, 그렇다고 합니다. :)

53. 하고싶어요

54. 하고싶어요 es6 es6를 서비스에 도입하고 싶었는데요.

55. 하고싶어요 es6 11/10 신규 feature에 사용 시작!!! 마침 11/10일부터 개발되는 새로운 feature에 class개념부터 반영하게 되었습니다. :)

56. 하고싶어요 Node.js production 적용 좋은 예 되기 오늘 발표 주제가 ‘node.js in production 사용 예’ 였다면 다음에 또 발표할 기회가 있다면 플리토를 꼭 좋은 서비스로 만들어서 ‘node.js in production (킹왕짱) 좋은 예’ 로 발표할 수 있기를… 하고 바라봅니다.

57. 하고싶어요 NPM package 등록 오픈소스 기여 회사 내부에서 만들어서 사용하는 모듈들을 이쁘게 정리해서 NPM package에 등록하고 오픈소스에도 기여하고 싶어요.

58. geoip PR 작은 발걸음이지만, 조금씩 PR도 보내고 머지도 되고 있어요. :)

59. 하고싶어요 평일 Node.js 세미나에 4만원 내고 참여하는당신! 함께 하고 싶어요! 그래요. 정말 당신과 함께하고 싶어요! 그리고, Node.js를 하는 더 많은 개발자들과 소통하고 싶어요! 저는 Node.js를 정말 좋아하고, Node.js로 개발하는게 정말 즐거우니까요. :)

60. 1 2 구인은 1번 구직은 2번 서버 구글에서 ‘이승우 이력서’ 혹은 ‘이승우 이력서 서버’ 를 검색하시면 2개의 슬라이드가 나오는데요. 1번은 제가 구직할 때 만들었던 이력서 슬라이드 2번은 플리토에 입사해서 함께할 팀원을 찾을 때 만들었던 슬라이드에요. 다시 정리하면 여러분은 구인은 1번 구직은 2번 링크를 클릭하시면 됩니다. :)

61. asbubam asbubam @ Flitto.com 감사합니다. :) 발표 들어주시고, 또 이렇게 슬라이드 찾아 봐주셔서 감사합니다. 온 세상 개발자를 다 만나고 싶은 저니까 언제든 편하게 연락주시고, 페이스북 친구도 해주세요! :) 번역이 필요할 때 집단지성 번역 플랫폼 플리토 기억해주시고, 서버, 웹, 앱 개발팀, 마케팅, 기획 전체파트에서 상시 구인 중에 있으니 서비스에 관심이 있으시면, 그리고 저와 함께 일하고 싶으시다면 언제든 연락주세요!