'전체'에 해당되는 글 169건

  1. 2012/05/15 [세계최초] Mac(맥)에서 Diablo3(디아블로3) 정식판 한글판 하기!! (15)
  2. 2012/05/04 코딩하기전 생각하는 습관을 가져라.
  3. 2012/03/16 brew가 실행은 되지만, 권한 문제로 실행이 안될때
  4. 2011/07/20 DIY 키보드 고치기
  5. 2011/07/12 Mac Terminal에서 Home, End키 쓰기. (4)
  6. 2011/06/15 devise에서 sign_out시 서버가 기절할 경우. (Ruby Or Rails Bug인듯) (2)
  7. 2011/06/13 [1원팁] routes에서 as 사용하기.
  8. 2011/06/02 Xcode4에서 범용으로 쓸 수 있는 library만들기. (1)
  9. 2011/05/19 Rails 3.1 Overview (2)
  10. 2011/05/02 TextMate 숨어있는 편집 기능 사용하기 및 단축키 몇가지
  11. 2011/03/31 Xcode4 불편한점. (1)
  12. 2011/03/24 Accessibility for iOS #2 iOS에서 지원하는 접근성들. (3)
  13. 2011/03/23 Accessibility for iOS #1 들어가며. (2)
  14. 2011/03/17 CSS for iPad Orientation (화면회전)
  15. 2011/03/14 XCode4에서 App 등록하기. (30)
  16. 2011/03/14 CSS for Retina Display (background) (1)
  17. 2011/03/04 UXCampSeoul 2011을 진행하면서 느낀 아쉬운점.
  18. 2011/02/22 압박감. (2)
  19. 2011/02/01 언제까지 restful-authentication을 쓸것인가! devise도 써보자!
  20. 2011/01/28 간만에 Rails왔더니 Rails3로 업데이트가... #1 (2)
  21. 2011/01/14 살다보니 제가 만든 앱이 앱스토어 첫번째로 등장하는 날이 오는군요;; (2)
  22. 2010/08/09 "시스템 루트" 키체인을 수정할 수 없습니다.
  23. 2010/07/22 [1원 팁] 투명 뷰 만들기.
  24. 2010/07/05 [1원 팁] SQLite에서 뽑은 값을 NSString을 전역변수로 쓰기.
  25. 2010/06/28 UINavigationController를 이용해서 pushViewController했는데 Rotate가 안될때..
  26. 2010/04/30 아이폰 앱개발시 코드는 문제 없는데 이유를 알 수 없는 에러가 날때.. (7)
  27. 2010/01/27 UX를 악용하여 낚시하는 UI를 너무너무 사랑하는 오픈마켓 (3)
  28. 2010/01/09 헤딩 제대로 사용하기. - 후편(완)- (3)
  29. 2010/01/06 헤딩 제대로 사용하기(시멘틱 마크업하기). -전편- (2)
  30. 2009/10/08 UX에 관심이 많고 소셜서비스에 관심이 많으며 빅브라더에 관심이 있는 사람이라면 볼만한 영화. "게이머"
궁시렁*22012/05/15 01:38

하.. 힘들었습니다!! ㅋㅋ

저 성공하고, 게임도 안하고 포스팅 하는겁니다. ㅋㅋㅋ

포스팅 다 했더니.. 일거리가..... -ㅅ-;

그냥 디아3나 할껄 -ㅅ-;;


1. 인스톨러 다운로더 다운받기

 http://www.reddit.com/r/Diablo/comments/qxyxm/diablo_3_windows_and_mac_download_links_all/ 에서 enUS 다운받기


(헛. 스샷을 윈도우용으로 떴었군요! 죄송합니다!)

디아블로 오픈한 5월 15일 기준 링크: http://eu.media.battle.net.edgesuite.net/downloads/d3-installers/589acdb4-c660-318a-b993-01528fad7da6/Diablo-III-8370-enUS-Installer-downloader.app.zip


2. 인스톨러 다운받기.

다운받은 인스톨러 다운로더를 실행합니다.




3. 인스톨러 실행

인스톨러를 실행해서 디아3를 설치를 합니다.



제가 맥이 한대 더 있는데, 거기서 해보니 4번은 건너뛰어도 상관없네요.

해킹하느라 고생했는데... 쩝;;

암튼 바로 6번으로 가시면 됩니다!


4. .agent.db

디아3를 설치한 디렉토리로 이동을 해야 하는데, Finder쓰시면 안됩니다. Terminal을 이용해야 합니다.

cd /Applications/Diablo\ III

mate .agent.db

그리고 나서 .agent.db 를 수정하셔야 합니다.

개발자분들은 vi로 수정하시면 됩니다. 저의 경우 textmate를 사용하기 때문에 textmate를 이용했습니다.

일반인분들은, textmate를 다운받으신 후 아래 캡쳐해드린것 그대로 하시면 됩니다.

textmate가 열리면서 해쉬구조뭔가 요상한 기호와 글자의 파일이 열립니다.

거기서 체크된 부분을 스샷한 대로 수정하시면 됩니다.


자 거의 다 왔습니다. 조금만 힘을 내세요.


5. 한글판 데이터팩 다운받기

우선 디아3를 실행 시킵니다.

그러면 한글로 된 런쳐가 우릴 반겨주고, 한글판에 맞는 데이터팩을 다운받게 됩니다.



6. 언어세팅 바꾸기

하지만 정작 게임을 실행시키면, 영문판이고.. 로그인을 하면..

너네나라껄로 접속하셈

이라는 메세지가 뜹니다. ㅋㅋ


당황치 마시고, 일단 OK 누르시고

좌측의 OPTION이 있습니다. 이거 누르시고

ACCOUNT 가시면 언어 선택이 있는데, 여기서 KOREAN 선택하시면 끝!! 입니다.

4번을 건너뛰신분은, 자동으로 한글 데이터팩을 받습니다. 즉 5번이 수행이 되는거죠.

자, 그럼 어디 잘 실행되는지 볼까요?



ㅋㅋㅋ 잘됩니다. ㅋㅋ

제가 와우할때 쓰던 케릭명인 "주사위는천로우"로 만들었습니다.

혹 저 보시면.. 죽이지 마시고 버스나 택시나 적선이나..

하다못해 고맙다는 인사정도는 해주세요. ㅋㅋㅋ


크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/202 관련글 쓰기

댓글을 달아 주세요

  1. Gina

    정말 정말 정말 감사 합니다 ><
    근데 하나 궁금한게 있는데요
    맨 처음 캡쳐 사진에 표시하신대로 윈도우용 클라이언트를 받는게 맞나요?

    2012/05/15 04:02 [ ADDR : EDIT/ DEL : REPLY ]
  2. 구루구루파마

    정말 감사합니다!!! 이런 포스팅을 기다리고 있었습니다~! 세계 최초 맞구요! 맞습니다!!

    2012/05/15 05:34 [ ADDR : EDIT/ DEL : REPLY ]
  3. 역시 천재...

    2012/05/15 11:31 [ ADDR : EDIT/ DEL : REPLY ]
    • 문입니다. 제가 일본에 살고 있는데 맥을 사용하고있습니다. 영판을 다운받고 설정 언어선택에서 한국어로 설정하면 자동으로 한글판으로 바꿔진다는 말씁이신가요? 제가 한국 휴대폰을 갖고 있지 않아서, 인증을 못하는 관계로

      2012/05/21 03:16 [ ADDR : EDIT/ DEL ]
  4. kim3447287

    아,,,,, 이런걸왜,,,,,,, 님때문에 대학교수업 이제 못나오잖아욬ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 수고하셨습니다!!!!

    2012/05/15 13:47 [ ADDR : EDIT/ DEL : REPLY ]
  5. kim3447287

    죄송해요! 질문입니다. 제가 일본에 살고 있는데 맥을 사용하고있습니다. 영판을 다운받고 설정 언어선택에서 한국어로 설정하면 자동으로 한글판으로 바꿔진다는 말씁이신가요? 제가 한국 휴대폰을 갖고 있지 않아서, 인증을 못하는 관계로 북미계정을 가지고있습니다. 요약하자면, 북미계정으로 영판을 다운받고 4번을스킵하고 언어설정에서 KOREAN으로 바꾸면 자동으로 한글판이 된다는 말씁이신가요?

    2012/05/15 13:55 [ ADDR : EDIT/ DEL : REPLY ]
  6. 클락

    와우~ 우연찮게 검색하다 보고서는 여기저기 알려주고 있어요~ 멋지십니다~ ^_^

    2012/05/15 17:07 [ ADDR : EDIT/ DEL : REPLY ]
  7. ..

    영문판으로 설치중에 에러가 발생해서 중단됩니다..

    2012/05/15 20:48 [ ADDR : EDIT/ DEL : REPLY ]
  8. ....멍미

    근데 아이디는 블리자드 아이디로 들가는건가요??
    이거 베넷은 되요? 싱글인가요..?
    아이디도 사야되는건가..;;

    2012/05/15 23:37 [ ADDR : EDIT/ DEL : REPLY ]
  9. 이런..

    맥은 한글판 인스톨러 버전에서 지원하고 있습니다.
    한글판 윈도우용 설치 버전 다운로드 받게 되면 맥용 실행 파일도 같이 들어있구요 그거 설치하면 다른 설정 없이 바로 맥용 설치 됩니다... 쉬운 방법이 있으니 참고하세요

    2012/05/16 01:26 [ ADDR : EDIT/ DEL : REPLY ]
  10. 맥스

    좋은 정보 감사합니다. 4번항목은 하지 않아도 잘 되네요.. 그리고 6번 항목에서 언어바꿀때 꼭 지역을 아시아로 먼저 바꾼다음에 언어를 한국어로 설정해야 한글판으로 적용되서 추가파일을 받아서 실행됩니다.

    2012/05/16 15:18 [ ADDR : EDIT/ DEL : REPLY ]
  11. 낑꼬

    아..정말 많은 도움이 되었어요..감사합니다...

    2012/05/17 00:32 [ ADDR : EDIT/ DEL : REPLY ]
  12. 달린다인어

    영문판 맥용 받고있는데요 play에서 42프로까지 되더니 자꾸 디스크 새로 넣거나 디지탈을 구입하라고 하는데 이거 어떻게 해야하는걸까요 ㅠㅠ 아 진짜 환장하겠네요
    게다가 무료쿠폰은 등록이 안되요ㅠㅠ

    2012/05/18 00:17 [ ADDR : EDIT/ DEL : REPLY ]
  13. 음...

    맨처음에 윈도우용으로 깔면 .exe파일이라 안되지 않나요?

    2012/05/18 21:14 [ ADDR : EDIT/ DEL : REPLY ]
  14. 왜이러죠 ㅡㅜ

    이상하게 파일 깔구 실행시켜도 파일자체가 실행이 안되네요 ㅜ 뭐 때문일가요?

    2012/05/18 23:58 [ ADDR : EDIT/ DEL : REPLY ]

Ruby On Rails/agile note2012/05/04 17:32

내 주변에 나이는 어리지만 코딩을 잘하는 친구들이 몇몇 있다.

그 나이 또래 아이들과 비교하면 잘한다. 인정한다.

하지만 결과물만 만들어 낼뿐 그 과정이나 코드를 보면.. 막막하다.

그리고 이 결과물도 사실은 굉장히 내구성이 약하다.

그 이유야 여러가지가 있겠지만, 딱 하나를 꼽으라면

생각없이 그냥 막 코딩을 하기 때문이다.



생각없다는 표현이 좀 심했나? 그래 인정한다. 표현이 심했다. 사실 나도...

좀 더 순화시키고 디테일하게 말을 하자면 설계하는 과정이 없다는 것이다.

설계라고 하니 거창해 보이지만 내가 말하는것은 전체적인 구조를 짜는거 말고 어떻게 코딩할것인지 생각하는 과정이 없다는 것이다.


설계하는 과정이 없으니, 코드는 당연히 스파게티가 되고


음식 스파게티 사진맛있어보이는가? 저거 한가닥 한가닥 풀어볼 생각해봐라 ㅋㅋ


스파게티가 되니 버그가 많아지고

스파게티가 되니 디버깅도 힘들어지고

스파게티가 되니 협업하는 다른 개발자가 코드를 보기 힘들어지고

그렇다보니 다른 개발자도 "이미 버린 코드구나"하고 스파게티로 짜게 될 확률이 높아진다.

결국 코드는 산으로 가고

간단한 기능 수정하거나, 디버깅하는데 하루를 다 허비하게 되고

일정은 다가오고

일정을 맞추기 위해 맨날 밤새고


월화수목금금금 코딩하는 개발자


그러다 답이 없어서, 다른 프로젝트를 진행중이던 다른 개발자도 참여하게 되고

땜빵으로 들어간 다른 개발자는 코드를 보고 한숨을 쉬고 멘붕

땜빵 개발자는 억울하지만 어쩔 수 없이 같이 계속 밤새며 타이핑 한번, 한숨 한번, 타이핑 한번, 한숨을 반복하며 "내가 왜 여기있지?"라는 의문과 함께 코딩을 하고 (내 경험담이라 감정 이입해서 쓴거다.. ㅋ)

어찌어찌 오픈을 해도, 유리같은 결과물이라 툭 하면 에러나고, 컴플레인 들어오고



또 다시 디버깅을 위해 밤을 새고..

다음 릴리즈 일정은 다가오고

또 다시 밤을 새고

결국 회사는 망하게 되고


출근 안해도 된닼ㅋㅋㅋ


뭐 이런 악순환의 반복이 된다.


단순히 어떻게 코딩할 것 인지 고민을 안한것 만으로 도미너 처럼 하나하나 넘어져 결국 회사를 망하게 하거나 동료 개발자를 멘붕시킬 수 있다.

"문 헛소리냐? 님 쪼랩임? 애자일 모름? ㅋㅋ 난 애자일하게 하는거거든?" 이라고 카우방에서 젖소가 블리쟈드쓰는 소리를 한다면. 이런말 하는 사람은 디아2 해보지도 못한놈이 카우방 얘기하는거나 마찬가이다.

애자일을 이런 상황에 가따붙이라고 만든거 아니거든요? ㅋㅋㅋ

암튼, 여기서 교훈은 동료 개발자가 싫거나, 회사가 맘에 안들면 생각 따윈 집어치고 그냥 막 코딩을 하면 된다는 귀중한 가르침이다.

끝.










이라고 한다면 안그래도 방문자 없는 블로그인데

응? 방문자 없는 블로그니깐 이렇게 끝내도 아무도 모르겠구나.ㅋㅋㅋ

나 천재인가봐? ㅋㅋㅋ

불평만 하는 글이 됨으로, 부족한 사람이지만 몇가지 가이드를 책임없이 던져본다.

다시 말하지만 책임없이 던진다. 나한테 뭐라하기 없기다? ㅋㅋ


내용이 아주 오래전부터 할아버지 선배님들때부터 해오던 얘기들인것 같아 고리타분해지는것 같은데..


사실 코딩을 잘못해도 상관없다.

코딩은 그냥 하면 된다. 중요한것은 어떻게 코딩할것인가다.

설계를 어떻게 할 것인가? 이런거 얘기안할거다. 이건 책 봐라. 책 많다.

난 코딩하기전 이런 습관을 가져라 라고 얘기하고 싶다.



전체적인 그림을 그려라.



혼자하는 프로젝트일 경우, 생략할 수 도 있지만.. 이것도 짬이 없으면 해야 한다.

암튼 하면 좋다. ㅋㅋㅋ

정확할 필요는 없다. 많은 시간을 할당하지 않아도 된다.

빼먹는 부분(구멍)만 없으면 된다. 열심히 그렸는데 화장실 빼먹으면 망하는거다 ㅋㅋ


전체적인 그림을 그리는것은 설계의 기본이다.

그리고 일정을 산출해 내는데 유리하다. 

일정 다되서 막판에 회사에서 먹고자고 할텐가?



당신이 말단(신입)이라면 "내가 해봤자 어차피 팀장 따라 가야하는데 무슨 소용이냐?"라고 생각할 수 있다. 

이런 생각을 한 당신.. 평생 말단(신입)으로 있을것 같나? 언젠가 당신도 팀장이 된다.

그 때를 위해 미리 경험치를 쌓아둔다고 생각해라. 팀장이라는 훌륭한? 교본도 있지 않은가? (팀장님들 긴장트리좀 타삼 ㅋㅋ.. 근데 나부터 타야하네;; ㅋㅋ)



차분히 내가 해야 할 일이 무엇인지 파악하라.



전체적인 그림을 그렸는가? 잘했다. 쓰다듬어 드림. 쓰듬쓰듬..?

그럼 이제 내가 해야할 일이 무엇인지 테스크를 파악해야 한다.

매일매일 출근해서 가장 먼저 할 일은 오늘의 할일을 선정하는것이고

퇴근할때 얼마나 했는지, 내일은 무슨 일을 할 것인지 선정하는 것이다.

다음날 출근시 오늘의 할일을 다시 선정할 필요는 없고.. 어제 퇴근하면서 선정한 테스크들을 보며 체크만 하면 된다.

테스크 추출하는것.. 처음엔 귀찮을 수 있다. 그리고 쉽지 않다.

하지만 꾸준히 반복적으로 해라. 아주 중요한 것이다. 그냥 습관으로 만들어라.


단순히 오늘의 테스크만 뽑았다고 끝나는 것이 아니다.

다음 단계가 있다. 바로 뽑아낸 테스크 하나하나를 어떻게 코딩할 것 인지 고민하는 것이다.

네임스페이스를 정하는것만 해도 상관없다.


처음에 큰 그림을 그리면, 추상적인 설계가 어느정도 머리속에 있게 된다.

하지만 테스크를 발라내게 되면.. 이 설계가 조금은 실제화가 되는데

이때 네임스페이스를 정해주는게 훨씬 쉽고, 

구조를 수정하는 일이 상대적으로 적어진다.



네이밍에 허비하는 시간을 아깝게 생각치 마라



메소드를 만들든, 프로퍼티를 만들든, 펑션을 만들든, 변수를 만들든.

제발좀 네이밍에 신경을 써라.

상황에 따라선 코딩하는 시간보다 네이밍하는데 시간을 더 써야 될 때도 있다. 물런 항상 그러면 안된다. ㅋㅋ

제발 좀!!

의미에 맞는 네이밍해라. 영어사전 항상 열어놓아라. 아님 구글번역기라도 돌려봐라.



스스로 먼저 리뷰를 요청해라



리뷰를 꼭 해라. 혼자 하지 말고 최소한 같이 프로젝트한 팀원들과 해라.

이 프로젝트에 참여하지 않은 사람들은.. 첨부터 끝까지 설명해야 해서 귀찮긴 하지만.. 

서로에게 자극을 주고 배움을 주는거니 거절하지는 마라.

가능하다면 고수도 껴넣어라. 없어도 상관은 없다.

혹 코드리뷰하는 분위기가 아닌가? 그럼 당신이 만들어라.

용기 있는자가 미인을 쟁취한다는 말도 있지 않은가?

...........? ㅋㅋㅋㅋ

도저히 용기가 안난다면, 맘 맞는 몇명만 불러서 해라.

맘 맞는 사람이 없나?

그럼 친하고 신뢰할 수 있는 사람을 불러서 해라.

커피 한잔 사준다고 꼬득여서 해라.

어쨋든 해라.

그리고 가능하면 사수는 꼭 넣어라.

아에 신입이면 페어프로그래밍 하면서 이런것 하나하나 일일이 지적할 수 있지만.

겅력 2년정도 된 사람들은, 페어프로그래밍하면서 하나하나 지적하기가 힘들다.

왜냐면.. 이미 나쁜 습관이 들어있고.. 경력이 있다보니 쫀심이 있어서.. 되려 카운터 얻어맞을 수 있기 때문이다.

물런. 착한 사수는 그런거 신경안쓰고 열심히 가르켜주겠지만.. 난 한번 당한 경험이 있어서 말이지..

요즘 아이들 무섭다 ㅠ,.ㅠ 어른을 존경하는 마음을 떠나.. 이타심 자체가 부족하다.

암튼. 아무래도 경력이 있다보니 기본적인 구조, 네이밍을 지적하기가 여간 조심스러운게 아니다. 그래 나 소심하다 ㅋㅋ

리뷰타임에서는 페어프로그래밍할때 못했던 말들, 페어프로그래밍하면서 놓쳤던 부분, 혹은 페어프로그래밍할때 잘못 작성한것들 등등을 발견하고 서슴없이 깔 수 있기 때문이다.



하지만 사장님에겐 따뜻하겠지..

여기서 중요한것은 코드리뷰할때 내가 작성한 코드는 없다. 우리가 작성한 코드만 있을뿐이다.

그러니 발끈하거나 감정 상하지 마라.


쓰다보니 해주고 싶은 말이 너무 많지만.. 그런거 다 쓰자니 내가 귀찮아서 ggㅋㅋㅋ

쓰고보니 결국은.. 수백번은 봤을 수 도 있는 이야기들이다. 봤으면 뭐하나.. 실행을 안하는데..

제발 좀 행동으로 옮겨라!!!




간만에 포스팅이라 제가 감(글쓰는 법, 개그감)을 잃었나봅니다.

죄송합니다. ㅠ,.ㅠ


도망가자. ㅋㅋ

하지만 읽어준 당신에겐 감사. 

크리에이티브 커먼즈 라이선스
Creative Commons License

'Ruby On Rails > agile note' 카테고리의 다른 글

코딩하기전 생각하는 습관을 가져라.  (0) 2012/05/04
Code Review  (0) 2008/05/26
Getting Real~!  (0) 2008/02/25
start agile!  (0) 2007/11/26
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/201 관련글 쓰기

댓글을 달아 주세요

Ruby On Rails/작은 팁2012/03/16 20:44
제목이 이상한것 같지만, 아래 코드를 보자

brew를 실행하면, 되긴 하는데..
정작 설치를 하거나 업그레이드를 할려고 하면 권한 문제로 실행이 안된다.

나의 경우에는 맥북에서 아이맥으로 마이그레이션을 했는데, 그래서 생긴 문제인 듯 하다.

/usr/local에서 파일 오너가 root로 되어있다.

이걸 전부 내 계정으로 변경해주었다.


sudo chown -R hiphapis:wheel /usr/local



그리고 나서 업그레이드를 하니 잘 된다.


 


크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/200 관련글 쓰기

댓글을 달아 주세요

궁시렁*22011/07/20 01:02
회사에서는 리얼포스 106을 사용하고 있습니다. (물런 개인 키보드 입니다. 자랑질~*)
(87은 아무리 구해도 구할 수 가 없어.. 어쩔 수 없이 106키를 쓰고 있는데.. 마우스와 키보드를 오갈때마다 많이 불편하네요. 짤라버리고 싶은데, 짜르실 줄 아는 기술자님이 지금은 작업을 안하신다고.. ㅠ,.ㅠ)
 
물런 ESC 키캡은 Red죠! ㅎㅎ

 
맘같아선 이 녀석을 들고 출퇴근하며 집에서도 쓰고 싶지만..
무게도 생각보다 좀 있고,
귀찮고,
들고 다니면 아무래도 먼지가 배부르게 잡수실 것 같고,
충격에 상대적으로 많이 노출 될 것이고,
그냥 주말마다 가져가서 사용하고 있습니다.
우리는 주말부부. (응?)

그럼 집에서는 무엇을 쓰냐?
바로 필코 마제터치 갈축을 약 5년정도 사용하고 있습니다.


기계식이지만 소음은 상대적으로 적은편에 속하고, 키감도 맘에 들어했던 녀석입니다.
중간에 쓰던 녀석이 고장이 났지만, 또 다시 일본에서 사온 녀석이죠.
이 녀석을 총 3번을 구매해서 쓸만큼 애착이 있는 모델입니다.
(물런 리얼포스 앞에선 헌신짝)



그런데 이 녀석이 언제부턴가 R이 눌렀다 안눌러졌다 그러더군요..
별로 신경 안쓰고 있었는데.. 언제부턴가 슬슬 짜증이 나더군요.
그래서 고장나서 안쓰고 있던 다른 마제터치(마찬가지 갈축)의 키를 하나 빼서 교환해주기로 마음 먹었습니다.

이 고장난 녀석도.. 허접하지만 한번 직접 고쳐서 사용했던 녀석인데.. 
콘덴서가 문제인지, 아니면 땜빵한 배선이 충분한 전력을 공급을 못하는건지..
중간중간 전력이 약해지면서 연결이 끊어지더군요



먼저 고장났던 키보드를 분해하고.. 인두기로 지져서 엔터키를 탈착했는데.. 
젠장!! 다리 하나가 끊어졌습니다.


어쩔 수 없이 엔터키는 버리기로 하고.. 메뉴키를 뽑기로 결정
왜 하필 메뉴키냐면.. 키캡이 떨어져 있길래.. 마치 '날 좀 뽑아주소'라고 나에게 전언을 보내고 있다는 느낌을 받아서랄까? 응?

순식간에 옥수수 2개 털린 키보드


고장난 R키와 바꿔치기 해줬습니다.
이게 바로 잘 안눌리던 R키 입니다.


납땜을 한 후 USB에 연결해서 R이 제대로 눌리는지 확인해봅니다!
우오오오!!!!!! 잘 됩니다! ㅎㅎㅎ
케이스 마저 조립하고.

옥수수 2개 털린 키보드의 뒷태와 장기이식으로 인해 새 생명을 얻은 키보드



근데 이제는 E키가 잘 안눌리는것 같습니다.

아놔...... 
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/197 관련글 쓰기

댓글을 달아 주세요

Ruby On Rails/작은 팁2011/07/12 11:37
RoR에서 Terminal을 사용하기 때문에 이 카테고리에 넣습니다.
양해를 쿨럭~;

Mac Terminal의 Home, End키의 기본 세팅이 스크롤 최상단/최하단 (좀 더 정확하게 말하면 버퍼의 최상단/최하단)으로 이동이 됩니다.
하지만 일반적인 상황에선 현재 줄의 처음과 끝으로 가는 용도로 많이 사용하죠. 
(여기서 OSX에 불만 하나.. 왜 프로그램마다 Home, End 동작이 틀리냐고.. Home, End만 틀린게 아님. 틀린키 무지 많음.)

평상시에는 그냥 그러려니 하고 별 문제 없이 쓰지만, 막상 필요한 순간이 오면 참 짜증이 나는.. 뭐 그런 기능입니다.

아래 Terminal에서 Home, End키 적용하는 법입니다. 

1. Preferences를 엽니다.


2. 그런후 사용하시는 스킨의 Keyboard로 이동 합니다. 
3. Home을 선택, Edit을 누릅니다.


4. Action을 "Send string to shell"로 선택하시고, \033[1~를 입력후 OK
\033[1~는 복사해서 붙여넣으세요.


5. 마찬가지로 end를 선택 하신 후 Edit


6. 이번에는 \033[4~를 입력


끝입니다.

혹시 PageUp/Down을 원하신다면, 마찬가지 방법으로
PageUp: \033[5~
PageDown: \033[6~ 

를 입력하시면 됩니다.
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/196 관련글 쓰기

  1. [RoR] 맥 OS X에 rvm을 이용해 ruby on rails 개발 환경 구축하기  삭제

    2011/10/30 18:39TRACKBACK FROM 월풍도원(月風道院) - Delight on the Simple Life

    맥에서 rvm(Ruby Version Manager)를 이용한 ruby on rails 개발 환경 구축 방법입니다.맥 OS X에 rvm을 이용해 ruby on rails 개발 환경 구축하기맥 OS X에서 루비 설치하기우선 터미널에서 아래의 커멘드를 이용해 RVM(Ruby Version Manager)을 설치합니다.$ bash &lt; &lt;(curl -s...

댓글을 달아 주세요

  1. 지나가다

    저는 이게 전혀 먹질 않네요. ㅠ ㅠ 라이언이라서 그런가

    2011/10/27 16:05 [ ADDR : EDIT/ DEL : REPLY ]
  2. 이거 검색하다가 이리 흘러들어왔네요. ㅋㅋ

    저도 라이언이어서 적어주신 대로 할 때 안되더라구요. 그런데 다른 키들 보다보니 원래 shift home, shift end가 원하는 기능이어서 해당 단축키 참고하여 수정했더니 잘 되네요.
    home: \\033[H
    end: \\033[F

    2011/12/30 11:10 [ ADDR : EDIT/ DEL : REPLY ]
    • 헐퀴~ 그렇군요.
      이거 쓸때가 스노우때였으니..

      라이온 설치하고 부터 저도 안되긴 했는데..
      귀찮아서 그냥 썼었거든요.

      덕분에 거저 했네요 ㅋㅋ

      2012/01/02 15:34 [ ADDR : EDIT/ DEL ]
  3. 본 세팅이 스크롤 최상, End키의 기본 세팅이 스크롤 최경 구축하기맥 OS X에서 루비 설치하기우선 상단/최하단 (좀 더 정확하게 말하면 버퍼의

    2012/05/05 19:11 [ ADDR : EDIT/ DEL : REPLY ]

Ruby On Rails/작은 팁2011/06/15 13:20
내용추가.
이리저리 좀 더 상황을 지켜보니.. 
Devise의 문제가 아니라 Ruby 1.9.2 or Rails 3.1 의 버그인것 같다.
path를 못찾는 경우 에러를 내지 않고, 끝까지 찾는다. 끝까지!

------------
 
Devise를 붙이고 sign_out을 했는데 반응이 없다.
그러다가 몇초 후 내 맥도 반응이 없다.
Activity Monitor를 띄워보니, ruby 메모리 사용이 1.8G
응? 
1.8G?

내눈을 의심하고 다시 봤는데 1.8G
가운데 .(점)만 빼면 욕이 되는 1.8G.. 
ㅡ.,ㅡ;


처음에는 84MB


sign_out누르니깐 몇초만에 1GB 돌파!!!

그대로 내비두면 4GB 메모리를 다 잡수실 기세라서 1GB넘는 시점에서 강제종료 해버렸다.


뭐가 문제인지 이리저리 추적을 해보니..
destroy 액션(sign_out)에서 

sign_out_and_redirect

요 녀석이 의심스러워 이리저리 해보니, 역시나 이 녀석이 범인이었다.

문제는 redirect시 :root_path로 redirect하게 될 때가 있는데, 이때 :root_path를 찾지 못해 생기는 버그였다.
해결책은 크게 2가지가 있다.

1. :root_path를 만들어 주는 방법.
:root_path가 없어서 생기는 버그임으로, :root_path를 만들어 주면 된다.
routes.rb에 가서 주석처리된 

# root :to => 'welcome#index'

을 주석을 풀어주고, :to는 각자의 상황에 맞게 수정을 해주면 된다.

root :to => 'getAway#Hi'



2. sign_out과 redirect를 따로따로.

sign_out_and_redirect

이 녀석이 하자다보니, 이 녀석을 안써버리면 그만이다.
직접 sign_out 시키고 상황에 맞게 redirect 하면 된다.

sign_out
redirect_to "넌 이미 아웃되었다."



크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/195 관련글 쓰기

댓글을 달아 주세요

  1. 안녕하세요.
    저는 root :to => "home#index"가 기본으로 풀려있어서 그런지,
    아직 루비 devise 때문에 컴퓨터가 기절한적은 없습니다.
    트랙백 걸려고 검색 하다 들어와서, 루비온 레일즈 관련 포스트 잘 읽고 가네요..:D
    행복한 하루 되세요!

    2011/10/30 18:51 [ ADDR : EDIT/ DEL : REPLY ]
  2. 공부를 시작한지 얼마안된 초보인데,이렇게 많고 좋은 자료를
    공유할수 있게 해주셔서 정말 감사드립니다..^^

    2012/04/26 23:26 [ ADDR : EDIT/ DEL : REPLY ]

Ruby On Rails/작은 팁2011/06/13 15:00


작업을 하다보면 종종 불필요한 prefix가 붙는 경우가 생긴다.

resources :article do
  resources :article_log
end

resources :log


사실 큰 문제는 없지만, article_log path을 적어줘야 할때

article_article_log_path

이런 요상한(?) naming을 가진 path가 되어버린다.

나 같이 깔끔한 사람(응?)은 이런거 눈뜨고 못본다.
난 무슨 일이 있어도

article_log_path

이렇게 쓰고 싶어 근질할테니 말이다.
당신도 그런가? 
동지! 함께 원피스를 찾자!(응?)

이런 경우

:as 

를 써주면 우리가 원하는(설마 나만 원하는건 아니겠지?) 형태로 사용할 수 있게 된다.

resources :article do
  resources :article_log, :as => :log
end

resources :log


이렇게 :as를 추가해주게 되면

article_article_log_path

가 아닌

article_log_path

로 path가 잡히게 된다.
못믿겠으면 

rake routes

해보라!


크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/194 관련글 쓰기

댓글을 달아 주세요

IPhone & IPad/작은 팁2011/06/02 16:53
개발하다보면 Common Module 혹은 Common Library 등.. 이런 뉘앙스의 이름으로 불리는 녀석들이 있다.
개발하는데 공통적으로 쓰이는 것들을 모아놓은 녀석들을 지칭하는 말인데,
cocoa에서는 이렇게 안부르고 static library라고 부른다.

iPhone, iPad의 경우 시뮬레이터가 있다보니 시뮬레이터(simulator)용, 디바이스(device)용 이렇개 2가지를 만들어서 상황에 맞게 사용을 해야 하는데, 이게 참 번거로운 일이다.

생각해보라.
시뮬레이터로 테스트 할땐 시뮬레이터용 라이브러리를 넣고
디바이스에서 테스트 할땐 시뮬레이터용 라이브러리를 삭제하고, 디바이스용 라이브러리를 넣고
다시 시뮬레이터로 테스트 할땐 디바이스용 라이브러리를 지우고, 시뮬레이터용 라이브러리 넣고.
지금 TAd(SK T에서 제공하는 광고)가 이렇게 구현되어 있다.

하지만, 다행스럽게도 라이브러리를 하나로 합칠 수 있다.
lipo를 이용하면 되는데, 잠시 후에 언급하겠다.

1. 라이브러리로 만들 프로젝트 생성


라이브러리로 만들 프로젝트를 새로 만든다. 이때 타입은 Cocoa Touch Static Library이다. 
iOS > Framework & Library > Cocoa Touch Static Library


Library라는 이름으로 프로젝트를 생성했고, 공통으로 쓰이는 모듈을 모아놓은 파일을 프로젝트에 추가를 한다.
Common.h, Common.m 파일을 추가했다.


2. 시뮬레이터용(simulator) Target 만들기.


새로운 Target을 추가를 하는데, Target의 타입 또한 Cocoa Touch Static Library이다.


시뮬레이터용 라이브러리이므로, Target이름은 Library-Simulator로 하겠다. (네이밍은 본인 마음대로)


그리고 파일을 Build Phases에 추가를 해야 한다.
헤더(.h) 파일은 Copy Headers에, 소스(.m)파일은 Compile Sources에 드래그&드랍(Drag&Drop)으로 추가를 한다.
Header는 Public, Private, Project 이렇게 3가지 타입을 가지고 있다. 목적에 맞는곳에 넣으면 되며, 기본값은 Project이다.


그리고 마지막으로 Scheme 타입에 Build Configuration을 Release로 변경한다.
Product > Edit Scheme


3. 디바이스용(device) Target 만들기.


2. 시뮬레이터용(simulator) Target 만들기.와 똑같은 작업의 반복이다. 이름만 다른것으로 바꿔주면 된다.
Library-Device라고 하겠다.


4. Targets 합치기.


위에서 언급했던대로, 지금 만든 2개의 Target을 하나로 합치는 Target을 만든다.
이번에도 Add Target을 하는데, Aggregate로 만든다.
Other > Aggregate


이름은 Library-iOS4.0 으로 하겠다.
이번에도 마찬가지로 Edit Scheme에서 Build Configuration을 Release로 변경한다.


Run Script를 추가를 한다.
Add Build Phases > Add Run Script


그리고 나서 lipo를 이용한 두 Target을 Merge하는 구문을 넣는다.

rm -rf ${BUILT_PRODUCTS_DIR}/libLibrary-ios4.0.a 

lipo -create "${BUILT_PRODUCTS_DIR}/../${BUILD_STYLE}-iphonesimulator/libLibrary-Simulator.a" \
"${BUILT_PRODUCTS_DIR}/libLibrary-Device.a" -output \
"${BUILT_PRODUCTS_DIR}/libLibrary-ios4.0.a"

보시다시피 sh 명령어이다. 파일명은 본인의 상황에 맞게 수정하면 된다.
위 명령어를 보면 대충 파악 되겠지만, 두개의 .a를 하나의 .a로 Merge해주는 명령어다.
지금은 빌드를 안했기 때문에 libLibrary-simulator.a와 libLibrary-device.a가 없다. 
여기서 주의할점은, 빌드를 하면 lib이 접두어로 붙게 된다. 그러므로 .a 파일명에 접두어로 lib을 붙이는걸 잊지말자. 


5. 빌드하기


자, 이제 세팅은 완료가 되었다. 각각의 Target을 Build해주면 된다.


먼저, Library-simulator 빌드!


이젠 Library-Device 빌드!


Library-simulator.a, Library-device.a 파일 모두 생성되었다.



마지막으로 Library-iOS4.0 빌드!


이제 만들어진 libLibrary-iOS4.0.a를 사용하면 되는데, 이 녀석의 위치는
libLibray-Device.a를 우클릭해서 Show in Finder로 보면 Finder가 열리는데, 그 위치에 있다.


이제 libLibrary-ios4.0.a와 Common.h 파일을 작업중인 프로젝트에 넣어서 사용하면 끝!

만약. libLibrary-ios.4.0 빌드를 실패했다면 십중팔구 파일을 lipo에서 파일을 못찾아서 나는 에러이다.
아래 4가지 항목을 체크해보면 해결 될 것이다.
  • 만들어놓은 Target들의 Build Configuration이 Release로 되어 있는지
  • Library-simulator는 Simulator로 빌드했는지
  • Library-device는 device로 빌드했는지
  • Library-ios는 device로 빌드했는지
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/193 관련글 쓰기

댓글을 달아 주세요

  1. 반딧불 축제는 두시간 반 걸려서 가서 그것만 보기에는 좀 작고 덥고 볼것도 많지는 않은 듯 했지만 - 더워서 자세히 보지도 못했지만. - 점심먹은 적상면에 순두부마을 음식들이 너무 맛있어서 계곡 구경도 하고 찜질방도 가고 - 나는 안즐기는지라 안가지만 - 곤돌라 타고 경치구경도 한번 해도

    2011/06/16 20:05 [ ADDR : EDIT/ DEL : REPLY ]

Ruby On Rails/작은 팁2011/05/19 11:11


아시다시피 5월 5일 Rails 3.1 Beta 1 이 Release되었다.
많은것들이 바뀌었는데 그것들중 알고 넘어가면 좋을법한것 몇가지만 추려 간략하게 Overview해보았다.

설치

rvm 1.9.2@railspre --create
gem install rails --pre

Javascript

Rails 3.1부터 prototype.js가 아닌 jQueryCoffeeScript가  Default로 탑재되어 있다.
만약 jQuery가 아닌 prototype.js를 계속 사용하고자 할 경우,
rails new [APP_NAME] -j prototype
해주면 된다.

새로 추가된 Gems

  • sass: haml에 포함되어 있던 sass가 독립되어 나왔다.
  • coffee-script
  • uglifier: JS를 하나의 파일로 합쳐준다.
  • jquery-rails 

디렉토리 구조 변경

Public아래에 있던 Javascript, Stylesheets, Images가
/app/assets/ 로 이동되었다.
그러므로 웹엔진(Nginx등)에서 Js, Css, Image를 Rails한테 안넘기고 직접 처리하도록 세팅이 되어 있었다면, 관련 부분은 수정이 있어야 한다

Sprockets

application.css, application.js에 보면
 //= require jquery
처럼 주석처리된 require들이 있는데, 이건 주석이 아니라 sprockets의 require(include)하는 문법이므로 해당 구문을 삭제하면 include가 안된다.
 

Migration 

migration file의 change 메소드가 추가되었다. 
과거에는 up, down으로 메소드가 분리되어 있었지만, change로 통합되었다.
하지만 종종 제대로 동작하지 않을때도 있는데 그럴땐 up, down을 만들어서 사용하면 된다. 

그리고 :belongs_to가 추가되었는데, 과거 relationship을 같게 될 경우 직접 index key(article_id:integer)를 만들어 줬었다.
3.1 에서는 belongs_to를 이용하면 되는데.
rails g scaffold comment article:belongs_to body:text

이렇게 써주면되며, belongs_to로 만들면 add_index도 시켜준다.

Console

콘솔에서 DB Query가 노출이 되었는데.. 상황에 따라선 이게 과잉친절이 될 수 도 있을 듯 하다. 

Active Record

  • :has_many에서 :through를 다중깊이까지 사용할 수 있게 되었다. 
  • 그리고 :through에서 :dependent 도 지원을 한다.
  • :as 가 추가되었다.  
  • default_scope가 block으로 처리할 수 잇게 되었으며 lambda, method를 사용할 수 있다.

    default_scope { ... }
    default_scope lambda { ... }
    default_scope method(:foo)

  • update_column이 추가되었는데, update_attribute와 동작은 유사하지만 validation과 callback을 무시하고 update한다.

    User.first.update_column(:name, "sebastian") 

  • inverse_of가 추가되어서 예제 코드처럼 post.tags.build가 가능하다.

    class Post < ActiveRecord::Base
      has_many :taggings
      has_many :tags, :through => :taggings
    end

    class Tagging < ActiveRecord::Base
      belongs_to :post
      belongs_to :tag, :inverse_of => :tagging # :inverse_of must be set!
    end

    class Tag < ActiveRecord::Base
      has_many :taggings
      has_many :posts, :through => :taggings
    end

    post = Post.first
    tag = post.tags.build :name => "ruby"
    tag.save # will save a Taggable linking to the post

  • has_many의 :conditions에서 sql을 직접 쓰는것의 사용법이 바뀌었다.
    // Before
    has_many :things, :conditions => 'foo = #{bar}'

    // After
    has_many :things, :conditions => proc { "foo = #{bar}" }
  • has_secure_password라는 메소드가 추가가 되었는데, Authentication을 직접 만들어서 쓸 경우 아주 유용하게 사용할 수 있다.
    새삼스럽지만, 3.1되면서 부터 Authentication Tool은 안써도 될 듯 하다.


Action Pack 

  • auto_link가 제거되었다. 만약 계속 사용할것이라면 rails_autolink gem을 이용하면 된다.
  • :authenticity_token 을 form_tag에서 option으로 바뀌었다. 생략하거나 수정이 가능하다.
  • rhtml, rxml이 제거되었다.
  • csft_meta_tag가 복수로 rename되었다. csft_meta_tags
  • HTML5의 "data" attribute를 hash로 제공한다
    tag("div", :data => {:name => 'Johan Kim', :city_state => %w(Seoul)})


Active Support

  • Object#in?
  • weeks_ago
  • pre_week


간략하게 이 정도 인 것 같다.
관심이 있다면 https://gist.github.com/958283 를 확인하면 자세한 내역이 나온다.

http://menonrails.com/articles/14 에 기고된 포스팅 입니다.


참고링크



 

 
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/192 관련글 쓰기

댓글을 달아 주세요

  1. 카테고리의 다른 글

    2012/05/04 20:28 [ ADDR : EDIT/ DEL : REPLY ]
  2. 구문 게시물에 그런 것들을 제공하는 아주 좋아요 방법입니다. 클리어 컷 의미.

    2012/05/20 18:58 [ ADDR : EDIT/ DEL : REPLY ]

Ruby On Rails/작은 팁2011/05/02 20:00

Edit+ 짱!

Windows에서 개발을 할때는 무조건 Edit+만 사용했었다. (PHP뿐만 아니라 RoR할때 조차도!)

그 이유는
  • 10년 넘게 사용해왔다는 점.
  • 정식 라이센스를 보유하고 있다는 점.
  • 베타 테스터라는 이유. (개발자와 100통이 넘는 메일을 주고 받았다.)
도 있었지만,

  • 10년 가까이 사용해오다보니 왠만한 단축키는 거의 다 외우고 있었고
  • 직접 단축키를 할당하는 등의 커스터마이징도 많이 되어 있었고
  • 무엇보다 막강한 편집기능 때문이었다.

막강한 편집기능의 간략한 예를들면..
  • 주석 추가/제거
  • 현재 케럿에서 앞/뒤로 줄 삭제
  • 현재 줄 복사/삭제
  • 현재 줄을 위/아래로 이동
  • 현재 단어 삭제
  • 캐럿기준 앞뒤 문자 바꾸기
    이것 정말 쏠쏠한 기능이다. 고속으로 타이핑 하다보면 철자의 앞뒤를 바꾸는 경우가 있는데 이 기능을 실행하면 앞뒤 문자를 바꿔준다. 예를들어 form인데 from으로 쳤다고 하자. o와 r 사이에 캐럿을 놓고 Ctr+T(단축키는 정확히 기억이..) 누르면 form으로 짠!
등등등 Edit+ 편집메뉴에 있는 모든 기능을 능수능란하게 사용하다 보니 RoR을 할때도 Textmate보다 Edit+로 하는게 비교도 안되게 빨랐다.
(개발툴을 능숙하게 사용하는것도 개발자의 능력임을 잊지말자!)

그러다 몇년전 OSX로 넘어오면서 어쩔 수 없이 Textmate로 넘어왔는데, 이건 뭐 도저히 작업속도가 안나오는 것이다.

뭐 Textmate도 그럭저럭..


사람들이 Textmate에 훅~가는 멋진 기능중 하나가 바로 "코드 자동완성"인데.. 사실 이거 Edit+에도 있다.
사실 Textmate가 좀 더 미려하고, Smart한것은 인정! 하지만 개발속도에 영향을 줄 정도는 아니다.

어쩌다 보디 Edit+ 찬양글이 되어가고 있는데, 10년을 쓴 Edit+인데 Textmate가 성에 안차는걸 어떻하랴..

돌아와서, Textmate의 막강한 기능이 바로 커스터마이징이다. 내가 필요한 기능이 있으면 만들어서 추가해버리면 된다. 물런 Edit+도 가능하지만 한계가 명확하다.
Textmate가 제공하는 기본 편집기능도 Edit+만큼은 아니지만 나름 괜찮은 기능들을 제공한다.
다만 Text Bundle에 숨겨져 있다는게 문제.

그러므로 Textmate로 개발을 해야 하는 개발자라면 시간을 투자해서 Text Bundle과 자기가 사용하는 Language의 Bundle을 처음부터 끝까지 여러번 살펴보는것을 권장한다.
(다시한번 말하지만, 개발툴을 능숙하게 사용하는것도 개발자의 능력임을 잊지말자!)
 

Bundle의 단축키를 수정할 수 있으므로 자주 쓸법한 녀석은 단축키를 지정해 놓는것이 편하다. 
이런것중 유용한것 하나가 "줄 끝 공백 제거"같은 기능이 있는데.. 단축키가 할당되어 있지 않다.
필자의 경우 ⌃. 으로 단축키를 할당해서 쓰고 있다.

단축키가 이미 꽉 차 있거나, 단축키가 너무 많거나 혹은 휴먼 메모리가 딸려서 외우지 못할경우 Bundle Item ⌃⌘T (Bundles → Select Bundle Item)을 찾아서 실행하면 된다.



Textmate 편집 단축키

필자가 자주 애용하는 편집 기능은
  • ⌥⌘.(마침표): HTML 안닫힌 태그 있으면, 닫힌 태그 입력
  • ⌃⇧,(쉼표): HTML 태그 생성
  • ⌃⇧.(마침표): Language의 시작, 출력, 주석 등등 (Bundle에 따라 틀림)
  • ⌘/: 주석 추가,제거
  • ⌃W: 단어 선택
  • ⌃⇧K: 줄 삭제
  • ⌃⇧D: 줄 복사
  • ⌃⌘↑↓: 줄 이동
  • ⌘F: 검색
  • ⌘G: 다음 검색
  • ⇧⌘G: 이전 검색
  • ⌃⌘F: 모두 변환
  • ⌥⌘F: 변환하고 찾기

Bundle에 있는 기능도 있고, Edit 메뉴등에 있는 기능도 있다.
막상 써보니 그리 많지는 않은데 빼먹은것들이 꽤 있을듯한다. 누락된것은 생각이 나거나 새로 발견하는 것들은 계속 추가할 예정이다.

URL


ps. 여러분이 사용하시는것 있으면 우리 공유해요~
코멘트로 써 주시면 올리신 분 아이디와 함께 단축키 목록에 추가할게요! 
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/191 관련글 쓰기

댓글을 달아 주세요

IPhone & IPad/생각2011/03/31 15:17



1. 단축키가 대거 바뀐점.

아.. 이거 정말 골치아프다.
개발자의 능력중 중요한 요소 하나는 작업 속도이다. 
이러한 작업속도를 결정짓는 요소중 하나가 바로 툴의 숙련도인데..
단축키가 너무 많이 바뀌어 버려서, 속도가 확 줄어버렸다.

나중에 시간나면, 바뀐 단축키나 정리해봐야겠다.

2. IB에서 Objects간의 간격이 안나오는 버그

IB로 작업을 하게 되면, Objects간의 간격을 알보는게 꽤 유용하다.
물런 덧셈, 뺄셈해서 작업을 해도 되지만, Objects간의 간격을 보면서 커서로 1px씩 이동을 하면 훨씬 쉽게 작업을 할 수 있다.
그런데.. Xcode4 IB에서는 이게 동작하지 않는다.
예전에 버그 레포팅을 했는데, 과거에 다른 사람이 이미 신고를 했다고 답장이 왔다.
근데 왜 아직까지 디버깅해서 릴리즈 안하는데? ㅡ,.ㅡ;

3. IB에서 Image Copy

Xcode3시절에는 IB에서 객체 복사를 하면, 해당 객체의 속성값들까지 그대로 복사가 되었다.
말 그대로 복사였다.
그런데 Xcode4에서는 Image값을 흘리고 복사가 된다.
예를들면, ImageView를 복사해서 붙여넣기를 해보면, Image(html로 예를들면 src안에 있는 이미지 경로라고 보면 된다.)는 복사가 안된다.
웃긴건.. 다른 속성들은 그대로 복사가 되는데, Image만 복사가 안되는 것이다.
Button도 Image가 복사가 안되긴 매한가지다. 

 이게 버그인지, 의도적인지는 모르겠다만..
이렇다 보니, 또 다른 속성을 흘릴고 복사가 될지 모르는 불안한 상황.
하...... ㅡ,.ㅡ
그리고 ImageView, Button 전부 하나하나 찍어서 Image값 넣어줘야 하는 불편함.
하...... ㅡ,.ㅡ(2)
(내용추가.어떨땐 Image까지 잘 복사되는걸 보아 버그가 맞는듯 하다.)


Apple 나의 기대를 져버리지 않는구나.  

Apple 패라고 망치를 그린건 아니겠지..

 
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/189 관련글 쓰기

댓글을 달아 주세요

  1. gvnvnv푸파ㅜ파ㅜ파ㅜㅏ

    ㅍ피 파푸파ㅜ파ㅜ하하ㅜ하ㅜ하후ㅏㅜ하하하하하하

    애플을 패라고 망치를 쥬셨스븨싀늬다미ㅡ아 랑 란하 낭 ㄹ나아아하하하하하하하하하하

    2011/05/13 21:52 [ ADDR : EDIT/ DEL : REPLY ]

먼저 iOS에서 지원하는 접근성은 어떤것이 있는지 알아보자.
iOS에서 지원하는 접근성 항목은 총 7가지가 있다.


이 항목들은 Settings(설정) -> General(일반) -> Accessibility(손쉬운 사용) 에서 확인할 수 있으며, iOS를 사용하는 Device(장치)인 iPod touch, iPhone, iPad 모두 동일하게 지원을 한다.
 

iPad의 접근성(손쉬운 사용) 설정 화면

 

VoiceOver

VoiceOver 설정 화면
이름이 직관적이라 아마 모두 감 잡았으시리라 생각되지만 Apple에서 만든 Screen Reader 라고 보면 된다.
OS X에 있는 VoiceOver와 동일한 기능을 수행한다.
VoiceOver를 On을 하면, Touch는 선택된 Object(객체)에 대한 설명을 읽어주는것으로 대체되며, 
Double-tap을 해야지만 Click과 같은 역활을 수행하게 된다.

기본적인 작동법의 변화 전/후를 정리해보았다.
   VoiceOver Off (Default)  VoiceOver On
 터치(Touch) 실행 항목 읽기
 탭(Double tab) 줌인/줌아웃 실행
 한 손가락 좌우 쓸어넘기기
(Flick left, right)
좌/우로 스크롤링 및 이동 이전/다음 항목 읽기
 두 손가락 아래로 쓸어 넘기기
(Two finger flick down)
선택한 항목에서부터 시작하여 페이지 읽기
두 손가락 위로 쓸어 넘기기
(Two finger flick up)
가장 위에서부터 시작하여 페이지 읽기 
세 손가락 좌/우/위/아래로 쓸어 넘기기
(Three finger flick left/right/up/down)
스크롤링
네 손가락 좌/우로 쓸어 넘기기
(Four finger flick left/right)
이전/다음 컨테이너(메뉴 혹은 페이지)로 이동 - iPad만 지원
네 손가락 위/아래로 쓸어 넘기기
(Four finger flick up/down)
처음/마지막 요소로 이동 - iPad만 지원
이 정도만 알아두면 VoiceOver를 사용하는데 지장은 없을듯 하다.

http://www.apple.com/accessibility/iphone/vision.html
http://www.apple.com/accessibility/ipad/vision.html
이곳에 가면 간략한 설명은 나오지만, 디테일한 사용설명서 같은것은 없다.
간단하게 표로 결과물이 나오기까지 저자의 노고를 조금이라도 알아달라는 마음에서;;

하지만 막상 해보면 생각보다 쉽게 되지 않은데 "VoiceOver 연습"이라는 메뉴가 있다.
이곳에 가서 연습을 해보면 된다.

VoiceOver 설정 화면VoiceOver 연습 화면

Zoom(확대/축소)

확대/축소 설정 화면
간단하게 화면을 확대/축소하는 기능이다.
이것또한 Touch방식이 변경되는데,  보통 사진이나 Safari에서는 Double tab을 하면 확대/축소가 되었다. 하지만 Zoom기능을 켜게되면 세 손가락이 기준이 된다.
  • 세 손가락으로 Double tab을 하면 확대/축소가 되고
  • 세 손가락으로 Drag(이동)을 하면 화면이 움직이고
  • 세 손가락으로 Double tab한 상태에서 Drag up, down을 하면 줌인/줌아웃이 된다.








Large Text(큰 텍스트)

모든 글자를 크게 해주는것이 아니라 달력, 연락처, 메일, 메세지, 노트의 글자 크기만 키워주는 것이다.
큰 텍스트 끄도록 설정한 화면큰 텍스트가 꺼져 있는 상태에서 메일 보기 화면

텍스트를 56pt로 설정한 화면56pt로 설정된 메일 보기 화면


White on Black(검정색 바탕에 흰색) 

화면의 배경색을 검정색으로 바꾸고, 글자는 흰색으로 바꾸는 설정이다. 
참고로. 이 옵션을 킨 상태에서 캡쳐를 떠도 그냥 일반의 모습으로 캡쳐가 된다. (그래서 포토샵으로 Invert했다는 수고를 알아달라는건 아니다.흠흠)
검은색 바탕에 흰색 옵션을 끈 화면검은색 바탕에 흰색 옵션을 켜서 색이 반전된 화면


Mono Audio(모노 오디오)

접근성 설정 화면에서 모노 오디오를 킨 모습
모노 오디오는 스트레오로 나오는것을 모노로 바꿔서 출력을 해주는 기능














Speak Auto-text(자동 텍스트 말하기)

제목막 보고서,  voiceOver도 있는데.. 이게 무슨 기능인가? 했다.
글자를 입력하다 보면, 자동으로 완성된 문자를 추천해줄때가 있다. 바로 추천된 단어를 읽어주는 기능이다.
접근성 설정 화면에서 자동 텍스트 말하기를 킨 모습자동 완성 텍스트 예제 화면

Tripe-click Home(홈 삼중 클릭)

Home버튼 (iPod, iPhone, iPad에 외부로 노출된 유일한 제어기능이 있는 버튼)을 세번 눌렀을때 실행되는 기능을 정의하는 메뉴다.
옵션들의 대한 설명은 뻔한것이므로 생략하겠다.

홈 삼중 클릭 설정 화면


마치며

iOS에서 제공하는 접근성 기능이 무엇인지 간략하게 알아봤다.
다들 이미 눈치를 챘겠지만, 우리가 신경써서 확인해야 될 부분은 VoiceOver다.
VoiceOver가 제대로 읽어주는지, VoiceOver의 Object간 이동 순서가 논리적인지등
나머지 것들은 시스템에서 제어를 하는 접근성 항목이기 때문이다.



ps.
Xcode3 에서 Xcode4로 넘어오면서 Accessibility 항목이 IB에서 사라져버렸다.
분명 IB에서만 사라진게 아니라 Code에서도 변화가 있을것 같은데..
문제는 아직까지 Xcode4에 맞춘 Guide Document가 아직 릴리즈가 안되었다는 것이다.
일단 Apple에 Xcode4용으로 빨리 릴리즈 해달라고 메일을 보내놓긴 했는데.. 언제 릴리즈가 될지 모르겠다.
결국 헤딩하면서 찾아내야 되는 상황.. 이제 농땡이 칠 시간도 없어져가는데. 큰일이다.

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/188 관련글 쓰기

댓글을 달아 주세요

  1. 우오~~ 놀라운 속도군요 ㅎㅎ

    2011/03/24 20:13 [ ADDR : EDIT/ DEL : REPLY ]

스마트폰 App 제작은 이제 핫이슈가 아니다. 좀 더 정확하게 말하면 이슈거리도 안된다.
스마트폰의 App개발은 홈페이지 만들듯, 이제는 당연한것으로 여겨진다.

그렇다면 App의 접근성은 어떠한가?


우리 솔직해져보자.

개발자중에 '접근성'이라는 단어를 들어본적이 있는 사람이 있는가?
만약 있다면 '접근성'을 App개발과 연관시켜서 생각해본적이 있는가?
그렇다면 접근성을 준수하는 App을 만들려고 노력이라도 해보았는가?

Apple에서 만드는 제품(Product)들은 대부분 접근성을 잘 지켜진 기기(Device)이다. 
그러므로 장비탓을 할 수 도 없다.

과거에는 개발에만 열을 올렸지, 접근성은 철저히 무시되어왔다.
하지만 App을 만드는게 당연해진 지금이라도 접근성을 보장하도록 개발을 해야 하지 않을까?

애초부터 접근성도 함께 관심을 받으며 성장해 나가는것이 최고였겠지만,  지금이라도 접근성을 지켜 App 제작시 접근성도 당연히 신경쓰는날이 오길 기대하며 글을 써본다.

먼저 밝히고 싶은것은, 사실 필자 또한 접근성을 준수하며 App을 개발해본적이 없다.
하지만 이렇게 글을 써내려가는 이유는, 웹 접근성 전문가들중에 App 개발자는 유일무이한 상태(확인된바는 없다)다보니, 나에게 별로 달갑지 않은 책임감이 생겨버렸다.
내가 무슨 대단한 사람이라고 이런 책임감(?)이 느껴지는지 사실 모르겠다.

아무튼, 관련 문서들을 보며 직접 시도를 해보고 배운것을 하나하나 정리한 후 포스팅하게 될것이며, 기본적인 UI에서의 접근성을 다루게 될 것이다.

수정된(Customized) UI를 다루지 않는 이유는, 
  • Customized UI의 방법과 형식은 무한하기 때문에, 이를 다룬다는것 자체가 어폐가 있고
  • 기본 UI의 접근성을 준수하는 방법을 익힌다면, 그 후는 응용이라고 생각하기 때문이다. 


iOS에서 접근성을 지키는게 복잡하거나 어려운게 아니기때문에 연재수가 많아지지는 않을것 같다.(사실 무지 간단하다. 포스팅하는게 무안할정도로. 흠흠;;)
짐작키로 많아야 5회정도?


언제 연재가 완료가 될 지 모르겠지만 스스로를 독려해본다.



Android와 iOS의 접근성을 비교한 글이 있다. 스마트폰 App개발자라면 한번쯤은 읽어봄직 하다. 
Accessibility 서비스로 바라본 안드로이드 vs iOS
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/187 관련글 쓰기

댓글을 달아 주세요

  1. 귀중한 자료들이 될 것으로 기대됩니다! 화이팅~~! :)

    2011/03/24 10:49 [ ADDR : EDIT/ DEL : REPLY ]
    • 막상 올릴려고 하니, 포스팅할 내용이 없어서..
      이것저것 붙여서 올려야 할 것 같아요;

      그리고 군우님이 기대하신다고 하니 이거 부담이 되면서도..
      코멘트 달아주셔서 감사한 마음이 교차하네요 ㅎㅎ;
      감사합니다!

      2011/03/24 10:58 [ ADDR : EDIT/ DEL ]

CSS for Retina Display 에 이어 이번엔 IPad 화면 회전에 따른 CSS 적용법에 대해 간략하게 적어보겠다.
사실 화면회전에 따라 CSS를 구별해서 적용하는 경우는 드물것이나, IPad에 맞춤 웹페이지를 제작하다보면 어느순간 필요해지는 부분이다.

1. Media Query
iPad Orientation의 Media Query는
all and (orientation:portrait)
all and (orientation:landscape)
이다.
portrait는 세로화면,
landscpae는 가로화면이다.


2. 불러오기
CSS for Retina Display와 동일하다

2-1. 별도의 CSS File을 만든경우
<link rel="stylesheet" media="all and (orientation:portrait)" href="/stylesheets/portrait.css">
<link rel="stylesheet" media="all and (orientation:landscape)" href="/stylesheets/landscape.css">

2-2. style을 구분하여 불러올 경우
<style type="text/css" media="all and (orientation:portrait)">
<style type="text/css" media="all and (orientation:landscape)">
2-3. 일반적인 style 안에서 불러올 경우
@media all and (orientation:portrait) {
     #for portrait style codes..
}
@media all and (orientation:landscape) {
    #for landscape style codes..
}


3. 예제
세로용에는 portrait, 가로용에는 landscape를 부여하고, CSS를 통해 제어해보겠다.
<style type="text/css" media="screen">
@media all and (orientation:portrait) {
    .portrait { display: block; }
    .landscape { display: none; }
}
@media all and (orientation:landscape) {
    .portrait { display: none; }
    .landscape { display: block; }
}
</style>

...

Orientation:
<div class="portrait">Portrait</div>
<div class="landscape">Landscape</div>


4. 확인
4-1. Portrait(세로모드)


4-2. Landscpae(가로모드)






크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/186 관련글 쓰기

댓글을 달아 주세요

IPhone & IPad/작은 팁2011/03/14 17:13
XCode4로 업데이트 되면서 App 등록을 시킬려고 했더니.. 이거 뭔가 잘 안된다.
그래서 가볍게 구글링 해봤는데.. 없다. (다들 아는걸 나만 모르고 있었나?;;)
어쩔 수 없이 XCode 페이지에서 Xcode 4 Transition Guide를 살펴보니 끝트머리(96 of 98)에 나와있다.
만약 검색안하고 처음부터 살펴봤으면(물런 그럴일은 없겠지만)... 끔찍하다 -ㅅ-;
뭐 암튼 어떻게 바뀌었는지 정리 한번 해봤다.

과거 App Upload방식의 변경이 웹페이지에서 직접 파일을 업로드 하는 방식에서, File Upload 부분만 Application Loader로 바뀌었었다면. 이번엔 Upload하기 전 과정이 바뀌었는데, Archive(새로 추가됨)를 이용하도록 변경되었다.

어떻게 바뀌었는지 둘러보자.
아참. 웹페이지에서 하던일은 똑같이 해줘야 한다. 순전히 XCode에서의 작업만 변경되었다.

1. Build Configuration, Distribution?
1-1. XCode3에서 넘어온 경우
XCode3에서 Build Configure "Distribution"을 만들어서 사용했던 경우인데, 
 Archive Build Configuration만 변경해줘도 되고 아래 1-2 방법을 사용해도 된다.

Editor에서 Edit Scheme를 클릭


Archive가 Release로 선택되어 있는데, 이를 Distribution으로 변경.


1-2. 새로 프로젝트를 만든 경우 (CodeSign 적용)
 
과거에는 Build Configuration에서 Release를 복사해서 Distribution을 만들었었는데 XCode4에서는 어떻게 Distribution을 만드는지 모르겠다.
이런 프로세스 자체가 사라진것 같은데, 개인적인 추측으론 쓸대없이 Distribution만들지말고 Release쓰라고 그런게 아닐까? 한다.
암튼 돌아와서, Release의 CodeSign만 변경해주면 된다.

 
Project Navigator에서 현 프로젝트를 선택한 후 Build Setting 탭으로 이동 (아래 캡쳐에서는 탭이 짤려서 안나온다)
여기서 Release CodeSign을 Distribution용 CodeSign으로 선택


결국 이 과정은 CodeSign을 맞추는 과정이다.

2. Archive
Organizer의 Archives 에 등록을 해야먄 App을 Upload할 수 있다.
현재는 아무것도 없는 상태


Editor로 돌아와서, iOS Device로 시뮬레이터 선택


Product -> Archive를 실행

Archive를 위한 Compiling중.

Compile이 끝나고 Organizer를 확인해보면, Archive한 App이 나타난다.
여기서 Submit 버튼을 누르면 AppStore 등록 프로세스로 넘어간다.



3. App Store에 등록
여기서부터는 과거 Application Loader 방식과 동일하다고 보면 된다.
Organizer에서 Submit을 하면, 로그인창이 나오는데, 개발 계정으로 접속을 하면 된다.

로그인을 하면, Application과 CodeSign이 나오는데, 웹페이지(개발센터)에서 Ready for Upload인 App들만 나온다. (과거와 동일)

Next누르면 Upload가 시작된다.

Upload가 끝나면 이런 화면이 뜨는데..
이슈거리가 있으면 어떤 화면이 뜰지 모르겠다. 인증서가 잘못되면 여기서 걸리지 않을까 추측해본다.

Status를 확인해보면 Submitted라고 나온다.


웹페이지(개발센터)로 가서 한번 확인해보면, "Upload Received"

몇초후 Reload하니 "Waiting For Review"로 status가 변경되었다.


4. 정리

   XCode3 XCode4
 Distribution 만들기 (CodeSign)  1. Info 에서 Release 복사해서 Distribution 타입 만들기.  1. Schema에서 Archive의 Build Type을 Distribution으로 변경 혹은 Release의 CodeSign 변경
 Compile 및 Upload 준비
 2. Distribution으로 Build.
 3. Compress
 2. Product -> Archive
 App Upload
 4. Application Loader를 이용해서 Upload.  3. Organizer -> Submit

Finder왔다갔다 할 필요 없이 XCode내에서 클릭 먗번으로 줄여줬고,
Application Loader를 이용해서 Upload하는 방식은 변하지 않았다.





크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/185 관련글 쓰기

댓글을 달아 주세요

  1. 도움감사

    감사합니다.
    xcode4가 많이 변경되어서 힘들어 하고 있었는데 덕분에 해결했습니다.
    스크랩 해 가겠습니다.

    2011/03/15 11:36 [ ADDR : EDIT/ DEL : REPLY ]
    • 도움이 되셨다니, 다행이네요
      소중한 댓글 감사합니다!! ;)

      - 본문내용이 추가가 되었습니다.

      2011/03/16 13:56 [ ADDR : EDIT/ DEL ]
  2. 비기너

    바뀐 Xcode4 버전에 적응못하고 헤매고있었는데
    좋은 정보 감사합니다.
    스크랩 해 가겠습니다~^^

    2011/03/16 11:04 [ ADDR : EDIT/ DEL : REPLY ]
  3. 비밀댓글입니다

    2011/03/16 22:04 [ ADDR : EDIT/ DEL : REPLY ]
  4. JombieDeveloper

    감사합니다. 정말 도움이 됬어요.

    2011/03/29 19:12 [ ADDR : EDIT/ DEL : REPLY ]
  5. Rainstar

    Release를 복사해 Distribution 만드는 법이요..
    Project에서 info로 가셔서요.
    configurations에서 밑에 보면 +,- 가 있는데요 여기 +를 누르시면 Release를 복사할수 있어요.. 후에 이름을 Distrubution으로 변경 후 CodeSign을 변경해서 쓰시면 되겠죠.. 릴리즈 모드에서 테스트 하실일이 많으실 테니 릴리즈를 배포용 컴파일로 사용하면 좀 귀찮으실 거예요.. ^^

    정보 정말 잘 얻어 갑니다. 그 후에 도데체 어떻게 해야 하는지 당황하고 있었는데 감사합니다.

    2011/03/30 15:39 [ ADDR : EDIT/ DEL : REPLY ]
    • 아, 그렇게 추가를 해도 되긴 합니다만,
      결국 해당 Schema의 Archive에 가서 CodeSign을 변경을 해줘야 해서요.. ㅎㅎ
      (근데 제가 제대로 이해한거 맞나요? ㅎㅎ)

      2011/03/31 10:19 [ ADDR : EDIT/ DEL ]
  6. 이 글은 정말 도움되네요. 감사합니다.

    2011/04/27 11:54 [ ADDR : EDIT/ DEL : REPLY ]
  7. 이근수

    감사합니다. 큰 도움이 되었습니다 ㅠㅠ

    2011/04/28 14:33 [ ADDR : EDIT/ DEL : REPLY ]
  8. 즐겨찾기

    감사합니다~! 4오면서 애먹었는데
    바로 즐겨찾기 누질렀습니다!

    2011/06/03 14:17 [ ADDR : EDIT/ DEL : REPLY ]
  9. 방랑군

    좋은정보 얻어갑니다.
    http://support.testflightapp.com/kb/tutorials/how-to-create-an-ipa-xcode-4
    이건 구글링은 통해 알아본건데, 어차피 CodeSign변경을 한다면.. 새로 배포용 Schema를 추가해서 사용하는 방법이네요.Release를 변경 안해도 되니.. 이방법도 괜찮은듯 합니다.

    2011/06/14 03:41 [ ADDR : EDIT/ DEL : REPLY ]
  10. 랑유

    감사합니다 >ㅂ<//

    2011/07/14 22:28 [ ADDR : EDIT/ DEL : REPLY ]
  11. 좋은 정보 제공해 주셔서 도움 받고 갑니다. 감사합니다.

    2011/09/15 09:58 [ ADDR : EDIT/ DEL : REPLY ]
    • 스크랩 한다는 말씀을 못드렸네요.
      스크랩 해가겠습니다 ^^

      2011/09/15 11:17 [ ADDR : EDIT/ DEL ]
  12. heywb

    질문잇습니다 디버깅모드에서 distribute가 나오지 않으면 어떻게 해야하나요 ?

    2011/11/07 18:13 [ ADDR : EDIT/ DEL : REPLY ]
  13. 여름의달

    처음이런건 쓰게 되는군요~~

    너무 감사합니다.^^

    완전 헛짓하던 일인.ㅋㅋㅋ

    2012/02/28 18:24 [ ADDR : EDIT/ DEL : REPLY ]
  14. alice

    완전감사합니다. 하루종일 헤메었는데 속이 다 시원하네요.

    2012/04/10 19:57 [ ADDR : EDIT/ DEL : REPLY ]
  15. 변경을 한다면.. 새로 배포용 Schema를 추가해서 사용하는 방법이네요.Release를 변경 안해도 되니.. 이방법도 괜찮은듯 합니다

    2012/05/04 21:28 [ ADDR : EDIT/ DEL : REPLY ]
  16. 가 있는데요 여기 +를 누르시면 Release를 복사할수 있어요.. 후에 이름을 Distrubution으로 변경 후 CodeSign을 변경해서 쓰시면 되겠죠.. 릴리즈 모드에서 테스트 하실일이 많으실 테니 릴리즈를 배포용

    2012/05/05 06:05 [ ADDR : EDIT/ DEL : REPLY ]
  17. 제공해 주셔서 도움 받고 갑니다. 감사합니다.

    2012/05/05 06:05 [ ADDR : EDIT/ DEL : REPLY ]
  18. 여기 +를 누르시면 Release를 복사할수 있어요.. 후에 이름을 Distrubution으로 변경 후 CodeSign을 변경해서 쓰시면 되겠죠.. 릴리즈 모드에서 테스트 하실일이 많으실 테니 릴리즈를 배포용

    2012/05/11 17:13 [ ADDR : EDIT/ DEL : REPLY ]

IPhone4에서 웹페이지를 보다보면, 이미지가 살짝 깨져 보이는 경우가 있다.
Retina Display의 해상도 때문인데, 해결책은
2배 큰 이미지 만든 후,  Retina Display용 CSS 적용하면 된다.

1. 2배 큰 이미지 만들기
Retina Display가 기존 IPhone해상도의 2배로 커졌으니, 해당 이미지들도 2배 크게 만든 후 적용 시키면 된다.
예를들어 20x20 아이콘이었다면 40x40으로 만들면 된다.

2. 불러오기
자 그럼 Retina Display용 CSS는 어떻게 불러오느냐?
핵심은 Media Query!
Retina Display용 CSS의 Media Query를
screen and (-webkit-min-device-pixel-ratio: 2)
로 해주면 된다.

아이폰에서는 Safari로 접속을 하므로 Webkit CSS를 써도 무관하지만.. 이런식으로 특정 Browser에 Dependent된 기술은 바람직하지 않다고 생각한다. 이 문제는 할일이 없어 시간이 엄청 남아돌때 포스팅 하기로 하고..
CSS 로드 케이스별로 보면.

1. Retina Display용 CSS 파일을 만들경우
<link rel="stylesheet" href="retina.css" type="text/css" media="only screen and (-webkit-min-device-pixel-ratio: 2)" title="title" charset="utf-8">

2. html안에서 Retina Display용 CSS를 추가할 경우
<style type="text/css" media="only screen and (-webkit-min-device-pixel-ratio: 2)">

3. 일반 CSS안에 Retina Display용 CSS를 추가할 경우
@media screen and (-webkit-min-device-pixel-ratio:2)
    #icon {
        ....
    }
}
이런 방식으로 추가를 하면 된다.

3. 적용 방법
마지막으로 적용방법이다.
기존의 코드는 손대지 말고, Retina Display용 CSS만 추가하면 된다.
background-image: url("icon40x40.png");
-webkit-background-size:20px 20px;
이런식으로 2배 커진 이미지를 배경이미지로 Overwrite하고, 
배경 이미지 크기를 기존 아이콘의 사이즈로 적어주면 된다.


배경이 아닌 일반 이미지 또한 2배로 크게 만들고 강제로 기존 사이즈 적어주면 되긴 하는데..
이 경우는 접속 환경의 Retina Display인지 아닌지 구분할 수 없다는 문제점이 있다.
하지만 아래 나온 class 할당 방식으로 해결할 수 있긴 하지만 바람직한 방법은 아닌듯 하며, 
번거롭지만 배경이미지로 바꾸는게 나아보인다.


배경이미지외 
Retina Display에만 특별히 적용을 해야 할 경우  class를 부여해서 조절하는 방법이 있다.
.forWeb { display: block }
.onlyRetina { display: none }

@media screen and (-webkit-min-device-pixel-ratio:2) { 
    .forWeb { display: none }
    .onlyRetina { display: block }
}

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/184 관련글 쓰기

댓글을 달아 주세요

  1. 배로 크게 만들고 강제로 기존 사이즈 적어주면 되긴 하는데..
    이 경우는 접속 환경의 Retina Display인지 아닌지 구분할 수 없다는 문제점이 있다.
    하지만 아래 나온 class 할당 방식으로 해결할 수 있긴 하지만 바람직한 방법은 아닌듯 하며,
    번거롭지만 배경이미지로 바꾸는게 나아보인다.

    2012/04/27 06:15 [ ADDR : EDIT/ DEL : REPLY ]

궁시렁*22011/03/04 09:13

  • wifi 미지원: 사실 크게 중요하진 않았지만.. 요즘 같은 시대에 기본이기도 한..
  • 보라색 후드티가 진행요원임이 확실히 인지가 안된점.
  • 마찬가지로 자봉단들이 자봉단인지 못알아봤다는 점: 자봉단을 구분할 수 있는건 자봉단임을 알 수 있게 행동을 하거나, 목에 걸고 있는 네임텍뿐이었는데.. 인지가 쉽지 않았음.
  • 보라색 후드티들이 자꾸 들락거려서, 컨퍼런스에 집중할 수 없었던 점: 강의실 멘 뒤에 진행요원 한명이 자리를 지키고 앉아있고, 요원들끼리 커뮤니케이션은 문자나 채팅등으로 했었다면..
  • 강의실 문을 열어놓고, 자유롭게 입/출입이 가능했어야 함: 강의실 문을 닫아버리니, 강의중에 나가기도 들어오기도 참 애매한 상황. 그리고 문 열어놓으면 보라돌이들의 출입으로 인한 방해가 덜 되는 효과도 함께..
  • 접수 데스크가 오프닝과 너무 멀고, 코너를 돌아야 나타나다보니 보이지 않는 문제점.
  • 강의실 찾기가 힘들었던 점.
  • 시각적인 Guide가 부족했던 점(위 항목과 같은 얘기임): 자봉단이 서서 안내를 했지만, 자봉단이 자봉단임을 인지하기가 쉽지 않았으므로..
  • 시간표가 바뀌었을때에 대한 안내가 부족했던 점.
  • 클로징


유료인데 반해, 진행이 전반적으로 아마추어스러웠던듯 하다.

물런 우리가 전문 행사 진행자들이 아니니 그렇긴 합니다만. 돈내고 들으로 온 사람의 입장에서는 그렇지 않을터이니.. 



그래도 모두 자원봉사로 이루어진 운영 및 자봉팀에게 박수를!DSC_8549


보너스로 단독샷!

DSC_8316

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/183 관련글 쓰기

댓글을 달아 주세요

궁시렁*22011/02/22 18:46
1.천재들은 20대에 성공한다
내가 천재라는 얘기가 아니라.. 성공은 20대에 하는것이라고 생각한다.
이제 얼마 안남았다는 조바심.

2. 서비스 오픈
월급쟁이로 성공하기보단, 내가 만든 서비스로 성공을 하고픈데..
기획했던 서비스들.. 1년에 3~4개씩 오픈은 해야 하는데.. 쉽지 않다.
기획하는것도 압박, 개발하는것도 압박.
디자인은.. GG

3. 웹
요즘 HTML5, CSS3가 난리다. 말도 아니다.
사실 이것들의 난이도는 높지 않다. 하지만 너무 량이 너무 많은게 탈.
각종 SNS, 블로그등에서 매일매일 쏳아져 나오다보니, "아.. 이것들 팔로업해야 하는데.." 라는 조바심
은근 스트레스다.

4. 접근성
이러한 신기술이 등장함에 따라, 신기술에 적용될 접근성에 대해 공부해야 한다는 압박감.

5. 개발자
개발자로써 신기술에 대한 꾸준한 학습이 필요하다는 압박.

6. 골프
주변에 사람들이 한살이라도 젊을때 골프를 배우라고들 난리다.
필드만 안나가면 큰 돈이 나가는것도 아니니 많은 부담이 되는것은 아니지만..
빨리 배워야 한다는것에 대한 압박.

7. 직장내의 성공
직장내에서도 원만한 인간관계와 유능한 개발자로 인정을 받아야 한다는 억압감.
하지만 월급쟁이로 평생 살게 아니기 때문에..

8. 자녀
양가 부모님들의 2세 압박.

9. 수입
돈 많이 벌어야 한다는 압박감.

10. 재태크
재테크 공부해야 된다는 압박감.


회사에서는, 
3. 웹 신기술 학습
5. 개발자로써의 학습
7. 직장내의 성공
정도는 할 수 있겠지.

퇴근하고 나면.
1. 개인 프로젝트
만 해도 시간이 부족한데..


정리해보면..
회사에서 인정받으면서, 개인 프로젝트도 꾸준히 진행해서 틈틈이 오픈을 하고..
HTML5, CSS3, Ruby On Rails, UX, 웹 트랜드, Javascript, ObjectiveC, IPhone, IPad, Android 등 신기술들과 개발 동향을 쉬지않고 항상 파악해야 하며.. 헉헉헉;;
새로운 신기술에 맞춰 접근성은 어떻게 변화되고 적용할 수 있는지 공부해야 하고.
그러면서 여과시간을 만들어 골프도 배워야 하고.
2세도 낳아야 하고.. 2세 먹어살리려면 +@의 수입이 많아야 하고.
그렇게 번 돈을 어떻게 굴려먹을것인지 공부해야 되는 상황

젠장.. 숨은 쉬고 살고 있는건가?
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis
TAG 압박감

TRACKBACK http://hiphapis.net/trackback/182 관련글 쓰기

댓글을 달아 주세요

  1. flutia

    압박감에 시달리면 오히려 성공과 거리가 멀어지지 않을까하는~ ㅎㅎ

    2011/02/22 23:38 [ ADDR : EDIT/ DEL : REPLY ]
    • 형. 오랜만이야~ ㅎㅎ
      그치~?
      이 압박감을 빨리 벗어던지고, 즐기며 삻아야 하는데.. ㅠ,.ㅠ

      2011/02/23 14:12 [ ADDR : EDIT/ DEL ]

Ruby On Rails/작은 팁2011/02/01 10:04
devise는 restful-authentication과 유사한 놈이라고 생각하면 된다.
readme에 약간의 레퍼런스가 제공되며 github의 wiki에 예제들이 제공되고 있다.
물런 rdoc도 있다.

1. devise Gem Download & Install
Gemfile
gem 'devise', '1.1.3'
Rails 2 사용자는 Rails 2용 최신 Version을 찾아서 넣어주면 되고, Rails 3유저라면 구지 버전을 적어줄 필요는 없다.
bundle install


2. devise Install
rails g devise:install
딸랑 2개의 파일만 만든다.
config/initializers/devise.rb
config/locales/devise.en.yml
devise:install를 해줘야 generator가 추가가 된다.

environment/development.rb
config.action_mailer.default_url_options = { :host => 'localhost:3000' }
추가


3. devise Initialize
rails g devise User
User Model과 Migration을 생성하고 Routes.rb파일에 관련 route가 추가된다.


4. Ready
user.rb에 들어가보면 
devise :database_authenticatable, :registerable, :recoverable, :rememberable, :trackable, :validatable
이 기본적으로 적혀져 있고
# :token_authenticatable, :confirmable, :lockable and :timeoutable
들은 제외되어 있다.
만약 제외되어 있는 이 옵션들을 사용하고 싶다면 migration파일(create_user)
의 해당 옵션들 주석도 제거를 해주어야 한다.

각 옵션들에 대한 설명은 README에 있다. 
해석은 알아서..
  • Database Authenticatable: encrypts and stores a password in the database to validate the authenticity of anuser while signing in. The authentication can be done both through POST requests or HTTP Basic Authentication.
  • Token Authenticatable: signs in a user based on an authentication token (also known as "single access token"). The token can be given both through query string or HTTP Basic Authentication.
  • Omniauthable: adds Omniauth (github.com/intridea/omniauth) support;
  • Confirmable: sends emails with confirmation instructions and verifies whether an account is already confirmed during sign in.
  • Recoverable: resets the user password and sends reset instructions.
  • Registerable: handles signing up users through a registration process, also allowing them to edit and destroy their account.
  • Rememberable: manages generating and clearing a token for remembering the user from a saved cookie.
  • Trackable: tracks sign in count, timestamps and IP address.
  • Timeoutable: expires sessions that have no activity in a specified period of time.
  • Validatable: provides validations of email and password. It’s optional and can be customized, so you’re able to define your own validations.
  • Lockable: locks an account after a specified number of failed sign-in attempts. Can unlock via email or after a specified time period.
  • Encryptable: adds support of other authentication mechanisms besides the built-in Bcrypt (the default).

모든 설정이 완료가 되면 상큼한 마음으로 rake
rake db:migrate


5. Setting
migration까지 했으니, 비로서 사용이 가능하다.
하지만 입맛에 맞게 사용할려면 수정 작업이 필요하다.
각종 url이 [:model_name]/sign_in 형식이라 초기 로그인 url이 users/sign_in임으로 관련된 views도 수정을 해주어야 한다.

5.1 Routes.rb
  devise_for :users do
    get 'signin' => 'devise/sessions#new'
    post 'signin' => 'devise/sessions#create'
    get 'signout' => 'devise/sessions#destroy'
    
    get 'signup' => 'devise/registrations#new'
    post 'signup' => 'devise/registrations#create'
  end
여기서 단점은 devise가 기본적으로 사용하는 path들을 overwrite할 수 없으므로, 모든 view파일에 가서 path를 수정해줘야 한다.
예를들어 로그인같으면
<%= link_to new_user_session_path%>
<%= link_to signin_path%>
로 일일이 하나하나 찾아서 수정을 해줘야 하는것이다.

물런 안해줘도 그만. 
하지만 난 url 하나하나에 의미를 부여하고 목숨같이(는 아니지만..) 여기기 때문에, url 구조는 절대 포기할 수 없다.
이것역시 중요한 사용자 경험이라 생각하기 때문에!!

암튼, 중요한 사용자 경험때문에 코드를 전부 수정하는 삽질을 할것이냐?
다행스럽게도 해결책이 존재한다.
  devise_for :users
  devise_scope :user do
    get 'signin' => 'devise/sessions#new', :as => :new_user_session
    post 'signin' => 'devise/sessions#create', :as => :user_session
    get 'signout' => 'devise/sessions#destroy', :as => :destroy_user_session
    
    get 'signup' => 'devise/registrations#new', :as => :new_user_registration
    post 'signup' => 'devise/registrations#create', :as => :user_registration
  end
이런식으로 overwrite를 하는것이다. 뭐 일종의 꽁수이다.

5.2 password length
devise의 자체적인 설정같은 경우는 /config/initializers/devise.rb 에 거의 다 있으며, password lenth또한 마찬가지로 이곳에 있다.
config.password_length = 6..20

5.3 Views
gem에서 View 파일을 불러오는 형태여서, 프로젝트 디렉토리에 파일이 존재하지 않는다.
rails g devise:views users
해주면 /app/views/users 에 각종 view 파일들이 생기게 되고,

/config/initializers/devise.rb
config.scoped_views = true
해주면 gem에서 views를 땡겨오는게 아니라, 프로젝트 디렉토리에 있는 views를 사용하게 되므로, 입맛에 맛게 수정하면 된다.

5.4 login id
로그인을 email이 아닌 id로 받을려면 몇가지 수정 작업을 해주어야 한다.
devise는 email 정보만 받고 있으므로, user에 login_id를 추가해줘야 한다.
여기서는 field명을 name으로 하겠다.
rails generate migration add_name_to_users name:string
rake db:migrate

추가해준 name을 model에 등록 한다.
user.rb
attr_accessible :name

그리고 devise에 로그인시 email이 아닌 name을 사용할것이라고 알려줘야 한다.
/config/initializers/devise.rb
config.authentication_keys = [ :name ]
authentication_keys를 :name으로 등록을 해준다.

마지막으로 login form(in views)에 email이 아닌 name으로 id입력을 받도록 수정해주면 된다.

5.5 controller customized (after signup)
얼마전 찾아보니, 1.2.rc에 이 기능이 추가되었다고 한다. https://github.com/plataformatec/devise/wiki/How-To:-Redirect-after-registration-(sign-up)
아래 쓴 내용은 이제 필요 없을듯. 

더보기


6. Usage
6.1 restful-authentication에서 login_reqired와 같은 역활을 하는 authenticate_user!
before_filter :authenticate_user!

6.2 로그인 여부
user_signed_in?

6.3 현재 유저
current_user

6.4 session route path_name
(#action_name)user_session

6.5 Sample
<% if user_signed_in? %>
  <%= link_to('Logout', destroy_user_session_path) %>        
<% else %>
  <%= link_to('Login', new_user_session_path)  %>  
<% end %>
<br />
  User: 
  <% if current_user %>
    <%= current_user.email %>
  <% else %>
    (not logged in)
  <% end %>
</li>
restful-authentication의 _user_bar 같은 녀석이 과거에는 menu라는 디렉토리에 제공이 되었었는데, 버전업이 되면서 사라졌나보다. 해당 코드는 아래 링크서 확인할 수 있으므로 Copy&Paste해서 쓸 사람은 쓰면 될듯.


7. Conclusion
7.1 장점
devise코드는 다 감추어져있어, 프로젝트에서 코드와 파일이 깔끔해진다.
필요한 부분만 customizing이 가능하다.

7.2 단점
controller를 customizing할때는 직접 파일을 만들어서 해야 한다.
customize할려면 restful-authentication보다 손이 많이 간다.

7.3 총평 
일반적인 유저 시스템이라면 아주 유익하지만,
로그인 및 회원가입 프로세스상 수정이 필요할 경우, 이를 customize하는게 좀 불편할 수 있음.


8. 참조 URL

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/181 관련글 쓰기

댓글을 달아 주세요

Ruby On Rails/작은 팁2011/01/28 14:49
한동안 IPhone, IPad, Android 개발하다가, 잠들어 있던 개인프로젝트를 다시 시작할려고 맘을 먹었다.
Rails2 기반이어서, 깔끔하게 새로 만들자는 마음으로 Rails3를 설치를 했다.

Rails3로 넘어가면서 어떤것들이 바뀌었나 찾아보고 Railscasts도 보면서 틈틈이 학습을 해놓았지만..
역시 난관은 있었다.
내가 부닥쳤던 난관들을 정리해서 올리면, 어떤분은(한분이라도..) 도움을 받으시지 않을까 하는 소박한 희망에 몇자 끄적여본다.

이상하다. 문명히 예전에는 plugin install하고 script/generator 로 initialize를 했었는데..
Could not find generator authentiaceted.
이리저리 찾아봐도 별다른 말은 없고 technoweenie의 restful-authentication이 아닌 satin의 restful-authentication만 딸랑 링크가 걸려있다.
Sation의 restful-authentication의 install 설명을 봐도, 내가 한것과 틀린것이 없다.
아 뭐지 -ㅅ-;;
그러던 찰라
"아. technoweenie가 아직 Rails3 버전을 안맞들었고, Sation은 작업을 해놓은건가?" 라는 의문이 생기고..
Sation걸로 install을 하고 initialize하니 잘 된다.

하지만 막상 사용할려고 하면
uninitialized constant ApplicationController::AuthenticatedSystem
라고 한다. 
include AuthenticatedSystem
require File.join(Rails.root, 'lib', 'authenticated_system.rb')
로 바꿔주니깐 되긴 하는데, lib아래 있는 모든 파일을 이렇게 불러올 수 는 없는 노릇.
뭔가 더 스마트한 방법이 있을것 같긴한데.. Railscasts에서 이 내용을 본것같아 이리저리 뒤져봐도 못찾고.
결국 구글링으로 알아냈다.

application.rb 에다가
config.autoload_paths << File.join(config.root, "lib")
해주면 된다.

2. haml
예전에는 gem으로 설치하고, 그 후에 plugin install을 해줬어야 했다.
난 당연히 plugin install을 했는데, 왠걸 initialize가 제대로 안된다.
vendor/plugin/haml보니 init.rb은 있는데 0 bytes고..
haml을 initialize하면 생기는 파일은 init.rb 딸랑 하나인데, 이 녀석이 하는 일은 haml gem을 불러오는것 뿐이다.

그런데.....
Rails3부터 bundler가 추가되면서 Gemfile이라는게 생겼다, init.rb가 존재해야 할 명분이 사라져 버린것이다.
init.rb가 하던일을 Gemfile에 gem 'haml' 적어주면 끝나니 말이다.

Gemfile에
gem 'haml'
을 적어주고,
$user> bundle install
하면 끝.

3. Routes => :path_prefix
내가 작업했던 수없이 많은 개인 프로젝트(오픈한것은 NA;;)들의 Routes에는 :path_prefix가 꼭 사용되었었다.
근데, Rails 3로 오면서 이녀석 Deprecated.....;;
혹시나 하는 마음에
scope ":user_login" do
해봤는데 안된다. 
혹시나 하는 마음에 한번더 시도를 해보았는데
scope "(/:user_login)" do
이렇게 하니 된다. 
예전에는 resources 하나하나 모두 :path_prefix를 적어주어야 하는 번거로움이 있었는데
이와 같은 방식으로 변해서, 보다 깔끔하게 코드를 작성할 수 있게 되었다.



ps. 작업하다 추가되는것들은 모아놨다가 또 포스팅할 계획임.
ps2. 한국루비사용자모임도 죽은지 오래.. 살아있는 Ruby Forum이 없는것 같은데.. 하나 만들까 -ㅅ-;
도메인은 사놓은게 있긴 한데..
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/180 관련글 쓰기

댓글을 달아 주세요

  1. 루비레일스 개발자

    오픈하신다면 저도 동참하고 싶네요!!

    요즘 JSP가 난무하는 세상에서 Rails를 좀더 알리고 싶네요.
    이제 6개월째 입문해서 잘 쓰고 있는데,
    여러가지 정보를 공유해보고 싶네요.

    Ruby on Rails의 경우엔 정말 국내엔 거의 없어서 정보 얻기가 힘들었는데..
    이런게 하나 있다면 저도 적극 동참해보고 싶습니다.

    2011/09/12 20:35 [ ADDR : EDIT/ DEL : REPLY ]
  2. 레일스 입문자

    정말 생겼으면 좋겠습니다. ㅠ.ㅠ 레일스.. 한땐 붐이 일었었는데 왜 이렇게 침체기에 빠져버린 걸까요..? 루비 자체가 상당히 훌륭하고 발전가능성이 큰 언어라 생각하는데... 슬프네요..

    2011/09/30 15:22 [ ADDR : EDIT/ DEL : REPLY ]

IPhone & IPad/생각2011/01/14 11:34
이번주 앱 다운로드 통계를 보는데.. 갑자기 확~~~~~~~~ 뛰어서
뭐지? 했는데..
알고보니 앱스토어에서 첫번째로 나왔었네요. ㅎㅎ
(아, 아마 아이패드 앱스토어에서만 보일꺼에요)

다행이 이 장면을 회사 동료가 캡쳐해놔서.. 흙
아이패드 앱스토어 메인 페이지에, 최신 및 주목받는 Apps에 머니투데이 탭'
지금 들어가보니 2번째 Page에서 첫번째로 나오네요. ㅎㅎ

인기무료앱은 14위! ㅠ,.ㅠ
아이패드 앱스토어 인기차트에 14위로 랭크되어 있는 '머니투데이 탭'


뉴스 카테고리에선 2위!
아이패드 앱스토어 뉴스 카테고리에 2위로 랭크되어 있는 '머니투데이 탭'


이런거 전혀 신경 안쓰고 살았는데..
왠지 기분이 좋군요!
냐하하하

아이튠즈로 접속해봣는데, 여기서도 나오네요 ㅎㅎ
아이튠즈를 이용해 접속한 아이패드 앱스토어에 등록된 '머니투데이 탭'


http://itunes.apple.com/kr/app/id397734521?mt=8
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/179 관련글 쓰기

댓글을 달아 주세요

  1. 축하해요~

    2011/01/14 22:04 [ ADDR : EDIT/ DEL : REPLY ]
  2. 오오 축하해요 ㅋ

    2011/01/15 20:45 [ ADDR : EDIT/ DEL : REPLY ]

IPhone & IPad/작은 팁2010/08/09 10:53
푸쉬하다가 인증서가 엉켜서 새로 인증서를 받고 추가를 할려니..
아래와 같은 에러 메세지를 꽥 내고.. 인증서 추가를 안해주더군요. 고얀놈!
자 모두 함께 읽어보고 이해해봅시다.

 
 "시스템 루트" 키체인을 수정할 수 없습니다.
루 트 인증의 신뢰 여부를 변경하려면, 키체인 연결에 있는 루트 인증을 열고 신뢰 설정을 수정하십시오. 현재 사용자를 위해 새로운 루트 인증을 로그인 키체인으로 추가하거나 이 컴퓨터의 모든 사용자가 공유해야 한다면 시스템 키체인으로 추가해야 합니다

응? 읽어봐도 문말인지 모르겠습니다.
이것 때문에 보낸 시간과 스트레스를 생각하면..

해결방법은 간단합니다.
다운받은 인증서를 Drag&Drop으로 키체인의 로그인에 놓으면 됩니다.


결국 문제는 Double-Click시 멍청한 눈탱이표범이 시스템 루트로 인증서를 추가하려 했던것이지요.
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/177 관련글 쓰기

댓글을 달아 주세요

IPhone & IPad/작은 팁2010/07/22 12:48

UIView.backgroundColor = [UIColor clearColor];



ps. IB에서 Opaque, Alpha 조절해도 투명 안될때 해보세요.

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/176 관련글 쓰기

댓글을 달아 주세요

IPhone & IPad/작은 팁2010/07/05 18:05
GlobalVariable.m

static NSString *GlobalVariable;


@implementation GlobalVariable


...


- (void)setGlobalVariables {

...

GlobalVariable = [[NSString stringWithUTF8String:(char *)sqlite3_column_text(statement, 0)] retain];

}

여기서 중요한것은 SQLite에서 뽑아온 값을 retain 하는것입니다.
물런 그냥 NSString도 마찬가지겠죠?

뭐 이유는 당연히 릴리즈때문. ㅎㅎ;

ps. 다들 아실만한 것들이라.. 올리기도 민망한;;
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/175 관련글 쓰기

댓글을 달아 주세요

IPhone & IPad/작은 팁2010/06/28 16:50

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {

return YES;

}


했는데도 Rotate가 안될때.


pushViewController할때의 코드가 만약 alloc만으로 되어 있는 코드라면


subView = [subViewController alloc];

[navigationController pushViewController:subView animated:YES];


initialize한 후 pushViewController를 하면 됩니다.


subViewController = *subView = [[subViewController allocinit];

[navigationController pushViewController:subView animated:YES];

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/174 관련글 쓰기

댓글을 달아 주세요

IPhone & IPad/작은 팁2010/04/30 06:02

- 증상

앱 개발중 sqlite부분을 구현중이었습니다.

어느순간부터 컴파일시 이유를 알 수 없는 에러가 뜨더군요.

ld: warning: in /Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.1.sdk/usr/lib/libsqlite3.0.dylib, missing required architecture i386 in file
ld: warning: in /Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.1.sdk/usr/lib/libSystem.dylib, missing required architecture i386 in file
ld: in /Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.1.sdk/usr/lib/libobjc.A.dylib, missing required architecture i386 in file
collect2: ld returned 1 exit status
Command /Developer/Platforms/iPhoneSimulator.platform/Developer/usr/bin/gcc-4.2 failed with exit code 1

(결론만 알고 싶은분은 아래로 스크롤 퀵다운 하세요 ㅎㅎ)



-하소연잡소리

어느라인에서 에러가 났는지 트래킹도 안해주더군요..

이때 직감했습니다.. "지금시각 새벽3시.. 오늘 잠 다잤다."


sqlite붙이면서 작성했던 코드.. 메쏘드 하나씩 주석으로 처리를 했는데도.. 여전히 저 에러는 뜨더군요.

그래서 코드자체를 지워봤는데도.. 여전히 뜨는겁니다.

혹시나 싶어 초창기때 떠논 스냅샷으로 했는데도 뜨더군요.

이때 직감했습니다.. "지금시각 새벽 3시 30분.. 오늘 잠 다잤다."



맥부기와서 "gcc-4.2 failed with exit code 1"로 검색을 해봅니다.

질문글들은 있는데.. 대부분 무플.. 그나마 있는 답변은 저랑 케이스가 안맞더군요.


구글에서 검색했습니다.

역시 건질거 없습니다.


포기하고 잘까하다가..

시뮬레이터 버전을 바꿔봅니다.

역시 변하는거 없습니다.


침착하게 맘먹고.. 에러코드를 찬찬히 봅니다.

그랬더니 눈에 안보이던 에러코드가 보입니다.

d: warning: in /Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.1.sdk/usr/lib/libsqlite3.0.dylib, missing required architecture i386 in file
ld: warning: in /Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.1.sdk/usr/lib/libSystem.dylib, missing required architecture i386 in file
ld: in /Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.1.sdk/usr/lib/libobjc.A.dylib, missing required architecture i386 in file

이번에 추가한 libsqlite3.0.dylib는 링크파일이어서 못찾나? 했는데...

libSystem.dylib랑 libobj.cd.A.dylib은 기존에 있던것들인데 missing이라고 하는게 의심스럽더군요.

이때 직감했습니다.. "오늘밤 잘 수 있겠구나.."


다시 맥부기로와서

"missing required architecture i386 in file" 검색합니다.

와우!!! 검색결과가 없답니다....


구글로 가서 검색을 합니다.

그중 뭔가 냄새가 나는글을 포착.. 링크에 링크를 타다보니.. stackoverflow.com에 저와 동일한 증상에 대한 질문이 있고 답글이 있더군요. (제가 RoR하는데 종종 stackoverflow.com에서 도움받았는데.. stackoverflow.com최고!!)

거기에 나와있는 해결책대로하니..

젠장......... 잘됩니다 ㅠ,.ㅠ

지쟈스.. 감사합니다. ㅠ,.ㅠ

이거 안되면

#1 일단 걍 잔다

#2 아침에 SDK새로깐다.

#3 그래도 안되면 다....다...다....다시 짠다.


자.. 저의 재미없는 하소연을 읽느라 지루하셨죠~?

이제 그 마법의 비법을 소개해드리겠습니다.



- 해결책

#1 문제가 있는 프로젝트의 프로젝트코드를 textmate나 textedit같은 text editor로 열어제낍니다.

예) example.xcodeproj

전 textmate로 열었습니다.


#2 textmate로 열면 3개의 파일이 나타나는데 그 중 project.pbxproj를 오픈합니다.



#3 그리고 FRAMEWORK_SEARCH_PATHS 혹은 LIBRARY_SEARCH_PATHS의 경로를 상황에 맞게 적절하게 수정해줍니다.

저같은 경우 이렇게 되어 있더군요.

LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(DEVELOPER_DIR)/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.1.sdk/usr/lib\"",
"\"$(DEVELOPER_DIR)/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.0.sdk/usr/lib\"",
);

네.. 그렇습니다 문제는 여기 있었던겁니다.

외부 프레임웤 파일을 추가할때(libsqlite3)이 경로도 변경이 된 것이죠... -ㅅ-; 버그죠. (전 스노우 레오파드입니다.)

벅차오르는 분노와.. 해결할 수 있다는 기쁨과 희망이 오묘하게 교차하는 순간이었습니다. ㅎㅎ

전 아래와 같이 수정해주었습니다.

LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"\"$(DEVELOPER_DIR)/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.1.sdk/System/Library/Frameworks\"",
"\"$(DEVELOPER_DIR)/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS3.0.sdk/System/Library/Frameworks\"",
);


이렇게 수정후 컴파일하니.. 시뮬레이터 잘 뜹니다.

네.. 제가 짠 sqlite부분은 문제가 없었던 것이었습니다.!!! (역시 난 틀리지 않았어!! ㅎㅎ)

정말로 기쁘더군요..

저의 기쁜 마음을 알아주는건지.. 창밖은 서서히 밝아오고..-ㅅ-


문제를 해결한 기쁜마음이 있을때 이렇게 써놓아야지.. 안그러고 자고나면 귀차니즘으로 안쓸걸 알기에..

이렇게 앞뒤문맥따위 예쁘게 무시해버린 글을 휘갈겨놓습니다.


참고링크http://stackoverflow.com/questions/1456185/build-error-missing-required-architecture-i386-in-file/1467238#1467238

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/173 관련글 쓰기

  1. hiphapis의 생각  삭제

    2010/05/02 18:56TRACKBACK FROM hiphapis' me2DAY

    아이폰 앱개발시 코드는 문제 없는데 이유를 알 수 없는 에러가 날때..

댓글을 달아 주세요

  1. coreagt

    감사합니다.
    덕분에 해결했습니다.
    저 같은 경우엔 simulator 쪽 library 경로를 주석 처리 하니 잘 되었네요.

    2011/02/17 11:17 [ ADDR : EDIT/ DEL : REPLY ]
  2. NewToXcode

    *.xcodeproj 경로;;;?? 잘모르겠어요... project.pbxprj 파일또한;;; 어디있는지;

    2011/05/30 02:13 [ ADDR : EDIT/ DEL : REPLY ]
    • xcodeproj는, xcode에서 프로젝트를 생성했을시 생기는 파일입니다.
      이 파일을 열면 해당 프로젝트가 xcode에서 열리게 되지요.

      pbxprj는, 위에 적은 xcodeproj를 textmate(혹은 textedit등의 text기반 editor)로 여시면 나오는 파일입니다.

      2011/06/02 14:42 [ ADDR : EDIT/ DEL ]
  3. 감사합니다.
    거슬리는 오류였는데.. 덕분에 해결 되었네요~!! ^^
    즐거운 하루 보내십시용~! ^^

    2011/07/01 16:52 [ ADDR : EDIT/ DEL : REPLY ]
  4. textmate

    텍스트 메이트를 썼는데 작성자님처럼 안나와요....

    ImageTargets.xcodeproj/
    project.pbxproj
    project.xcworkspace/
    contents.xcworkspacedata
    xcuserdata/
    whalesprogram.xcuserdatad/
    UserInterfaceState.xcuserstate
    xcuserdata/
    whalesprogram.xcuserdatad/
    xcschemes/
    ImageTargets.xcscheme
    xcschememanagement.plist
    이렇게만 뜨고 선택할수없던데 이건 왜그런건가요?

    2011/08/03 14:36 [ ADDR : EDIT/ DEL : REPLY ]
  5. textedit 로 열면 .xcodeproj 파일이 안열리네요 ㅠㅠ
    비활성화된 버튼상태 ㅠㅠ

    2011/08/06 14:28 [ ADDR : EDIT/ DEL : REPLY ]

얼마전 옥션에서 그란투스리모5를 구매를 했다.
나는 가난하기 때문에 신품보다 고작 5천원 싼 가격에 중고를 구입했다. (다음날 새벽 7시에 문자가 왔다.. 재고없어 주문취소했다고.. 덕분에 직접 TM가서 옥션보다 싼 가격에 구입했다.)
난 절대 플스3, 로지텍 드라이빙 포스 GT를 장만했다는걸 자랑하기 위해 이 글을 쓰는 건 아니다.

타이틀(플스에서 게임CD를 타이틀이라고 함)을 구매하기까지 옥션에 머무른 시간은 고작해서 3~5분..
근데 그동안 난 2번 황당한 경험을 했다.

우선 첫번째.
중요한 정보로 둔갑한 광고.
우측에 파랑색으로 테두리 친 영역을 보면 쪽지쿠폰소식이 왔다고 말한다.
쪽지 도착을 알리고, 쿠폰 도착을 알리는 것은.. Notification라고 할 수 있다.
그리고 이것을 우리나라말로 대충 의역하면 "알림" 혹은 "공지"라고도 할 수 있다.
문제는 이것이 공지사항이 아닌 광고라는 것이다.
왜이래? 한두번 당해봤어? 아마추어같이
라고  얘기할 지 모르겠지만, 잘못된것은 지적해야 한다.
도대체 광고가 왜 공지사항(중요정보)로 둔갑을 해야 하나?
나같이 젊고 웹 계열에 종사하는 사람이라면 저런 광고따위는 단번에 눈치를 채겠지만
그렇지 않으신 분들은 정말로 순수하게 "쪽지가 도착했다는 의미"로 받아들이시고 저 썩을 광고를 클릭하실 것이다.

여기서 엄청난 손실이 일어나게 된다.
자.. 그럼 한번 얼마나 많은 손실이 있는지 알아보자.

1. 시간의 손실
옥션 하루 방문자수를 5분 동안 검색해 봤는데.. 안타깝게도 그런 정보를 찾을 수 없다.
그래서 과거 해킹으로 노출된 회원수가 1,100만명이라는 것을 참고로 가정을 해보겠다.
옥션의 모든 회원이 노출된게 아니라고 알고 있는데 그렇다면 1,100만명보다 많았다는 것이다.
하지만 해킹사건도 있고... 해서 현재 회원을 대략 1,000만명이라고 가정하고..

하루동안 업자가 아닌 나 같은 순수 구매자들이 방문하는 것을 약 10%라고 가정하면 100만명
그 중에서 저런 낚시광고에 속으시는 분을 30%정도로 가정하면 30만명
사용자수를 뽑아냈으니, 이제 시간을 추정해보자.

시선이 광고로 이동하는 시간 + 뇌가 판단하는 시간 = 넉넉하게 0.5초라고 하자.
그리고 마우스가 이동 + 클릭하는 시간 = 1초라고 하자 (일반적으로 0.5초정도 걸리겠지만.. 저런 광고에 속으시는 분들은 대부분 컴퓨터(인터넷)에 익숙치 않으실거라는 판단)
클릭하면 새창이 열리는데 = 3초
새창에서 사이트가 열리는데 4초
다 합하면 = 0.5 + 1 + 3 + 4 = 8.5초라는 값이 나왔다.
생각보다 많이 나왔다고 판단하실 지 모르겠지만.. 안좋은 컴퓨터에서 한다면.. 10초 이상 걸릴 수도 있다.

자, 이제 사용자수와 시간이 나왔다.
옥션의 악의 뿌리 낚시 광고로 인해 300,000명의 유저가 하루에 8.5초씩 쓰잘대기 없는데에 억울하게 시간을 약탈당하는 것이다.
이 시간을 모두 합치면 2,550,000초라는 어마어마한 수가 나온다.
이걸 분으로 변환하면 42,500분이고
이것을 시간으로 변환하면 708.333 시간이다.
이것을 다시 일로 변환하면 29.51일이다.
약 한달 정도의 시간인 것이다.
물런 이것은 1000만이라는 회원수를 바탕으로 내 임의대로 추정해서 도출해낸 결과이므로 신빙성은 없다.

하지만, 소중한 내 시간이 약탈당하는것은 분명한 사실이다.

2. 비용의 손실
광고를 클릭하는 순간일어나는 일은
  1. 내 컴퓨터에서 서버로 "광고"페이지를 요청
  2. 서버에서 내 컴퓨터로 "광고"페이지를 전송
뭐 OSI 7Layers를 말하지 않더라도, 위 2가지 정도면 모두가 알고있는것이다.
자 그럼 실질적으로 소모되는 비용을 따져보자.
  1. 내 컴퓨터에서 서버로 "광고" 페이지를 요청
    1. 요청하면서 전기가 소모
      1. 내 컴퓨터
      2. 케이블 모뎀
      3. ISP 업체
    2. 요청하면서 인터넷망에 트래픽 발생
      1. 트래픽 == 돈이라고 할 수 있음. 즉 비용 발생
  2. 서버에서 내 컴퓨터로 "광고" 페이지를 전송
    1. 여기서 발생하는 비용을 포함시키기는것은 조금 애매해서 제외

물런, 발생하는 비용이 아주 적을 수 도 있다.
하지만 30만명치를 모으면 어떻게 될까?
역시나 엄청난 금액이 나올것이다.

이 금액 합쳐 매년 영양실조로 죽는 1억6천8백만 어린이에게 후원해주면?
(아프리카에서 모친으로부터 에이즈가 유전되는 태아 한명을 치료하는데 40원이 든다.)

그리고 이렇게 전기를 쓸모없는데 사용하는게 정말 싫다.
에너지 절약이 지구를 살리는 길중 하나이기 때문이다.

아.. 흥분해서 얘기가 삼천포로 빠졌네..
다시 맘을 가다듬고


마지막으로 두번째

과거의 경험을 가지고 소비자를 우롱하는 광고

예전에 옥션에서 물건을 구매하니, 할인 쿠폰을 발급해줬던 적이 있다.
이번에도 구매 완료 페이지에서 할인 쿠폰을 준다고 되어 있는데.. 광고였다.

내가 속게 되는 과정을 담은 Eye Tracking이다.





"쿠폰 받기"를 클릭하고 나서 보니.. 왠 광고페이지가 떴다.
황당했다. 더 생각할 것 도 없이 창을 닫고..
다시 옥션페이지로 돌아와보니..
할인쿠폰 위에 "AD 이벤트"라는 이미지를 볼 수 있었다.

이런 User Experience를 악용하여 광고하는것은.. 상도에 어긋나는것 아닌가?
이런건 해선 안되는 일이다.
광고 기획자가 이런걸 기획했다 하더라도, 서비스 기획자(디자이너 및 개발자 포함)가 적극 반대하고 막아야 하는거 아닌가?
옥션정도의 사이트라면 저딴 저질광고를 하지 않더라도 충분히 수입이 나는 회사 아닌가?
저딴 광고올릴려고 ebay가 인수해간건가?

이런 광고를 기획하는 사람들에게 한소리 하고싶다.
두세 시간 들여서 광고 페이지 하나 만드셔서 살림살이 나아지셨습니까?
광고를 볼 의사도 없는 사람들의 시간 8.5초씩 빼앗아 가셔서 생명연장의 꿈을 이루셨습니까?
도대체 왜 다른 사람의 소중한 시간을 빼앗아 가는 겁니까?
도대체 왜 다른 사람의 소중한 돈을 빼앗아 가는 겁니까?


난 "광고는 무조건 나쁘다"라고 말하는게 아니다.
저런 "상도에 어긋나는 썩은 UX를 가진 광고"따위가 맘에 안드는 것이다.
바로 사용자를 우롱하는 UX 말이다.
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/172 관련글 쓰기

댓글을 달아 주세요

  1. charmggae

    헐... 파란색 테두리 오른쪽이 아니라 왼쪽이네요.
    오른쪽에서 찾다가 왼쪽으로 간 시간 0.5초쯤 ㅋㅋ
    대단한 분석입니다^^

    2010/02/20 10:38 [ ADDR : EDIT/ DEL : REPLY ]
  2. rj

    생각해보니 UX를 악용하는 사례 정말 많은 것 같습니다. 최소한 [광고] 라는 문구는 넣어주는 것이 옥션 같은 큰 기업의 최소한의 바른 자세가 아닐까 하는 생각이 드네요. 저는 저런 행위가 UX악용의 차원을 넘어서 옥션의 신뢰를 담보로 한 광고이자 고객과의 신뢰관계를 스스로 저버리는 광고행위로 보여집니다. (포스팅 잘 보고 갑니다~)

    2011/09/07 23:16 [ ADDR : EDIT/ DEL : REPLY ]

전편을 보고 분명 많은 분들이
뭐야? 장난해? 내가 아는거랑 똑같은데? 뭐가 틀리다는거야?
이런 반응을 보이셨을 것이다.
이건 마치 "헤딩태그는 책과 같다고 생각하시면 되요"라고 말한 것과 똑같은듯하다

여러분의 느끼실 그 허탈함에 전편을 포스팅하고 바로 후편을 쓴다.
후편에서는 무엇이 잘못되었는지 집어볼 것이다.


헤딩태그의 잘못된 사례(헤딩태그의 오해)
1. 레이아웃팅 제목으로 사용
어떤 관공서의 사이트에서 CSS를 제거한 모습과 HTML 코드이다. 지금 헤딩태그를 레이아웃팅한 영역의 제목으로 사용하고 있다.

"상단 메뉴", "하단 정보", "하단 링크"가 유의미한 데이터일까? 절대 아니다.
헤딩태그를 의미없는 레이아웃 영역의 제목으로 사용하고 있다. 실제로 많은 관공서의 사이트의 헤딩이 이런식으로 구성되어 있다. 이러한 방식은 올바르지 않은 사용법이다.

2. 제목이라고 하긴 애매모호한 헤딩
레아아웃 영역의 의미도 담고 있는 제목

이건 제목이라고 하긴 애매모호한 헤딩들이다. 그 이유는 레이아웃 영역으로써의 의미도 포함이 되어 있기 때문이다. 그러므로 이러한 사용법 또한 올바르지 않은 사용법이다.

3. 메인메뉴 혹은 서브메뉴를 헤딩으로
(아래의 스샷은 재현을 위해 제가 급조한 것입니다.)
메인메뉴 링크들을 헤딩으로 사용

위 1번과 2번은 쉽게 이해를 했는데, 3번에 와서는 고개를 갸웃하는 분이 계실 듯하다.
유의미한 데이터를 헤딩태그로 사용했는데 왜 문제가 될까?
그 이유는 메인메뉴(혹은 서브메뉴. 이하 메인메뉴로 통일)의 링크들은 헤딩이 아니기 때문이다.
다시말해 메인메뉴는 현재 보고 있는 콘텐츠의 제목이 아닌 링크들의 집합이다.
역시 어렵다. 쉽게말해 메인메뉴는 헤딩이 아니라 목차인것이다.
그러므로 헤딩태그를 사용하지 말고 그냥 a태그로 마크업을 해야 한다.

4. 레벨링
1) 누락
##시 사이트에서, 자유게시판까지의 메뉴 구조가
##시 -> 시만참여 -> 자유게시판

라고 하자. 그런데 디자인된 페이지에는 "시민참여"가 없다.
그래서 아래와 같이 헤딩을 부여했다.
<h1>##시</h1>
<h3>자유게시판</h3>
위 헤딩의 문제점은 h2가 없다는 것이다. 헤딩은 순차적으로 내려가야한다.
<h1>##시</h1>
<h2 class="hidden">시민참여</h2>
<h3>자유게시판</h3>
이렇게 헤딩을 부여하고 h2를 화면에 출력안되게 하는 방법으로 해결을 하면 된다.

2) 부여
또 다른 방법으로는
<h1>##시</h1>
<h2>자유게시판</h2>
이런 식으로 자유게시판을 h2로 마크업하는 것이다.

이쯤에서 다들
"자유게시판은 3depth에 있는 제목인데, h2로 해도 괜찮은거냐?"
라는 의문을 가지실 텐데, 상관없다.
작업하는 페이지 내에서의 헤딩만 부여하면 되는 것이다.
그렇다면
<h1>자유게시판</h1>
이렇게 자유게시판을 h1으로 마크업하는 것은 어떨까?
아마 여러분들은 혼란에 빠지실 것이고, 아래 세가지 의견들일 것이다.

  1. h1에는 사이트 제목이 들어가야 하는데..? (페이지당 h1은 한번만 와야 한다)
  2. h1만 넣으면 이 페이지가 어느 사이트(혹은 어느 위치(뎁스))에 있는지 모를텐데..?
  3. 페이지에 헤딩태그가 하나만(그것도 h1) 있어도 되는건가?

먼저, 1번 h1에는 사이트 제목이 들어가야 하는데..? (페이지당 h1은 한번만 와야 한다)
이것은 논란의 여지가 많은것으로, 전편에 해석에 따라 견해의 차이가 있다고 한 그 부분에 해당되는 내용이다.
실제로 몇해전 웹 접근성/표준쪽의 유명하신 두분이 이것으로 술자리에서 다투셨던 적이 있다.
그 분들의 의견은

    • 사이트명은 책제목과 같고, GNB의 시작점이기 때문에 h1으로 해야하고, 한번만 와야 한다.
    • 아니다

개인적인 의견은 제작자 맘이라고 생각한다. 즉 "아니다"쪽에 가깝다.
그 이유는 헤딩의 목적은 콘텐츠의 제목을 제공하는 것에 있지, GNB를 나타내기 위해 있는것이 아니기 때문이다.
그렇다면 GNB로써 헤딩을 사용하는 것이 잘못된것이냐? 그렇지도 않다. 페이지의 GNB를 콘텐츠의 제목이라고 생각할 수도 있기 때문이다.
전편에서 예를 들었던 "2분기 실적"은 "2009년 A 사업의 2분기 실적"이기 때문에,
"2009 실적 보고서", "A 사업 실적"도 헤딩이 될 수 있다.
그러므로 제작자 맘이라는 것이다

2번, h1만 넣으면 이 페이지가 어느 사이트(혹은 어느 위치(뎁스))에 있는지 모를텐데..?
이것 역시 헤딩을 GNB로써만 이해했기 때문에 생기는 오해이다.
title을 제대로 제공을 했고 정보구조가 제대로 구성되어 있다면 딱히 문제가 되지 않는다는것이 개인적인 견해이다.

3번. 페이지에 헤딩태그가 하나만(그것도 h1) 있어도 되는건가?
문제될 것 없다.

3) 단계
헤딩의 숫자가 의미하는 바는 단계(level)이라고 생각하면 된다.
대메뉴는 제일 큰 헤딩이므로 h1
중메뉴는 두번째로 큰 헤딩이므로 h2
소메뉴는 두번째로 큰 헤딩이므로 h3
이런식으로 레벨링을 하면 된다.
그러므로 대메뉴를 h2, 소메뉴를 h1 이런식으로 정보구조에 위배되게 마크업을 하면 안된다.

5. 중복된 내용
(아래의 스샷은 재현을 위해 제가 급조한 것입니다.)

같은 내용이 반복되는 헤딩
간혹 보면 사이트의 제목이 헤딩에 항상 따라다니는 경우가 있다.
사이트 제작자가 얼마나 사이트를 사랑하고, 자랑하고 싶어하는지 그 마음이 전해진다.
하지만 이것은 좋은 방법이 아니다.
헤딩의 레벨이 낮아지면, 상단의 레벨에 나오는 내용은 생략해도 된다.
<h1>##시</h1>
<h2>홍보관</h2>
이렇게 마크업이 되었으면
##시의 홍보관
이라고 받아들이면 된다.
즉 레벨이 낮아지면 상위 헤딩의 내용이 접두어로 붙은 것으로 여기면 된다.


헤딩이란
하.. 그럼 도대체 어떻게 헤딩을 하란 말이냐?!
전편에서 했던것 그대로 하면 된다.
너무나도 쉬웠던 그것이 바로 정답이다.

헤딩태그가 너무 간략하다보니 오해가 많이 생기는 것 같다.
그 오해의 근본은 무엇이 헤딩인가? 즉 헤딩의 정의에 있는것 같다.
헤딩태그는 헤딩은 페이지의 제목이다.




절대 아니다. 헤딩태그는 페이지의 제목이 아니다.
헤딩은 페이지의 제목이 아니라 콘텐츠의 제목이다.
더 정확하게 이야기를 하면 섹셔닝된 콘텐츠의 제목이다.

전편에 나왔던 "2009 실적 보고서"를 가지고 예를 들어보자.
현재 내가 보고 있는 페이지는 A사업 실적의 2분기 실적을 보고있다면
대제목: 2009 실적 보고서
중제목: A 사업 실적
소제목: 2분기 실적
이게 바로 전편에서 말한 헤딩이다. 이것을 코드화하면
<h1>2009 실적 보고서</h1>
<h2>A 사업 실적</h2>
<h3>2분기 실적</h3>
이렇게 된다.
이게 아닌 다른것은 헤딩이 되면 안된다.

자, 그럼 상황을 바꿔보자
현재 내가 보고 있는 페이지에는 A사업의 모든 정보가 다 나온다고 하자.
그렇다면 어떻게 헤딩을 구조해야 할까?
대제목: 2009 실적 보고서
중제목: A 사업 실적
소제목: 1분기 실적
소제목: 2분기 실적
소제목: 3분기 실적
소제목: 4분기 실적
소제목: 전년과 비교
소제목: 총평
이렇게 될 것이고, 코드화를 하면
<h1>2009 실적 보고서</h1>
<h2>A 사업 실적</h2>
<h3>1분기 실적</h3>
~~
<h3>2분기 실적</h3>
~~
<h3>3분기 실적</h3>
~~
<h3>4분기 실적</h3>
~~
<h3>전년과 비교</h3>
~~
<h3>총평</h3>
~~
이렇게 코드화가 된다.
"총평"이 "2009 실적 보고서의 총평"인지, "A 사업 실적의 총평"인지 걱정하지 않아도 된다.
h3의 상위레벨의 헤딩태그 h2에 이미 "A 사업 실적"이라는 내용이 있으므로, "A 사업 실적의 총평"이 되는 것이다.

정리를 하면
  1. 내가 보고 있는 페이지의
  2. 콘텐츠를 섹셔닝(구분)하고
  3. 각 섹션마다 콘텐츠에 알맞는 헤딩을

부여하면 되는 것이다.

결론
여기에 나온 잘못된 사례말고도 찾아보면 더 많은 방법으로 잘못 사용되고 있을 것이다.
중요한것은, 디자인된 시안을 받고 코딩을 할때 레이아웃팅만 해야 하는 것이 아니다.
콘텐츠도 레이아웃팅을 해야한다. 그리고 그에 적절한 헤딩태그도 제공을 해야한다.


덧.
콘텐츠를 레이아웃팅 하는 것을 HTML코더만의 몫이라고 하기는 힘들다.
콘텐츠를 만든 사람(대부분의 경우 기획자)이 가장 큰 책임을 지고 있는 것이다.
설계가 이상하게 되어있는데 어떻게 올바르게 시공이 되겠는가.

하나의 페이지에 여러개의 목적을 가진 콘텐츠들이 뒤죽박죽 썩여있다면, 그것은 기획을 잘못한 것이고 UX 또한 고려하지 않은 것이다.
크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/171 관련글 쓰기

  1. hiphapis의 생각  삭제

    2010/01/10 21:07TRACKBACK FROM hiphapis' me2DAY

    사실은 전편 쓰자마자 바로 후편을 썻지만.. 지금에서야 퍼블리싱한 헤딩 제대로 사용하기(후편)

댓글을 달아 주세요

  1. ㅇㅅㅇ

    잘 읽고 갑니다

    2010/01/24 01:05 [ ADDR : EDIT/ DEL : REPLY ]
  2. 김재성

    4 2)에 부여는 조금 의견차가있는데요
    만약 저 예제가 특정 페이지의 경우라면
    해딩 태그를 제목표시하는것 이외에 실제 사용자는 사이트 레이아웃을 이해하는 용도로 사용되고 있기에
    한사이트에 해딩 레벨은 일관성이 있어야된다고 생각합니다.

    2010/06/07 15:29 [ ADDR : EDIT/ DEL : REPLY ]
  3. 도움이 많이 되었습니다.. 감사합니다^^

    2010/09/10 15:04 [ ADDR : EDIT/ DEL : REPLY ]

HTML5가 회자되고 있는 이마당에, HTML의 기초중에 기초인 헤딩태그에 대해서 포스팅한다는 현실이 부끄럽기도 하고 안타깝기도 하지만.. 이렇게 포스팅을 해야 많은 분들이 올바른 헤딩태그를 사용하시리라는 희망을 품으며 몇자 적어봅니다.

전편과 후편으로 나뉘며
전편에는 헤딩태그를 사용했을 때의 장점(전반적으로 시멘틱 마크업에 대한 이야기), 해딩태그의 이해
후편에는 잘못된 헤딩태그 사용예, 헤딩태그 결론에 대해 포스팅됩니다.


2009년 하반기동안 Javascript강의를 많이 다녔는데, 이때 받았던 질문중 기억에 남는 질문은
"헤딩태그를 어떻게 사용해야 할지 모르겠어요"

라는 질문이였다. (Javascript강의인데 HTML을 질문하는 용자의 용기와 호기심에 박수를 보냅니다.;) )
알고보면 매우 간단한 것인데 이 질문을 여러번 받았었다.
아마도 원문에 헤딩태그에 대한 자세한 설명과 예제가 부족해서 그런게 아닌가 하는 생각을 해본다.
접근성을 준수했다는 사이트들도 상당수가 잘못된 헤딩태그를 사용하는 것을 목격하였다.

이제 헤딩태그에 대해 파해쳐보자. 팍팍

팍팍 파해쳐보기 전에..
지금 포스팅된(그리고 포스팅될) 이 글은 견해의 차이가 있을 수 있다.
그 이유는 원문에는 간략한 설명만 있을 뿐 자세한 설명과 예제가 적다.
이로인해 원문을 이해하는데 견해의 차이가 생길 수 있기 때문이다.
이건 마치 성경을 놓고서 사람마다(혹은 종파마다) 해석하는 바가 틀린 것과 같은 이치이다.

자. 자기방어는 이쯤으로 마무리하고, 이제 제대로 한번 파해쳐보자 팍팍.

헤딩을 올바르게 사용했을 때의 장점(시멘틱마크업의 장점)
헤딩을 올바르게 사용하면 SEO가 올라간다.
물런 국내 대형 포털의 검색에는 안걸릴 확률이 아주 높다. 실제로 검색이 되었다 하더라도 검색결과에 나올 확률은 알 수 없다. 그 이유는 다들 알겠지만 검색 방식의 차이와 광고 및 정책 때문이다.
"그렇다면 도대체 어떻게 SEO가 올라간다는 말이냐?"
라는 의문을 품은 분도 계실 것이다.
우리가 종종 착각을 하는것이..  포털의 검색만 "검색"이라고 착각을 하는데, 사실은 그렇지 않다.
크롤러(혹은 봇. 이하 크롤러로 통일)가 돌아다니면서 수집하는 모든것이 검색이라고 생각해도 무관하다.
크롤러가 정보를 수집해갔다는 행위의 시초가, "검색"이라는 이벤트가 있었기 때문에 정보를 수집해간 것이라 해석할 수 있기 때문이다.
크롤러가 무작위로 정보를 수집해 갔다 하더라도, 수집해간 정보가 언젠가는 노출이 될 확률이 높으므로 이것 또한 긍정적으로 생각할 수 있다.

엄청난 비용을 지불하여 SEO를 올릴 수도 있지만, 간단하게 HTML 코드를 수정함으로써 SEO를 올릴 수 있다는 것이다.
HTML을 수정했다고 엄청나게 SEO가 향상된다고 말하기는 어렵다. 위에 언급했듯이 국내 포털들은 검색에 안걸릴 확률이 높으므로 그렇다. 안하는 것보다 나은 정도의 수준이라고 생각하는 것이 좋을 것이다. 
하지만 다행스럽게도 구글에서는 확률이 올라가니 아무 소득이 없는것은 아니다.

사람이 보는 것이 아닌 기계가 알아볼 수 있는 헤딩
그럼 크롤러가 정보를 수집해가는 원리에 대해서 알아보자.
일반적인 크롤러의 경우 HTML을 읽은 후 거기서 키워드를 인덱싱한후 저장하는 방식이다.
여기서 어려운것은 HTML을 분석하여 이 HTML이 어떤 정보를 담고 있는지, 혹은 해당 키워드가 있는지 인덱싱하는 기술이다.
수많은 text중에 어떤 것이 의미가 있는 정보이고 광고이고 쓰레기인지 구분해내야 하기 때문이다.
이 말인즉슨 유의미한 데이터(정보)가 무분별하게 쓰레기와 썩여있다면, 크롤러가 유의미한 데이터를 찾지못하고 넘어갈 수도 있다는 것이다.

시멘틱 마크업
좋은 크롤러라면 모래 속의 진주를 발견해 갈 수 있지만, 이런 기대는 감나무 밑에서 감 떨어지길 기다리는것과 같다.
우리가 유의미한 데이터라고 표시를 해주면 어떻게 될까? 당연히 크롤로가 한결 수월하게 정보들을 수집해 갈 것이다.
이렇게 표시를 할 수 있는 태그중 하나가 바로 헤딩태그이다. 우리가 헤딩태그를 올바로 사용하면 크롤러는 별 어려움없이 유의미한 데이터를 수집해 갈 수 있다.
그 이유는 기본적으로 크롤러들은 head안에 오는 태그들(title 등등)이나 헤딩태그, 강조태그들을 주로 수집해가기 때문이다. (크롤러마다 차이가 있음)
크롤러가 이해할 수 있다면 크롤러가 아닌 다른 녀석도 알아볼 확률이 높아지게 된다.
여기서 다른 녀석은 우리가 흔히 사용하는 브라우저(IE, FF, Opera, Safari, Chrome)가 아닌 다른 브라우저 및 디바이스를 의미한다.
PDA, 모바일 브라우저 뿐만 아니라 사내 터미널 등등 호환성이 넓어지는 것이다. 사실 이것은 웹표준을 준수했을때 생기는 이점이며, 시멘틱 마크업을 했을때 시너지가 생겨 그 효과가 극대화 된다.

기계(HTML을 수집하거나 분석하는 모든것들)가 이해를 해야지만이 SEO도 올라가고, 기계가 이해를 할 수 있으니 다른 디바이스(장치)와도 호환이 된다.
결국은 기계가 이해할 수 있는 마크업을 해야한다는 것이다.
이것이 바로 내가 생각하는 시멘틱마크업이다.



헤딩태그의 이해
많은 분들이 헤딩태그를 설명할 때 책과 비유를 한다. 나 또한 책에 비유를 많이 했었는데
이렇게만 설명하면 이해할거라고 생각했었는데 그것은 내 착각이었다.
많은 분들에게 "책"예를 들면 다들 그때는 고개를 끄덕거리시지만, 막상 사용할려고 했을때 감을 못잡으시는 경우가 허다했다.

하지만 이번에는 책이 아닌 다른것으로 예를 들어 설명을 해보겠다.
바로 문서로 예를 들겠다.
여기저기서 실망감을 표출하며 "그게 그거다", "낚시하냐"라는 원성이 들리지만..
책보다는 문서가 더욱 적절한 예제여서 헤딩태그에 대한 오해를 줄일 수 있을 듯 하다.
수많은 문서 중 보고서를 예를 들겠다.

2009 실적 보고서라고 하자. 그리고 이 실적보고서의 내용을 상상해보자.
각 사업별 실적이 나올 것이고, 전년도 실적과 비교도 할 것이고, 분기별 비교도 있을 것이다.
이러한 것을 목차로 생각해보면
  • 2009 실적 보고서
    • 전체 사업 실적 요약
    • A 사업 실적
      • 1분기 실적
      • 2분기 실적
      • 3분기 실적
      • 4분기 실적
      • 전년과 비교
      • 총평
    • B 사업 실적
      • 1분기 실적
      • 2분기 실적
      • 3분기 실적
      • 4분기 실적
      • 전년과 비교
      • 총평
    • 총평

뭐 대충 이런식으로 있게 될 것이다.
그럼 여기서 A 사업 실적의 2분기 실적을 보고 있다고 가정하자.
그렇다면 이 페이지의 헤딩은 어떻게 되야할까?
바로 그렇다. 여러분이 생각한 것이 바로 정답이다.
생각대로 하면 되고~

대제목: 2009 실적 보고서
중제목: A 사업 실적
소제목: 2분기 실적

참 쉽죠잉~?



다음편에는 헤딩태그의 오해와 결론에 대해 적어보도록 하겠습니다.
ps. 왠지 다른 블로거가 헤딩태그 관련해서 글을 썻을거 같은 이 느낌.. ㅠ,.ㅠ

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/170 관련글 쓰기

  1. hiphapis의 생각  삭제

    2010/01/06 22:43TRACKBACK FROM hiphapis' me2DAY

    미루고 미루던 백만년만의 포스팅 헤딩 제대로 사용하기(시멘틱 마크업하기). -전편- 왠지 뒷북일거 같은 불안한 느낌.

댓글을 달아 주세요

  1. 간만의 글이 아주 중요한 내용이군요. 후편도 기대하겠습니다. :)

    2010/01/06 23:35 [ ADDR : EDIT/ DEL : REPLY ]
  2. 연주

    쉽고 공감가는 글이네요~ ^.^

    2010/01/27 18:14 [ ADDR : EDIT/ DEL : REPLY ]

궁시렁*22009/10/08 18:05

게이머
감독 마크 네빌딘, 브라이언 테일러 (2009 / 미국)
출연 제라드 버틀러, 알리슨 로만, 아론 유, 마일로 벤티미글리아
상세보기

지난 10월 6일. 결혼기념일날 와이프와 함께 데이트를 하다 극장을 들렀는데..
딱히 볼만한 영화가 없었다. 결혼기념일같은 날에는 멜로는 보는게 좋겠지만, 상영중인 멜로 전부 재미없다는 악평들이 난 한국영화들 뿐이었고.. 그렇다고 헐리우드 멜로를 보고 싶지도 않았다. (개인적으로 멜로는 안좋아하는듯 하다.)
그냥 극장을 나설까 하다 마땅히 할 것도 없어 3분후 상영 시작하는 게이머를 보기로 했다.


최대한 스토리나 내용은 묘사를 하지 않으려고 노력했지만, 부득이하게 스포가 될 수 있으므로, 이 영화를 관람할 계획이 있으신분들은 참고하시길..

이 영화를 다 보고 나온 순간 "아 이거 블로그에 후기 써야겠다!" 라고 생각을 했다
그리고 지금 그걸 실천에 옮기고 있다. 나 같은 게으름뱅이가 말이다. (사실 Draft중인 글들 무수히 많다.)

내가 이 영화를 보고 얘기하고 싶은것은 제목에 썻듯이 3가지가 있다.
첫째. UX
둘째. Social Service
셋째. Big Brother

UX
영화 "게이머"에서도 "마이너리티 리포트"같은 미래형 Interface가 영화 전반적으로 나온다.

나는 "마이너리티 리포트"에서 나왔던 UX가 충격적이지 않았다.
그냥 "아 누구나 상상하고 있던것을 영화로 재현했구나" 라는 수준이었다. 물런 이 영화가 개봉했을때 난 UX라는 단어조차 몰르는 그저 초짜개발자 였을때다.
"게이머"또한 마찬가지다. 누구나 상상했던것을 영화로 "재현"을 해줬을 뿐이다. 그렇지만 간단하게 "재현"이라고 치부하기엔 뭔가 허전하다. 지금은 UX에 대해서 관심이 있기 때문에 느끼는 바가 다른것일까?

"게이머"에서 나오는 컴퓨터는 UX 그 자체라고 할 수 있다.
지금 우리가 사용하는 본체+모니터 구성이 아니라, 방(Room) 자체가 컴퓨터이고 모니터이며 UX이다.
그 방에서 행해지는 모든 움직임, 사소한 제스쳐까지 감지하여 프로그램(혹은 기능)들이 실행이 된다.
"마이너리티 리포트"에서는 창(window)를 직접 잡고 움직이는 느낌이었지만, "게이머"에서는 그냥 허공에다가 손짓, 발짓을 하는것이다.

이것을 보고
편하기는 할 것 같은데, 저런 Controller를 익히는게(사용법 숙지하는게) 쉬울까? 멋지고 화려하지만 저것이 정말로 좋은 UX일까?

라는 생각을 하게 되었다. 그러다보니
좋은 UX는 뭐지?

라고 스스로 되묻게 되었고, 곧바로 이렇게 답변을 하였다.
for the User
by the User
of the User

이 답변은 사실 "UX디자인 방법론 토론 워크샵"에서 내가 했던 말이다.
너무나 당연한 말이다.
이 부분에 대해서 더 많은 얘기를 하고 싶지만. 그 얘기가 그 얘기로 될 확률도 높을 뿐더러 "게이머" 영화에 대한 포스팅이므로 다음을 기약하자.

단순한 제스쳐 인식은 이미 구현된 기술이지만
디테일하게 제스쳐를 인식하는것과, 인식한것이 실제로 프로그램과 연동되고 운영되는것은 아직 먼 이야기인것 같지만 영화와 유사한 수준으로 이미 구현되어 있다.
바로 Xbox이다.

http://www.youtube.com/watch?v=p2qlHoxPioM
확실히 요즘 MS.. 대단하다.

동영상에다가 엄청난 멀티태스킹 기능과, 화면이 방 전체(돔)으로 된것이 "게이머"에서 나오는 컴퓨터이다. (빈곤층은 지금과 같은 모니터를 이용하지만)
이러한 Interface가 먼 훗날의 얘기가 아닌 가까운 미래의 모습인것이다.

UX에 관심이 있는 사람이 "게이머"를 본다면, 영화를 관람하는 포인트가 하나 더 늘어나게 될 것이다.
내 짧은 지식이 더 탄로나기전에 이쯤에서 UX를 마무리하고..


Social Service
이 영화의 소재 자체가 Social Service다.(단순한 소재일뿐이다. Social Service를 다루고 있지는 않는다.)
Second Life가 그대로 현실세계에서 구현되는데 이 부분이 나름 재미있는 부분이다. 물런 윤리적인 문제(인간의 존엄성)는 심각하지만 ㅎㅎ

어쨋든 기획하는 사람의 입장으로써 영화의 메인 소재가 Social Service인것이 흥미로웠고,
Second Life를 현실세계에 재현시킨것이 흥미로웠고,
내가 지금까지 생각해보지 못했던 Social Service가 펼쳐지는것이 흥미로웠다.


Big Brother
이 영화에서는 Social Service를 이용하여 Big Brother가 구현이 된다.
물런 Social Service하나만을 이용한것은 아니지만.
이 부분도 나름 영화 관람의 포인트랄까?



미투나 트위터, 페이스북에 쓸려고 했던 짤막한 내용을 블로그에 쭉 풀어썻는데..
막상 써 놓고 보니.. 역시 내용이 없다.(그냥 Micro Blog에 쓸걸...)

영화 "게이머" 한줄로 품평을 하자면
"UX, Social에 관심이 많은 나 같은 사람이라면, 남들보다 영화 관람 포인트가 더 많은 가벼운 영화"

크리에이티브 커먼즈 라이선스
Creative Commons License
Posted by Johan Kim hiphapis

TRACKBACK http://hiphapis.net/trackback/167 관련글 쓰기

댓글을 달아 주세요