Dharma

제가 쓰고 있는 컴퓨터는 Macbook Pro 입니다. 맥에서 게임이 안되니 저는 맥을 별로 좋아하지는 않지만 일단 이쁘지 않습니까? -0- 업무용으로 회사에서 쓰기는 딱입니다. 게임들이 거의 안되니 일만 하게 되더군요 ㅋㅋ

잡설이였고요. Snow Leopard 에 Android SDK 가 설치가 안되던 시절이 있었다고 하는데 SDK 2.1 부터는 별 문제 없이 지원되는거 같습니다.

1. Android SDK 는 http://developer.android.com/sdk/index.html 에서 'Mac OS X(intel)' 용으로 받아서 적당한곳에 압축을 풀어주시면 됩니다. 저는 '/Users/crazia/work/android' 라고 디렉토리를 만들어주고 압축을 푼 내용을 그곳에 복사해 줬습니다.

2. JDK 는 Apple 이 독자적으로 지원하고 있는 것이 있습니다. 예전에 osx 용 개발툴 깔때 자동으로 깔린것으로 추정이 됩니다. Terminal 창을 하나 열고 "javac -version" 이라고 입력해보시면 버젼이 나올것입니다. 제꺼는 "javac 1.6.0_20" 이군요.

3. Ant 를 설치해야 합니다. ant 는 mac port 가 설치되어 있으면 쉽게 설치되는데요. 만약 mac port 가 설치되어 있지 않으면 http://www.macports.org/ 를 참조해서 설치하시면 됩니다. 역시나 Terminal 창을 하나 열어서


이라고 나오면



면 설치가 완료됩니다. 자 이제 설정을 마무리 하는 단계입니다.  ~/.bash_profile 파일을 열어줍니다. 그리고 그 안에


기존 부분에 진하게 쓰여진 부분을 추가해 줍니다. 여기까지 완료 되셨으면



이라고 입력하시고 바로 터미널 창에서

android

라고 입력하시면 Android and AVD Manager 가 화면에 뜹니다. 그런데 처음에는 아무것도 없는것처럼 보일 것입니다. Virtual Machine 을 만들어도 만들어지지 않는데요.


그림에 보이는 것처럼 Installed Packages 에 가서 '전부 다' 추가 해줬습니다. '전부 다' 입니다. 잘 모를 때는 다 깔아보는게 최고더군요.

그리고 Virtual Devices Tab 에 가서 TestMachine 을 하나 생성해줬습니다. "New"  버튼을 클릭하면 나오는 대화상자에서


다음과 같이 입력하고 "Create AVD" 하면 Virtual Machine 한개가 생성됩니다. 그리고 생성된 Virtual Machine 을 선택하고 "Start the selected AVD" 를 클릭하시면


이렇게 머신이 실행됩니다. 조금 느리긴 하지만 쓸만합니다. 다음은 "Emacs 에서 Android 개발환경 세팅" 하는 방법에 대해서 알아보겠습니다.

드디어 저를 괴롭히던 가장 큰 문제가 해결 됐습니다. -0-
Weblocks 를 쓰면서 대체 이걸 어떻게 하는 걸까? 하고 고민 했던 것이 /pub/images 말고 딴곳에 있는 image 파일 access 하는 방법이였습니다.

예를 들면 /pub/images/photos/bassist.jpg 를 화면에 출력하고 싶을 때, 대체 어떻게 하는지 모르는 것이였습니다. 워낙 쉬운거라 Example 이나 Tutorial 에 없는 것이겠지요? 개발되어지고 있는 소스 자체를 뒤져서 알아냈습니다. 핵심은

make-webapp-public-file-uri 라는 이름의 함수였습니다.



이런식으로 직접적으로 표현해 주는 방식이였습니다. 소스를 더 뒤져봐야 알겠지만 이런 간단한 내용을 찾기 위해서 한참을 고생한 것을 생각하면 ㅜ.ㅜ

암튼 해결해서 기쁘군요 ㅎㅎ

Weblocks 는 리습으로 된 프레임 워크 입니다. 멋지고 편리한 개념으로 무장하고 있지만 리습이라는 언어 자체가 가지는 비 인기성으로 널리 퍼지지는 않았습니다.

그래도 몇가지 편리한 기능들이 있어서 주목하고 있는데, 그중에 대표적인 기능이 Widget 개념입니다. 모든 웹 컴포넌트를 widget 으로 만들고 그 widget을 엮어서 웹 페이지를 만들게 하는 것이지요.

자세한 매뉴얼이나 공식적인 튜토리얼등 형식을 취하는 것이 몇개는 있지만, 전반적으로 문서가 많이 부족합니다. 게다가 lisp 자체에 대한 이해도가 필요합니다. (CLOS 같은 것에 대한 지식)

더구나 저는 Web 도 잘 모르는 판국이라 여러가지로 배우기가 힘들지만 한개씩 한개씩 정복해 나가는 재미가 있습니다.

설치하고 웹 프로젝트 만들고 이런 것들은 http://trac.common-lisp.net/cl-weblocks/wiki/UserManual 에 잘 나타나 있습니다. (물론 영어입니다.)

딱히 그런부분은 어렵지 않습니다. 그러면 그 와중에 제일 중요하다고 볼 수 있는 PAGE 끼리 연결 시키는 link 만드는 법에 대해서 알아보겠습니다.

링크를 클릭하면 보통 동작이 발생합니다. (페이지로 이동하거나 글을 포스팅 하거나 등등) 그런 모든 동작을 통칭해서 weblocks 에서는 action-link 라고 합니다. 그 action-link 에 관한 간단한 예를 보기로 하지요.

temp-cloud 라는 이름으로 project 를 생성했습니다. 생성하는 방법은 위에 링크되어 있는 UserManual 하단에 보면 "Creating a New Project" 에 잘 설명되어 있습니다.

만든상태에서 temp-cloud/src/init-session.lisp 파일을 열어 봅니다.


라는식으로 바꿔줍니다. 이상태에서 make-test-page 함수를 작성해 줍니다.



조금 설명을 하자면 init-user-session 함수는 root widget 을 설정해주는 일을 합니다. (weblocks 는 웹페이지에 보이는 모든것을 widget 으로 표현합니다. html 마크업 , 동작하는 함수, 상태를 담고 있는 변수들도 전부 widget 으로 표현합니다. 이런 widget 들은 tree 형태로 구성되어 있는데 그중 최상단 root widget 을 init-user-session 에서 설정해 주는 것입니다) root widget 으로 make-test-page 함수를 쓴다고 설정해 주는 것입니다.

make-test-page 는 composite widget 을 만드는 방법이 들어 있는 함수입니다. 'composite 이라는 객체를 만들고 그안에 속해있는 widget 으로 list 함수를 이용해서 widget 들을 엮어서 지정해 줍니다. lambda 함수 뒤에 나열된 기능들이 html 을 실제로 보여주는 부분입니다.

단순히 여기까지 하고 (C-cC-c : 함수 단위 컴파일, C-cC-k: 파일 단위 컴파일) 컴파일을 해주고 화면에 보이는 부분에서 Reset Sessions 링크를 클릭하면 바뀐 부분으로 바껴서 웹페이지가 출력됩니다.

서론이 길었습니다. 이제 바로 Action-link 를 연결하는 부분을 보기로 하지요. 함수 한개를 추가해 줍니다.



make-anim-page (이름은 아무 의미 없습니다) 는 html 으로 p 태그 내용 하나와 "Modify" 라는 이름으로 링크를 거는 render-link 함수를 호출하고 있습니다. "Modify" 를 클릭하면 Lambda 함수가 실행이 됩니다. 즉 (do-page(make-test-page)) 가 실행이 되는 것이지요. render-link 사용법을 눈여겨 보시기 바랍니다.


이렇게 init-user-session 함수를 바꾸어 주면 깔끔하게 첫페이지에서 link 를 클릭해서 다른 페이지로 이동하는 예제를 보실 수 있습니다.

요즘 javascript 공부를 하고 있습니다. 인터넷 뜬지가 언제인데.. 지금 와서 웹 공부를 하는지 저도 잘 모르겠지만 이 공부 덕분에 쌓여 있는 책을 제대로 못보고 있는 안타까움이 존재합니다. -0-

문제는 javascript 공부를 할 때 DOM 명령어들을 오타를 내서 자꾸 javascript 가 틀리는 문제가 발생하더군요. 제가 쓰는 Emacs 는 이런일을 아주 깔끔하게 처리할 수 있게 잠깐만 코딩해 주면 되는 것이지요.

즉 Javascript-mode 에 DOM 명령어들을 Keyword 로 등록해 주면 오타가 발생하는지 알아볼 수 있습니다.
추가하는 과정을 살펴보기로 합니다.

.emacs 에 다음과 같은 부분을 추가합니다.





아주 쉽습니다. 키워드는 배우는 쪽쪽 추가해 주면 됩니다. 아직 배운 키워드가 몇개 없군요. ㅎㅎ

역시나 친절하게 상단 헬프에서 알려주는 것을 한참 찾았네요. -ㅅ- 이런건 구글신이 잘 안 알려주는것 같습니다.

'C-q' 입력하시고 ( 입력하시면 ( ) <-- 이렇게 쌍으로 생기지 않고 문자 그대로 ( 로만 입력됩니다. 동영상 보다가 생각이 안나서 한참을 찾았네요.

clbuild 로 lisp 과 slime 을 연동해서 사용하고 있습니다. 어차피 프로젝트 로딩할때 slime 을 거치지 않는 적이 없으니 개발시 편하게 하기 위해서 slime 로더 부분에 프로젝트 설정 부분을 추가 하려고 합니다.

(defun project-setup ()

  (mapcar #'(lambda (path)

              (push path asdf:*central-registry*))

          '(

            #p"/home/bc/proj/weblocks-dev-aggieben/"

            #p"/home/bc/proj/simple-blog/"

            )))

(project-setup)

위와 같은 내용을 clbuild 가 설치되어 있는 디렉토리에 있는 .swank-loader.lisp 에 추가해 줍니다.  다음부터 slime 로딩시 자동으로 프로젝트 파일들에 대한 패스가 추가 됩니다.

무지하게 힘들었습니다. -ㅅ-
아직 개발하는 중이라서 어떻게 하면 좋다 라고 하는 부분이 잘 알려져 있지 않아서 삽질에 삽질을 하다가 겨우 알아냈습니다.

 weblocks 템플릿을 이용해서 만든 어플리케이션의 이름이 temp-cloud 라고 가정하면 temp-cloud 디렉토리 바로 밑에 존재하는 temp-cloud.lisp 파일을 열어서


색칠한 부분처럼 명시해 주면 됩니다. 그리고 나서 temp-cloud/pub/crazia 에 새로 만들어진 스타일시트와 자바스크립트 파일을 집어넣고 :dependencies 로 지정해서 추가해 주면 됩니다.

ps.
 /Users/crazia/work/temp-cloud/pub/crazia 를 만들면 crazia 디렉토리 아래에 scripts (복수) 와 stylesheets (복수) 를 만들어 줘야 합니다.

항상 이런 종류의 것을 부탁 받으면 고민되는 것이 프로그램을 잘 만드느냐? 하면 그것도 아니고 (손 놓은지가 꽤 됨) 그렇다고 글 솜씨가 탁월하는가? (방문자 숫자를 보면...) 하면 그것도 아닙니다.

하지만 이렇게 요청을 들어온 것을 보면 역시 살아가는데는 '인맥'이 제일 중요하다는 생각이 들기도 하지만 사실 어떠한 인맥보다는 '등가교환법칙'에 의함이 더 큽니다. 그렇다!! '등가교환법칙'은 비지니스의 법칙을 뛰어넘어 우주의 법칙입니다. (주는 대신 뭔가를 얻기로 한 것이죠..)

하지만 바쁜 회사일에 치여서 언제 써 줄지 모르는 상황이긴 합니다. 그래도 계속 계속 미뤄둘 수 없는 일이기 때문에 일단 제 블로그에라도 초안을 올리고 그것을 다듬어서 요청하는 쪽에 올리는 방향으로 가기로 했습니다. 



프로토타입으로 빠르게 개발 가능성만 타진했던 용도로 개발 했습니다. 소스는 나중에 전부 공개될 예정인데 그래픽 리소스만 제외될 것입니다.

어려운 기술도 아니라서 쓰ㄱ

어디서 많이 본듯한 이미지..
하지만 더 놀라운 것은 이런 캐릭터들이 나와서 리습을 알려준다는 것이겠지요.

사이트가기

인구가 많아서 그런걸까요? 이런 문화의 다양성이 정말 부럽습니다.

UIImage 를 이용해서 화면에 출력하는데 정상적으로 출력시키는데도 화면상에서 계속해서 이미지가 반전해서 뿌려집니다. 열심히 구글링 해서 답을 알아냈습니다. 그 문제에 답을 올린 사람들하고 마음이 공유되는군요. '왜 애플은 모든것을 귀찮고도 어렵게 만드는 것일까?'

어찌됐건 해결을 했습니다.

원문보기: http://stackoverflow.com/questions/506622/cgcontextdrawimage-draws-image-upside-down-when-passed-uiimage-cgimage/511199#511199

UIImage *image = [UIImage imageNamed:@"testImage.png"];    

CGRect imageRect = CGRectMake(0, 0, image.size.width, image.size.height);       


CGContextTranslateCTM(context, 0, image.size.height);

CGContextScaleCTM(context, 1.0, -1.0);


CGContextDrawImage(context, imageRect, image.CGImage);

위와 같은 식으로 코딩을 하면 반전되는 현상을 해결 할 수가 있다고 합니다. 좌표계 일치 시켜줘야 한다는 것이지요. 제일 이해가 안가는 것이. UIImage 의  drawInRect 메서드를 사용했을 경우 이미지가 반전이 되는 것이지요 ^^;

암튼 해결했습니다. 슈슝..