137 deview

Popular Convention 개발기

Outsider2013.10.14 at Deview 2013

Outsider코딩을 좋아하는 프로그래머

아이디어Proof of Concept

실제 구현

서비스

대회 결과 공지 후

리팩토링

PopularConvention?

Github의 코드를 기반으로

코딩 관례를 분석

Github Data Challenge II

https://github.com/blog/1544-data-challenge-ii-results



메인 페이지 18위

Hacker News

아이디어

Github 데이터 챌린지 공지

https://github.com/blog/1450-the-github-data-challenge-ii



http://www.flickr.com/photos/photoloni/6321527653/

만들어 볼만한아이디어가 없을까?



Github에는 엄청냔 양의 코드가 있으므로 잠재력이 높다

http://dailyjs.com/2012/12/24/javascript-survey-results/



Github에 실제 코드가 있는데

코딩 관례를 설문조사로 할 필요가 있을까?

Proof of Concept

http://www.flickr.com/photos/morberg/3842815564/





Github 타임라인으로 분석할 수 있는가?








API로 분석할 코드를 얻을 수 있는가?







API로 분석할 코드를 얻을 수 있는가?

코드를 기반으로 관례를 분석할 수 있는가?





초기에는 세부사항을

무시하라

Google BigQuery

사용해 본적 없음.

인증 어려움.

불필요한 과정에 시간 소비.

http://www.flickr.com/photos/jezpage/4259659744/





구글의 Ilya Grigorik

매 시간마다 타임라인이 JSON 파일로 올라옴

$ wget http://data.githubarchive.org/2013-10-14-10.json.gz

http://www.githubarchive.org/



Github Archive에서 JSON 파일 다운로드


mongoimport로 MongoDB에 임포트



타임라인의 PushEvent 추출



타임라인의 PushEvent 추출Push의�� 담긴�� Commit�� 정보가�� 담겨있다




Github commits API로 커밋 내용 확인

Push의�� 담긴�� Commit�� 정보가�� 담겨있다




Github commits API로 커밋 내용 확인커밋의�� patch�� 내용이�� JSON에�� 담겨있다





Github commits API로 커밋 내용 확인

JavaScript 파서로 코딩 관례 분석

커밋의�� patch�� 내용이�� JSON에�� 담겨있다


가능하겠는데...

여기서 잠시 샛길로...

개인 프로젝트는 보통 학습의 목적

http://www.flickr.com/photos/lethaargic/3660097148/



보통 끝이 나지 않는다

아키텍처 설계도 많은 고민 후

테스트 코드를 철저히

http://www.flickr.com/photos/mattijn/4103100036/

이렇게 하는게 과연 좋은가?



제약을받아들여라

30여일 정도의 프로젝트 기간

기능과 시간에 대한타협이 필요

http://www.flickr.com/photos/tacoekkel/2770755895/





실제 구현

Server-side

d3.js

Client-side

Goals

만들어진 데이터를 다른 사람들에게도 의미있는가?

코딩관례 분석으로 의미있는 데이터를 만들 수 있는가?


JSON 파일 MongoDB에 임포트



작업 목록 컬렉션에 추가




배치로 작업목록에 있는 타임라인을 처리





Commits API로 지원하는 언어이면 파싱






커밋별로 관례의 점수를 매긴 후 디비에 저장






커밋별로 관례의 점수를 매긴 후 디비에 저장

한시간의 데이터를 언어별로 합산

핵심만 간단히 구현

코딩관례 분석은커밋에서 추가된라인을 기준으로

JSON 다운로드/타임라인처리등은수동으로 시작파일 전체 소스 분석을 하

면 커밋마다 관리해야 한다전체 소스의 파싱은 작업이 너무 크다

삭제된 라인은 의미없음

파서 구현 언어별로 별도로 구성 정규식으로 단순 비교 해당 패턴에 맞으면 +1 파서만 테스트 코드 작성 전체 완성후 다른 언어를 추가

Java Scala Python

http://www.flickr.com/photos/newtown_grafitti/5243248959/

해결해야 할 어려움





API 갯수 제한 문제

Github는 인증한 경우 시간당 5,000 API 요청

한시간에 PushEvent가 2~3,000개

하나의 PushEvent에 다수의 commit이 존재

파일 종류라도 알아내려면 commits API 필요

Star, fork 기준으로 정렬해서 API 갯수 만큼만 처리

실 데이터로 인한 오류

오류의 원인을 찾기 어려움

API 제한 갯수를 초과하면 갱신을 기다려야 함

파싱에서 오류 발견되면 데이터를 리셋해야 함

서비스 로직이 너무 복잡해짐

d3.js를처음 사용함

http://www.flickr.com/photos/honestlyspeakin/8658496702/



내가 생각한 D3.js

내가 만든 D3.js

써보고 싶은 욕심

약간 가벼워 보이는 Flight 선택

불필요하게 원페이지 사이트로 작성함

결국 오픈후 제거함

데이터의선형적인 증가

http://www.flickr.com/photos/78428166@N00/3829063385/

http://www.flickr.com/photos/78428166@N00/3829063385

http://www.flickr.com/photos/78428166@N00/3829063385

매 시간마다 하나의 도큐먼트가 생성

정확한 커밋 수 파악을 위해 Sha를 모두 보관

MongoDB 문서 한계인 4MB 초과로 오류 발생

Map-Reduce를 도입

데이터가 쌓일수록 처리시간이 오래 걸려서 캐싱 추가

서비스

심사를 받기 위해 데이터가 필요하므로

일주일정도 데이터를 쌓음

제출후에는 모든 배치를 멈춤

약간 기대?

대회 결과 공지 후

5월 20일 경 발표 예정실제 발표는 6월 27일

Node.js CPU 100%MongoDB CPU 100%

http://www.flickr.com/photos/neoporcupine/1866929252/



성능 테스트를 제대로 하지 않음

더이상 데이터를 쌓지 않으므로 사실상 정적 페이지나 마찬가지

nginx

Node.jsWAS

nginx

Node.jsWAS

Varnish

미리준비하자




코드 수정은 직접 해야 한다http://www.flickr.com/photos/scallau/4767358384/

http://www.flickr.com/photos/scallau/4767358384/

http://www.flickr.com/photos/scallau/4767358384/

리팩토링

잘 해놓고 기회를 날려버린 건 아닌가?

모델링을 다시해서데이터 양을 줄임

Ruby, C# 추가

공지 추가

http://www.flickr.com/photos/ralphandjenny/460698734/

고객 대응은 중요하다



haackedd의 블로그 포스팅 후

0

7500

15000

22500

30000

1w 2w 3w 4w 5w 6w 7w 8w 9w 10w 11w 12w 13w 14w 15w 16w

Github의�� 발표

해외�� 블로그에서�� 소개됨

방문자

81174189

575

262

151

54

900

451

325

135

325발표 2주 후 현재

모래 사장에 나무 막대기만 갖고도 많은 일을 해낼 수 있습니다.

아이디어만 있다면 말이죠..

- Alan Kay

Question

?@[email protected]

137 deview

Documents