블로그 이미지
ssun++

카테고리

[전체] (73)
Android (7)
JavaScript (9)
CI (5)
Language (14)
ETC (38)
Total314,893
Today21
Yesterday23
[시작]
언어의 시작은 "Hello, World!"


[환경]
Python 3.2.2
Eclipse + PyDev


[소스]

print("Hello, World!")



[끝]
지금까지 본 "Hello, World!" 중에 가장 간단한 것 같습니다.
Posted by ssun++

댓글을 달아 주세요

[시작]
Erlang으로 "hello, world"를 찍어봅니다.

[환경설정]
1. "Erlang/OTP"를 설치합니다.
2. 설치 경로 아래 bin 디렉토리를 PATH에 추가합니다.

[소스코드]
hello.erl

-module(hello).

-export([hello_world/0]).


hello_world() -> io:fwrite("hello, world\n").



[컴파일하기]
1. cmd창에서 "erl"을 입력해서 erlang shell을 띄웁니다.
2. c(hello). 를 입력하여 컴파일합니다.

Eshell V5.8.5  (abort with ^G)
1> c(hello).
{ok,hello} 


[실행하기]
1. hello:hello_world().를 입력하여 실행합니다.

2> hello:hello_world().

hello, world

ok 


[끝]
역시 모든 언어의 시작은 "hello, world"
Posted by ssun++

댓글을 달아 주세요

[시작]
jQuery MobileSencha Touch로 'Hello World'를 찍어보고 간단한 비교를 해볼 예정입니다.

[결과부터 봅시다]
 

왼쪽이 jQuery Mobile, 오른쪽이 Sencha Touch 입니다. 여기까지는 별 차이가 없습니다.

[소스를 봅시다]
jQuery Mobile 소스

<html>

<head>

<link charset="utf-8" rel="stylesheet" href="./css/jquery.mobile-1.0b3.min.css" />

<script charset="utf-8" type='text/javascript' src='./js/jquery-1.6.4.min.js'></script>

<script charset="utf-8" type='text/javascript' src='./js/jquery.tmpl.js'></script>

<script charset="utf-8" type='text/javascript' src="./js/jquery.mobile-1.0b3.min.js"></script>

</head>

<body>

<div data-role="header">

<h1>Example</h1>

</div>

<div data-role="content">

Hello World

</div>

</body>

</html>

기본적인 html 코드에 jQuery Mobile에서 지원하는 data-role 속성을 사용합니다.
기존의 웹 페이지를 '앱'스럽게 만들려고 하면 적절한 속성만 추가해주면 됩니다.


Sencha Touch

<html>

<head>

<link charset="utf-8" href="./sencha-touch-1.1.0/resources/css/sencha-touch.css" rel="stylesheet" type="text/css" />

<script charset="utf-8" src="./sencha-touch-1.1.0/sencha-touch.js" type="text/javascript"></script>

<script>

Ext.setup({

onReady:function(){

var toolbar = new Ext.Toolbar({

dock:'top',

title:'Example'

});

var panel = new Ext.Panel({

fullscreen:true,

dockedItems:[toolbar],

html:'Hello World'

});

}

});

</script>

</head>

<body></body>

</html>

<body> 태그 안으로는 아무것도 없습니다. 전부 자바 스크립트 코딩입니다.
html만 알아도 소용이 없고, 자바 스크립트만 알아도 소용이 없습니다.
Sencha Touch의 구조에 익숙해져야 뭔가 할 수 있습니다.

[이 시점에서 비교]
jQuery Mobile은
사용하기 쉽습니다. jQuery Mobile에서 사용하는 속성만 얹어주면 됩니다.

<body> 태그 내부에 alert를 넣어보면 페이지 로드 시에 2번 찍힙니다.
jQuery Mobile이 스타일, 스크립트 실행을 위해서 DOM을 한번더 훑는 것 같습니다.
<body> 태그 내부의 스크립트는 페이지 로드 시 2번 돌게 되고,
로드 이후에 엘리먼트를 집어 넣는 경우 스타일이 제대로 안먹습니다.
(이부분은 좀더 확인이 필요할 것 같습니다.)

Sencha Touch는
사용하기 어렵습니다. 위에서 언급했지만 Sencha Touch에 대해 알아야 합니다.
아직까지 난이도 이외에 흠잡을 부분은 없는 것 같습니다.


[끝]
성격이 약간 달라서 어느 쪽이 완전 우세라고는 못하겠지만,
스크립트 비중이 높고, UX가 뛰어난 Sencha Touch가 맘에 드네요.
Posted by ssun++

댓글을 달아 주세요

  1. 2011.10.14 19:17 신고 방문이  댓글주소  수정/삭제  댓글쓰기

    가장 큰 차이는 화면이 여러개일 경우 입니다.... 구동 방식이 jQuery Mobile은 HTML 페이지 이동방식
    Sencha Touch는 js 끼리의 호출방식입니다. 엄청난 차이가 납니다...

    시중에 센차터치 모바일 프로그래밍 책이 새로 나왔습니다.... 국내에 제대로된 센차책이 없는관계로 잘들 모르시는것 같습니다.

[시작]
어디서든 처음 예제는 hello, world 입니다.


[동작]
하나의 input과 2개의 버튼이 있습니다.
'Call fortyTwo()' 버튼 클릭 시 42가 alert으로 출력되고
'Call reverseText()' 버튼 클릭 시 input 값이 뒤집혀서 출력됩니다.

[분석]
버튼을 클릭하여 모듈로 메세지를 보내면 모듈에서는 'message' 이벤트에 데이터를 실어서 보냅니다.
모듈로부터 받은 데이터는 이벤트 리스너로 등록된 handleMessage() 함수를 통해  alert으로 출력됩니다.
정확하게 그렸는지는 자신이 없지만 대략적인 동작은 아래 sequence diagram과 같습니다.
 


[끝]
'비동기로 동작한다'는 정도만 보면 될 것 같습니다.
Posted by ssun++

댓글을 달아 주세요

최근에 달린 댓글

최근에 받은 트랙백

글 보관함