Wany's Talk

This is just something. for me or for you... I use 3 languages. Korean, Japanese and English.

[littlebigdetails]

Gilt.com – When entering your email address in the sign up form, the input field auto completes common domains.

[baepower]

Good UX

[radius-engineering-blog]

Testing AngularJS in a RequireJS environment

Previously I wrote about our RequireJS and AngularJS environment. There I promised to describe our test setup for unit testing using Karma and Jasmine.

Our setup for testing has gone through multiple iterations, just like our application setup, but this post documents an example project which follows our current state.

Before I dive into the details of the setup, I want to touch on a few important points about unit testing, since that is the kind of testing described in this post. A unit test is a self contained test of a single unit. In most cases a unit can be a function or a class. In AngularJS units would be directives, filters, controllers, and services.

The purpose of the unit test is to help document and enforce the behavior and output of the unit given specific input. This serves both as a design aid, by helping you think in more self-contained building blocks, and as a help catching regressions as new features are added. A good unit test will give you piece of mind as you refactor or add to a component, since you have certainty that the output is unchanged for the expected input. This helps minimize the risk of existing functionality breaking.

Keep reading

[baepower]

Ghost with Forever

Installing Forever

npm install -g forever를 사용해서 forever를 인스톨한다. forever는 node의 모듈로서 Ghost를 백그라운드에서 시작할 수 있도록 할수 있고 살아있는지에 대한 모니터를 할수 있다. Ghost가 만약 crash했다면 forever가 자동으로 Ghost의 새로운 인스턴스를 시작한다.

Start Ghost with Forever

다음과 같이 기동을 하며

forever start index.js or forever -f start index.js # stream logs or forever -l /usr/local/var/www/ghost/forever.log start index.js # log to file

config.js에 등록해둔 특정 환경을 지정하여 기동을 할 경우에는 다음과 같이 한다.

NODE_ENV=production forever start index.js

Stop Ghost with Forever

Forever를 이용하여 기동중인 Ghost를 중지할 경우엔

forever stop index.js

[baepower]

Installing nginx in mac os x

Install and Test

brew를 사용하여 설치를 진행하게 된다.

brew install nginx

이렇게 설치가 종료되고

sudo nginx

이렇게 nginx를 기동시켜서 설치가 잘 되었는지를 확인하면 된다.

http://localhost:8080

Configuration

nginx.conf파일은 brew를 통해서 설치했을 경우

/usr/local/etc/nginx/nginx.conf

에 위치한다. 여기서 port변경이라던지 web location의 변경등을 설정할 수 있다. 이렇게 접속하여 nginx의 환영인사를 확인해본다.

[baepower]

MongoDB build in SublimeText

실제 작업을 할때 얼마나 사용할지 의문이 들었었다. 그러나 반심반의로 설정을 한게 의외로 사용할 일이 많아져서 많은 성과를 낸거 같다.

설정

Tools > Build System > New Build System... 을 선택한 뒤, 다음 설정을 넣어서 MongoDB.sublime-build로 저장을 해주자.

{ "selector": "source.js", "shell": true, "cmd": ["/usr/local/bin/mongo < $file"] }

이 설정은 SublimeText2, 3 양쪽에서 설정이 다 되는 것 같다. 아직 3에서는 설정을 안해봤다. 이는 테스트 후에 다시 수정하도록 하겠다. mongoDB operation을 작성한뒤에 ⌘+b로 build할 수 있다.

Screenshot

[baepower]

About pageres

pageres라는 괜찮은 거 발견했다.

뭐하는 녀석?

이녀석은 지정한 resolution으로 지정한 web page를 capture해주는 아주 고마운 녀석이다. command line에서 바로 해당 페이지의 view를 해당 resolution에서 어떻게 보이는지를 확인하고자 할때 유용하게 사용할 수 있다.

pageres github

여기에 사용법과 인스톨 방법들에 대해서 확인하면 될것 같다.

단점

google font를 불러와 사용하고 있다면 이 font가 적용이 안되는 문제가 있다. 이는 앞으로 개선이 되지 않을까 싶다. 이에 대해서는 issue를 등록해둔 상태. 해결해 줄지 말지는 지켜봐? 아님 들어가서 고쳐?

[baepower]

Error when starting Node Application

어찌어찌 dependency가 있는 녀석들을 설치를 하고 나서 grunt로 서버를 띄우는 것까지는 한것 같다. 그런데 여기서부터가 문제였다.

다음과 같은 에러가 발생하면서 crash가 발생하고 있었다.

events.js:72

throw er; // Unhandled 'error' event ^

Error: ENOENT, open '/Users/jp61034/dev/myApp/bower_components/bootstrap/dist/css/bootstrap.css'

[nodemon] app crashed - waiting for file changes before starting...

어리석은 나는 이 원인을 알아내는데 원초적인 원인을 찾아낼 수가 없었다. 왜냐면 bower를 당연히 설치하였다는 전제하에 진행을 하고 있었기 때문이다. 그러나, bower를 설치해둔 mac은 macbookAir쪽이였다.

이후 다시 또 stackoverflow의 힘을 빌려서 해결을 하게 되었다.

$ sudo npm install -g bower

$ sudo bower install --allow -root

이렇게 bower설치후 root권한으로 node서버에서 bower로 설치가 가능하게 된다.

[baepower]

Yesterday was gloomy cloudy rainy day. I hate!!

[baepower]

EverMark 사용하기

이걸 왜 써야하지?

써야할 필요는 없다. 단, Markdown을 사용하여 문서를 작성하고 싶고 그에 따른 결과물을 확인하고 싶다면 추천하고 싶다. 물론 이 결과물을 다시 다른 서비스쪽으로 공유 및 포스트를 할 꺼라면 적극 추천을 하고 싶다. 일단, Evernote는 Markdown을 지원하지 않는다. 뭐 문법을 사용해서 문서를 작성은 할 수 있겠지만 이를 해석하여 결과물을 보여주지는 않는다. 이러한 이유로 인해서 Markdown으로 모든 문서들을 작성하려고 하는 나로서는 이 EverMark는 아주 고마운 오픈소스 App이다.

Install(on Mac)

다음 github에서 압축파일을 받아서 설치를 진행하자. Readme.md를 보면 알겠지만 xcode의 command line developer tools가 필요하다.

xcode-select --install

이렇게 설치를 마치고 다운로드 받은 뒤 EverMark App을 Application쪽으로 옮기자. 그리고 실행을 하면 Ruby로 서버를 띄운다. 이때 (X)HTML parser로 사용하려는게 redcarpet이라는 녀석인데, 만약 다음과 같은 에러를 보게 된다면 가볍게 redcarpet를 설치해주고 다시 실행을 시켜주자.

gem install redcarpet or sudo install redcarpet

이 모든것이 정상적으로 진행 되었다면 브라우져로 localhost:3232로 접속이 이루어지고 Evernote client app에 펼쳐저 있는 Note를 화면에 보여준다.

What next...?

열심히 Markdown을 이용하여 멋진 당신의 아이디어나 정리해야 할 것들을 작성하고 이쁘게 브라우져에서 결과물을 확인하면 된다. 그리고 ...

Version information

0.2일때 이 포스트를 작성하였다.

Evernote가 버전이 올라가면서 0.2가 더이상 동작하지 않게 되자 바로 대응하여 0.3으로 버전업했다. 이전 버전을 삭제하고 다시 0.3을 Application으로 이동시키자. 아마 보안관련해서 바로 실행이 안될테니 시스템 설정에서 아무튼 실행버튼 눌러주자.

[baepower]

Novice의 AngularJS (1) - ng-app vs data-ng-app

쉽다 쉽다 하지만 알아야 할것도 많은 AngularJS.

그 첫번째로 ng-app과 data-ng-app의 차이점은 무엇인지...

이 차이점은 아주 간단하다. 여기엔 HTML5 validators가 에러를 던질지 안던질지의 차이뿐이다. ng-app 프로퍼티의 경우에는 에러가 발생하게 된다. 이런 부분에 아주아주아~주 민감하다면 data-ng-app을 사용하기를 권한다.

참고삼아서 x-ng-app으로 설정을 해보는것도 괜찮을듯 으흐흐흐...

Referance

http://goo.gl/Hh5SBQ

[baepower]

Bye bye, iPhone5!

[baepower]

View this post on Instagram

1st Hyperlapse

[baepower]

How to start mongodb

초보자라 역시 초보자답게 Stack Overflow의 힘을 빌릴 수 밖에 없는거구나. 사실 문서를 차근차근 읽고 난뒤 사용을 하면 되긴 하지만, 성급해서 일단 deamon이 올라와야나 성이 차는 그런... ㅜㅜ

mean.io하나로 뚝딱 다 되는줄로만 알고 있었는데 세상에 간단한거 하나 없다고 여러가지 시련을 던져 주었다.

프로젝트를 생성한뒤 grunt로 빌드를 실행하려고 하면 에러가 발생했다. 이를 해결하기 위해서 grunt-cli를 설치.(이걸 왜 빼먹고 있었을까??)

sudo npm install -g grunt-cli

그런뒤 다시 

grunt

mongodb에 접속하지 못하는 메시지를 보여준다. 

ps -ef | grep mongod

로 확인을 해보자 프로세스가 보이지를 않는다. 음... 왜 안돌고 있지??

여기서 난 Stack Overflow의 힘을 빌리게 된다. 한방에 바로 정답을 발견 고대로 따라하니 아주 잘돌아간다.

brew info mongodb

를 때리는 아주 좋은 정보를 보여준다. 이것도 모르고 있었다는게 부끄러울 정도로...

==> Caveats To have launchd start mongodb at login:   $ ln -sfv /usr/local/opt/mongodb/*.plist ~/Library/LaunchAgents Then to load mongodb now:   $ launchctl load ~/Library/LaunchAgents/homebrew.mxcl.mongodb.plist Or, if you don't want/need launchctl, you can just run:   $ mongod --config /usr/local/etc/mongod.conf

이후 로그인 후에 정상적으로 mongodb는 올라오고 소리없이 잘 돌아가고 있다.

[baepower]

Command line developer tool

Yosemite Developer preview 4의 업데이트로 인해 드디어 드디어 Command line developer tool을 설치할 수 있게 되었다.

매번의 업데이트에서 이를 시도했었으나 마냥 실패만 했었었는데 드디어 다음과 같은 다이알로그를 보여주면서 이쁘게 인스톨을 해줬다. 흐흐흐

그럼 이제 다음으로 해야 할게 뭐지? 시간이 너무 오래지나버려서 까먹었다. ㅡㅡ;

[baepower]

Python과 Django

Python과 Django에 대해서 흥미가 생겼서 이거 저거 뒤져서 나에게 도움이 될만한 자료들과 환경을 구축하고 있다. 이에 대해서 앞으로 생각나는대로 잊어버릴만한 정보들을 끄적이고자 한다. 

일단은 가장 도움이 될만한 YouTube.com에서 CodeEntrepreneurs에서 21회에 걸친 tutorial을 경청하기 시작했다. 많은 도움을 받을 수 있으면 좋겠다. 뭐, 내가 게으름 피지 말고 부지런히 따라가면 문제가 없을텐데... 최대의 적인 게/으/름!

[baepower]

Real time collaboration in Confluence

https://jira.atlassian.com/browse/CONF-8333

이게 과연 언제쯤 기능구현이 가능할지 알수가 없다. 

다음과 같은 긍정적인 comment가 달리기도 했지만... 긍정적으로 바라보고 있어야 할까? 

Brad Copeland added a comment - 07/May/14 10:02 PM

I echo everyone's comments (and passion!). We too need functionality that gives the team the ability to edit simultaneously within the same Confluence space. Let's make it happen, thanks!!

혹시나 이에 대한 멋진 solution이 있다면 꽤 짭짤해보이기도 한다. 음...

[baepower]

Interview questions for Front-end engineers

어제 우연히 github surfing하던 중에 발견한 markdown문서!!

https://github.com/wanybae/front-end-interview-questions

나도 모르게 스타를 눌러주기보다는 fork를 해버렸다. 아무래도 이런 부분에 대해서는 기본적으로 알고 있어야 하기도 하고 English에 대한 부분도 숙지해둬야 할것 같아서...

일단 먼저 fork해뒀으니 번역을 진행해보려한다. (언제 시간내서 할지... 게으른 baepower). 우선은 우선은 우선은 이런 문서를 잘 만들어 둔 @AndyShora 에게 감사의 말을 전한다.