마이크로소프트 감정인식 서비스(Emotion API)

https://www.microsoft.com/cognitive-services/en-us/emotion-api

마이크로소프트에서는 인식에 관련한 서비스들을 제공중입니다.
여러가지 인식 서비스가 있는데
Vision, Speech, Language 이렇게 세개의 파트로 나눠집니다.



그 중에 얼굴 감정인식 기능인 Emotion API를 잠깐 소개드리려고합니다.
아래서 데모를 할 수 있는데 데모 먼저 보겠습니다.


얼굴 표정에 대해서 분석을하고 그 결과값을 JSON 데이터 형식으로 보내줍니다.
각각 anger, contempt, disgust, fear, happiness, neutral, sadness, surprise
분노, 경멸, 혐오, 두려움, 행복, 감정자제, 슬픔, 놀람 이렇게 구분되어 데이터를 보내줍니다.

개발에 필요한 감정 API의 문서는 아래에서 보실 수 있습니다.
https://dev.projectoxford.ai/docs/services/5639d931ca73072154c1ce89/operations/563b31ea778daf121cc3a5fa

Get Started는 C#, Python이 있네요.
C# : https://www.microsoft.com/cognitive-services/en-us/Emotion-api/documentation/GetStarted
Python : https://www.microsoft.com/cognitive-services/en-us/Emotion-api/documentation/GetStartedWithPython

이 감정인식 서비스로 한번 재미있는 앱을 만들수 있을 것 같습니다.
가격 정책은 아래와 같으니 참고하세요


한달에 3만번 정도는 무료로 사용할 수 있네요.
비디오 분석은 한달에 300번 업로드, 비디오 쿼리 분석은 한달에 3000번이네요.
무료로 사용하는 만큼만 재미있게 만들면 좋겠네요 ㅎㅎㅎ

AMP의 지금까지의 성과와 현주소

구글코리아 블로그 : http://googlekoreablog.blogspot.kr/2016/10/amp.html

AMP 로드맵 : https://www.ampproject.org/roadmap/

안드로이드 퍼포먼스 패턴 - Youtube 영상들

https://www.youtube.com/playlist?list=PLWz5rJ2EKKc9CBxr3BVjPTPoDPLdPIFCE
좋은 영상모음이네요.
계속 보고 있는데 재미도 있고 개념설명도 잘 되어있습니다.

즐거운 개발 공부!

GitHub profile page가 이뻐졌어요!

원래는 어땠는지 스크린샷을 찍어 놓지 못해서 비교하기가 힘들지만
프로젝트의 정보를 한눈에 이쁘게 볼 수 있게되었습니다.

밑에는 어떤 기여를 했는지 정리해서 볼 수 있네요.


이번 업데이트에는 다른 것들도 추가가 되었는데
프로젝트 안에 칸반 스타일 보드를 추가해서 트렐로(Trello) 처럼 할 일, 이슈를 관리 할 수 있게
Projects 탭이 추가되었습니다.


관련 동영상은 아래에!

깃헙과 함께 즐거운 오픈소스 기여를!

스트레스 테스트 툴 - Artillery

https://blog.outsider.ne.kr/1238
아웃사이더님의 블로그를 보고 Artillery 툴이
ab(apache benchmark)보다 뭔가 더 좋은 것 같아서 한 번 공부해봅니다.



이 툴을 테스트해보고 싶었던 가장 큰 이유는
report라는 기능으로 테스트 결과를 html 파일로 보기 좋게 만들어주는 기능이 있기때문..!

한번 테스트해보겠습니다.

1. 설치
$npm install artillery -g

2. 퀵 테스트 실행
$artillery quick -d 60 -r 10 http://pineoc.blogspot.com

Log file: artillery_report_20160912_130365.json
Phase 0 started - duration: 60s

Report for the previous 10s @ 2016-09-12T04:04:09.912Z
  Scenarios launched:  99
  Scenarios completed: 95
  Requests completed:  194
  Concurrent users:    4
  RPS sent: 19.92
  Request latency:
    min: 168.8
    max: 623.9
    median: 188
    p95: 236.5
    p99: 504.6
  Scenario duration:
    min: 473.9
    max: 941.3
    median: 517.2
    p95: 718.9
    p99: 921.6
  Codes:
    200: 96
    302: 98
... 생략
밑에 쭈욱 로그가 나옵니다.

파일이 만들어졌다고 나왔네요. 한번 들여다보면,


이렇게 데이터가 14000줄 정도 나옵니다.
한번 report 명령어로 리포트 뽑아보겠습니다.

3. 리포트 만들기
$artillery report

이렇게 html이 바로 짠하고 나옵니다.





각각의 그래프에 마우스 커서를 올리면 데이터도 확인해볼 수 있구요.
실제로 서비스 개발할 때도 사용해봐야겠습니다.
굿굿

Cocos2d-x 3.13 버전 이슈

자주 코코스2dx 쪽 저장소를 들여다 보곤하는데
3.13 버전에서 문제가 몇 개 있나봅니다.

마일스톤이 하나 올라와 있네요.



3.13.1 버전의 마일스톤이 있습니다.
모두 해결이 된 상태라고 하는데 조만간 업데이트 해야겠군요.
무슨 문제가 있었는지 한 번 볼까요.



문제점을 나열해보자면
1. 3.13버전에서 디자인 resolution을 정해주지않으면 앱이 죽는다.
2. text color가 안먹힌다.
3. 안드로이드의 경우, 앱을 백그라운드에서 아이콘을 눌러서 다시 시작하면 죽는다.
4. 자바스크립트의 경우, jsval_to_std_string이라는 함수에 문제가 있었음.
5. 3.13 안드로이드 OpenSLES 에러, 배경음악 파일이 특정 경로에 있을때 재생하면 에러남.
6. 안드로이드 경우, AudioEngine::stop() 이 finished 콜백함수를 부르는데 문제

다 고쳐진 것 같습니다. 위의 마일스톤을 봤을때는요. ㅎㅎ

아직 다운로드 링크는 3.13.1로 안올라간거 같은데 조만간 올라오지 않을까 싶습니다.
즐거운 게임 개발되시길 바라요~

Cocos2d-x fork한 저장소 원래 저장소에서 업데이트 받기

fork한 내 저장소를 현재 내가 작업한 내용과 충돌난 경우
저장소에서 그냥 강제로 업데이트해야 할 경우가 있습니다.

저는 아래와 같이 업데이트를 진행해보았습니다.
(다른 저장소의 경우도 아래와 같이 진행해주시면 됩니다)

$ git fetch --all
$ git reset --hard cocos2d/v3
$ git pull cocos2d/v3

원래는 origin/v3 이렇게해야 하는데
cocos2d/v3 한 이유는 리모트 저장소에서 불러와야 하기 때문입니다.

$ git remote -v 하면 아래와 같이 나옵니다.

cocos2d https://github.com/cocos2d/cocos2d-x.git (fetch)
cocos2d https://github.com/cocos2d/cocos2d-x.git (push)
origin https://github.com/pineoc/cocos2d-x.git (fetch)
origin https://github.com/pineoc/cocos2d-x.git (push)

아래 2개는 제 포크한 저장소이고
위에 2개는 리모트 저장소입니다.

위의 리모트 저장소로 fetch를 하고 pull을 해야하는 것이지요.

그리고 cocos2d-x는 서브모듈이 있어서 업데이트 해줘야합니다.
$ git  submodule update

이렇게 업데이트 끝!

다시 cocos2d-x 에 커밋하러 갑니다~

즐거운 개발 되시길바라요 ㅎㅎ

영어 스펠링 체크하기 - codespell

https://github.com/lucasdemarchi/codespell

오픈소스 프로젝트 기여하기에는 여러가지 방법이 있는데요.
저는 일단 영어 스펠링 틀린 것 수정하기부터 시작해보았습니다.

여러가지 스펠링 체크해주는 툴이 있는데
저는 현재 맥북을 사용하고 있으니
리눅스 스펠링 체크 툴을 찾아봅니다.

그 전에 찾아서 사용했던 툴 중에 하나가
codespell이라는 툴입니다.

깃헙에서 다운받아서
bin/codespell.py를 사용하시면 됩니다.

디렉토리로도 찾을 수 있고
틀린 것을 바로 수정하는 -w 플래그만 주면 수정할 수 있습니다.



cocos2d-x 스펠링 체크해본 결과입니다.
필요한 부분만 수정해줘야할듯하네요. 변수명은 두고 주석만 수정해야겠습니다.



이렇게 하면 다 수정되어버리는데,
수정되면 안되는 것은 git 명령어를 통해서 ignore 처리하고 커밋합니다.
(다른 명령어 처리방법도 있습니다만 저는 이렇게...)

이렇게 기여하고, 코드 보고 이해하다보면
실제 로직에 참여할 수 있습니다.
모두 화이팅!

Vorlon.JS - 원격 자바스크립트 디버깅 툴

Homepage: http://vorlonjs.com/
GitHub: https://github.com/MicrosoftDX/Vorlonjs/

원격 자바스크립트 디버깅 툴 이라고 설명은 적어놓았지만
제대로 된 설명은 아래와 같습니다.

"An open source, extensible, platform-agnostic tool for remotely debugging and testing your JavaScript. Powered by node.js and socket.io."

플랫폼에 종속되지 않고 원격으로 자바스크립트를 디버깅, 테스트가 가능한 툴.
(Node.js 와 Socket.io 를 이용함)

현재 버전은 0.3.0 입니다.
앞에 버전 번호가 0 인걸로 봐서 아직 개발이 활발히 진행중인
프로젝트인 것 같습니다.

실제 데모 영상은 다음 링크에 있습니다.
http://www.vorlonjs.com/#demo (유튜브에 올라가 있지 않아서 직접 눌러서 보셔야할 듯 합니다.)

- 설치
$npm install -g vorlon

- 실행
$vorlon

실행 전에 해당 웹 앱 페이지에 스크립트 코드를 넣어주셔야합니다.
<script src="http://localhost:1337/vorlon.js"></script>

이렇게 하면 vorlon에서 사용하는 socket.io에 연결되어서
디버깅, 테스트를 진행 할 수 있습니다.

현재 진행하는 Cordova나 웹 페이지 개발에
테스트, 디버깅에 한번 사용해봐야겠습니다.

CSS Selector 공부하기 좋은 사이트 - CSS Diner

http://flukeout.github.io/

CSS Diner라는 사이트인데요.
깃헙 페이지를 통해서 퍼블리싱한 사이트입니다.

CSS Selector를 게임처럼 배울 수 있는 곳 입니다.
enter 버튼이 보이는 줄에 들썩들썩 움직이는 녀석들을
골라 낼 수 있는 코드를 넣어 주면됩니다.



접시에 마우스를 가져다 대면 그 움직이는 물체의 컴포넌트를 볼 수 있습니다.
지금은 접시가 움직이고 있으니
plate라고 입력하고 enter!

다음으로 넘어가면,


bento 박스만 골라내라고 하네요.
이런식으로 움직이는 물체들을 골라내고 enter로 진행하면서
CSS Selector를 공부하게 됩니다.

즐거운 공부가 되겠네요.
즐거운 개발 되시길 바라요~

ReactJS 강좌 - Velopert 강좌

https://velopert.com/

유튜브 강좌 : https://www.youtube.com/playlist?list=PL9FpF_z-xR_GMujql3S_XGV2SpdfDBkeC



시작하기에 좋은 강의인 것 같습니다.
굿굿

JavaScript Standard Style - 자바스크립트 코딩 스타일(컨벤션) 체크 툴

http://standardjs.com/

최근에 자바스크립트 공부를 하면서 느꼈던게 있었는데
코딩 컨벤션, 코딩 스타일에 대한 것이었습니다.

에어비앤비에서 깃헙에 올렸던
자바스크립트 코딩 스타일 가이드 문서 라던지,
https://github.com/airbnb/javascript

구글에 있는 자바스크립트 코딩 스타일 가이드도 봤었습니다.
https://google.github.io/styleguide/javascriptguide.xml

제 코드에서 조금씩 조금씩 바꿔보긴 했는데
힘들어서 자동툴 같은 것이 없을까해서 찾아봤는데
역시 누군가가 잘 만들어놨습니다.
(제가 한번 만들어보고 싶었는데 나중에 한번 만들어봐야겠습니다.)

위에 있는 스탠다드JS가 그 툴을 만든곳이고
그 툴의 이름이기도 합니다.

깃헙 주소는 https://github.com/feross/standard

사용법은 쉽습니다.

1. 설치
$npm install standard -g

2. 사용
자바스크립트로 작성중인 프로젝트의 디렉토리에 가셔서
$standard

그럼 각 라인별로 확인을 해서 기준에 맞는지 틀리는지 체크합니다.

결과는
/Users/pineoc/Desktop/project/server/app.js:1:33: Extra semicolon.
  /Users/pineoc/Desktop/project/server/app.js:2:27: Extra semicolon.
  /Users/pineoc/Desktop/project/server/app.js:3:5: 'favicon' is defined but never used
  /Users/pineoc/Desktop/project/server/app.js:3:39: Extra semicolon.
  /Users/pineoc/Desktop/project/server/app.js:4:31: Extra semicolon.
  /Users/pineoc/Desktop/project/server/app.js:5:44: Extra semicolon.
  /Users/pineoc/Desktop/project/server/app.js:6:40: Extra semicolon.
  /Users/pineoc/Desktop/project/server/app.js:7:5: 'fs' is defined but never used

이런식으로 쭉해서
출력이 너무 많이 나와서 파일로 출력해봤습니다.

$standard > standard.out

그랬더니...
출력 라인수가 17828!
(파일 라인 확인하는 방법은 $wc -l [filename] 입니다.)

많이 고쳐야겠네요.. ㅎㅎ

아, 그리고 이 스타일 체크는 아래와 같은 기준으로 합니다.

/* 깃헙에 있는 룰을 가져왔습니다.*/

Rules

• 2 spaces – for indentation
• Single quotes for strings – except to avoid escaping
• No unused variables – this one catches tons of bugs!
• No semicolons – It's fine. Really!
• Never start a line with (, [, or `
  • This is the only gotcha with omitting semicolons – automatically checked for you!
  • More details
• Space after keywords if (condition) { ... }
• Space after function name function name (arg) { ... }
• Always use === instead of == – but obj == null is allowed to check null || undefined.
• Always handle the node.js err function parameter
• Always prefix browser globals with window – except document and navigator are okay
  • Prevents accidental use of poorly-named browser globals like open, length, event, and name.

PS. Node.js 프로젝트에 적용한 것이지만
어느정도 골라서 수정이 필요할 것 같습니다.

GitHub Explore

Github Explore

Today, i will show you GitHub function 'Explore'

In GitHub homepage,
login, and you can see this page.

click your avatar image,
you can see this dropdown menu.

this menu have some functions,
i will show you one of these.
Explore









Explore page
this page show you what project most interesting and issued (famous)
In this time, we can see projects. Machine Leaning, Software development tools, Game Engines, Universal 2nd Factor, so on.

You can see the Trending repo this week.
And you can see starred repo ranked this week.

I hope my repositories are most starred some time or other.

end of my today learning.

blogger에 google analytics 달기

blogger에 google analytics 달기

블로그에 방문자와 다른 데이터를 얻어보고싶어서 google analytics를 달아보기로 했다.

단순히 설정에서 구글 아날리틱스 값을 넣으면 될줄 알았지만

<- 여기에 설정하는게 있긴하다


이것만 설정해줘야 하는게 아니라

템플릿 메뉴에서

HTML 편집을 누르고 들어가면

코드를 입력할수 있는 곳이 나온다.

코드는

구글 아날리틱스(Google Analytics, https://www.google.com/analytics/) 에서

계정을 만들고 속성을 만든 뒤에 나온 코드를 삽입하면된다.

자세한 사항은

친절한 구글 설명서가 있으니 참고하시면 된다.

https://support.google.com/analytics/answer/1008015?hl=ko

(친절한지는...)

코드를 삽입하고 나서 저장을 한다.

그러고 나서 페이지에 들어갔다가 나와서

구글 아날리틱스를 확인해보면...

실시간은 어떤가 보자

나 한명 들어와있다.

이렇게 Blogger 블로그에 구글 아닐리틱스(Google Analytics)를 장착해보는 방법을
알아보았다.

다른 블로그에는 구글 아날리틱스를 어떻게 사용할까에 대한 글이 많은데
나중에는 더 공부해서 어떻게 사용할까를 어떻게 사용했다라는 걸 쓰고 싶다.

Swiper 라이브러리에서 유튜브 동영상을 넣을때 이슈(1)

Cordova 기반으로 한 하이브리드 앱을 만들고 있다.
Swiper를 사용하고있고 그 안에 유튜브를 넣어서 앱을 표현하려 하고 있다.

신기한건
코르도바 문제인지 Swiper 문제인지 동영상 재생버튼을 누르면
Swiper 뷰 내부에 있는 녀석들이 왼쪽으로 움직이는 것이다.

이 문제에 대한 의심(?)은

1. Cordova viewport 문제
2. Swiper에서 동영상 로딩이나 그안에 객체에 대한 문제
3. embed 태그의 문제
4. etc

이런 이슈를 해결하기위해 문제, 분석, 해결의 과정으로 가보려 한다.

문제 >
동영상 재생버튼을 누르면
Swiper 뷰 내부에 있는 녀석들이 왼쪽으로 움직이는 것이다.

분석 >
1. Cordova viewport 문제,
         - viewport가 유튜브 동영상 재생시 width 값이 증가해서 왼쪽으로 오브젝트들이
         움직인것이다.
         - 그러나 log로 window.innerWidth를 확인해보니 값이 같았음.
         - 1의 추측은 아닌듯.
2. Swiper에서 동영상 로딩이나 그안에 객체에 대한 문제
         - 오브젝트들의 위치, Swiper 객체의 activeIndex를 보니 다른 뷰로 움직인것은 아님.
         - 오브젝트들이 왼쪽으로 갔는데 Swiper의 유효한 범위 밖으로도 나감.
         - 이 이유라면... 아직은 모르겠음.
         - 제일 의심되는 부분
3. embed 태그의 문제
         - 동영상 실행시 Swiper빼고 cordova에서 문제가 생기는지 확인이 필요해 보임
4. etc
         - 다른 예상치 못한 부분이 있을수도 있음.

신기한건 앱을 실행시키고 조금 기다리면
옆으로 넘어가는 문제는 없는데
어느 부분에서 그러는건지 조금 더 분석이 필요함


해결 >
내일 더 분석해보고 다음포스트에 계속

2015-04-20 공부

Vagrant : CLI 방식의 간단한 가상화 프로그램
 virtualbox, vmware의 GUI 방식이 아니라 vargrantfile을 이용해서 세팅,
 파일에 있는 세팅 내용을 통해서 가상환경을 구성한다.

  //docker clustering에 대해서 찾아보면 coreos-vagrant가 있는데
  //주로 vagrant를 이용해서 coreos를 클러스터링 하는 것 같다.
  //아직 써보지는 않았지만 어렵지 않게 쓸 수 있겠다.
  //하지만 vagrantfile 작성하는게 익히는데 좀 걸리지 않을까 싶다.
  //기본 box : http://www.vagrantbox.es/

//vagrant up 할때, 경로에 한글이 있으면 안됨.(ASCII 설정 오류라고 뜸)


CoreOS - etcd : 클러스터링할때 그 안에 있는 놈들 파일 동기화하는데 좋은 성능을 보여주는 프로그램이라고 한다.
로드를 분산하는데 쓰이는 클러스터링에서 서버의 동기화가 필요하기에 사용 되는 듯.

  //현재 팀에서 서비스에 Docker 이용해서 하려 하는데 맞지 않는 느낌.
  //동기화보다는 이미지를 어떻게 관리해서 사용자가 자신의 블록 세트를 만든 것을
  //바로바로 제공해주고 결과물을 줄지 생각해봐야 할 듯.

Zookeeper : Apache 재단에서 만든 프로젝트로 클러스터링,
분산 코디네이터로 주로 사용되는 분산처리를 관리하는 시스템을 말한다.
특징은,
1. 네임서비스를 통한 부하분산
2. 분산락이나 동화 문제 해결
3. 장애상황 판단 및 복구
4. 환경설정 관리
주키퍼는 다중의 서버의 집합을 묶어서 관리해주는 시스템.
하나의 서버에서 처리가 되어 데이터가 변경되면 모든 서버에 전달되어 동기화.
#주기퍼는 하나의 분산처리 서버이다.