센차터치 모바일 웹앱 - sencha touch 2, html5, css

마소 연재를 하였습니다.

주제는 : 센차 터치 2 핵심 가이드

http://www.imaso.co.kr/?doc=bbs/gnuboard.php&bo_table=article&wr_id=41056

COVER STORY

피할 수 없는 선택
정보보호

1부 | 법과 정책으로 본 정보보호의 현주소 | 전주현    120
2부 | 엔터프라이즈 환경을 위한 정보보호 | 성장열    124
3부 | 스마트 시대 달라지는 데이터베이스 정보보호 | 김형훈   128
4부 | 게임 산업에서의 정보보호의 의미와 이슈 | 강병탁    134
5부 | 로그인 보안 프로세스의 구성과 구축 | 한주성    138

INFORMATION

마소지기｜열린 결말 │전도영 편집장      63
기자수첩｜본질에 대한 이해 없는 막무가내 규제 버려야│이병혁 기자  65
MASO news｜드디어 배일 벗은 아이폰5 외      66
Hardware Review｜WD 레드 WD20EFRX 외      92
Books Review｜HTML5 게임 프로그래밍 외      112
Column & Interview

Interview｜염동훈 구글코리아 대표 │심정선 기자     72
김준수 부산정보산업진흥원 IT사업부장 │한종진 기자    74
데이비드 A. 차파 퀀텀 CTE │조수현 기자      76
컨퍼런스 취재 | 애자일 코리아 컨퍼런스 2012 | 한종진 기자   80
안랩 코어 2012 | 이병혁 기자       82
2012 IT 엑스포 부산 | 한종진 기자      84
법률사무소 민후의 SW 이야기 | 소프트웨어 공유의 문제점    81
소프트웨어 개발비를 손해배상 청구하는 산정법     83
공개SW 활용 성공사례│LG유플러스 │이병혁 기자     86
KINX │조수현 기자        88
텔레칩스 │조수현 기자        90
개발자가 만난 사람|최고를 만들기 위해 우직하게 걷고 있는 DBMS 개발자 |용영환 96
The War of IT|이순신과 한산도 대첩|김영옥     98
아키텍트 & 이노베이터 | 국내 의료정보화는 왜 실패했는가? | 신현묵  102
굿모닝 헬스| “목 디스크 수술이 무섭고 두려워요!” │ 모커리한방병원  105
수퍼개발자의 꿈| “원하면 노력하고 바라면 꿈을 꿔라” | 김지웅   106
여행이야기|네가지 없는 여행객, 이러면 아니 아니 되오 | 월간 여행스케치  110
패턴 이야기 | 플러그인 패턴(1) | ???      142
IT Certificate| IT 감사와 내부감사 │ 조희준     146
Developer Works | SNS와 연계된 홈오토메이션 개발 │ 최재규   150
IT 비즈니스 | BUX가 기업에 주는 가치 | 김영현     180
네트워크 이야기 | NTP와 로그 설정 | 박상철     184
Focus On | 심리적 보상의 메커니즘 | 박범진     188
마소플러스 | 개발자의 적 버그, 이렇게 잡자 | 허국현    206
Special Report

C++ 중심의 혁신이 시작됐다
비주얼 스튜디오 2012

1부 | 개발자의 르네상스를 꿈꾼다, 비주얼 스튜디오 2012 | 조성우   158
2부 | 비주얼 C++11에서의 C++11  | 최흥배     160
3부 | C++를 활용한 윈도우8 앱 개발 | 엄준일|     162
4부 | 병렬 프로그래밍 혁신, C++ AMP | 조진현     164
5부 | 비주얼 스튜디오 2012 테스트 익스플로러 활용 | 신영진   168
6부 | 현대화된 드라이버 개발 | 김성은      174
Smart & Mobile

아이클라우드를 활용한 앱 개발 │ 안진섭      194
아이클라우드를 이용한 맥 앱 만들기 (2)
S펜 SDK를 활용한 갤럭시 노트 애플리케이션 개발 │ 이원희 외    200
갤럭시 노트 애플리케이션 개발 실전 프로젝트
실전강의실

누구나 쉽게 구축할 수 있는 하둡 기반 분산시스템 | 이지훈   208
아파치 하둡을 활용한 로그 저장 및 처리
센차 터치 2 핵심 가이드 | 안병도      216
센차 SDK 툴
Cilk Plus 병렬 프로그래밍 | 고형호      222
인텔 패러럴 어드바이저와 함께하는 Cilk Plus – 루프 병렬성
Play! 프레임워크와 함께 하는 즐거운 웹 개발 | 김용웅 외    228
Play! 프레임워크로 상용 서비스 개발하기
모바일 및 데스크톱PC를 위한 가볍고 빠른 GUI 툴킷 EFL | 박춘언 외  234
EFL 핵심 기능 알아보기
질의응답 사이트 예제로 배우는 ASP.NET MVC3 | 허국현    240
WYSIWYG 에디터 장착
MASO 캠퍼스

캠퍼스 소식 | 교육과학기술부, 과학-비즈니스 융합 전문가 양성한다 외  246
IT JOB Trend | 직장인 52.3%, “현재 자기계발 중” | 잡코리아   248
자기계발가이드 | 제 5회 대학생 전력기술 아이디어 공모전 외   249
네 꿈을 펼쳐라!| 숭실대학교 구글개발자그룹 | 심정선 기자   250

스텝 바이 스텝

data-p로 열어가는 새로운 세상 | 최시영      252
새로운 범용 프로그래밍 언어, data-p
자바카페와 함께하는 웹 기초 강좌 | 이은미     258
JSP(Java Server Page) 활용하기
DBMS

뉴스│한국정보화진흥원, 공공 데이터 품질관리 위한 커뮤니티 발족 외  266
컬럼│
엑시엄이 보는 DB 세상 | 이현희       268
Large Object – LOB의 저장방식 및 사용법
리포트│
퀴즈로 배우는 SQL | 기민용       270
숫자를 영문으로 표기하기
개발자가 꼭 알아야할 데이터베이스 지식 | 임주한     274
DB2 레인지 파티션의 실전 적용
퀴즈이벤트         116
독자가 편집자에게        156
미리 보는 11월호         192
게시판           264
정기구독 안내         280
이 달의 디스켓 www.imaso.co.kr
실전강의실 | Play! 프레임워크로 상용 서비스 개발하기 | 김용웅 외  228
EFL 핵심 기능 알아보기 | 박춘언 외     234
스텝바이스텝 │ Java Server Page 활용하기 │ 이은미    258

sencha touch 2.1 beta3 에서 sencha app build native로 네이티브 앱 생성 시, 다음과 같은 에러가 발생하는 경우는 

[WARN ] JsParse Warning : 
message => Trailing comma is not legal in an ECMA-262 object initializer
file => /Users/yaioyaio/Sites/SenchaProject2.1/SnsPop/app.js:36,5

sencha touch 2.1 rc1 sencha cmd 3.0.0.188

다음의 내용은 새롭게 업그레이드 된 버전을 가지고 간단한 테스트 작업을 해 보는 것이다. 아직은 베타 버전이므로 모든 프로젝트에 적용하는 것은 아직은 시기상조이므로 이점은 분명 알고 테스트를 하기 바란다. 다만, 조금 더 좋아진 환경을 확인 하는 것으로 만족을 해야 한다.

그럼 본격적으로 테스트를 해 보는 과정을 알아 보자.

첫 번째. 다운로드 및 압축 해제와 폴더 복사.

http://www.sencha.com/forum/announcement.php?f=92&a=36

위의 사이트를 접속 하여 각 OS에 맞는 파일을 다운로드 받는다.

다운 받은 파일은 <그림 1>과 같이 2가지이다.

<그림 1>다운로드 파일.

다운로드 받은 파일 중 SenchaCmd-3.0.0.188-osx.app.zip 파일을 압축 해제 한다. 해제한 파일을 설치한다.

<그림 2>는 SenchaCmd-3.0.0.188을 설치한 내용을 터미널에서 본 내용이다. 그리고 <그림 3>은 파인더에서 생성된 폴더 구조를 확인한 것이다.

<그림 2> SenchaCmd-3.0.0.188 터미널에서 확인.

<그림 3> SenchaCmd-3.0.0.188 파인더에서 확인.

지금까지 SenchaCmd-3.0.0.188 설치를 하였고, 설치된 내용을 <그림 2>와 <그림 3>을 통해서 확인 하였다. 다음은 sencha touch 2.1-rc1 버전을 설치할 차례이다.

다운 받은 sencha-touch-2.1.0-rc1.zip 파일을 압축 해제 한다. 압축 해제한 폴더를 복사 하여 지금까지 sencha touch 작업하던 폴더와 다른 곳에 붙여 넣기를 한다. 본인의 경우는 <그림 4>와 같다.

<그림 4> sencha touch 2.1 rc1 폴더 구조.

두 번째. SenchaCmd 확인.

SenchaCmd 설치가 잘 되었는지 확인을 해 보자. 터미널에서 방금 압축 해제 하고 폴더를 복사한 곳으로 이동을 한다. 그곳에서 <그림 5>와 같이 간단하게 sencha 명령어를 테스트 해 보자. <그림 5>와 같이 나타나면 모든 것이 정상으로 끝이 난 것이다.

<그림 5> sencha 명령어 테스트.

세 번째. 프로젝트 생성 및 웹 브라우저 테스트 확인.

실제 프로젝트를 하나 생성 하자. <그림 6>과 같이 sencha generate app Test ../Test라고 입력을 해 보자. <그림 6>과 같이 결과가 보일 것이다.

<그림 6> sencha generate app Test ../Test

이제는 크롬이나 사파리에서 생성된 프로젝트를 실행하여 보자. 실제 url 주소는 각자 다를 것이다. 본인의 url 주소는 http://localhost/~yaioyaio/SenchaProject.2.1-RC1/Test/ 와 같다. <그림 7>과 같이 나오면 모든 것이 정상으로 된 것이다.

<그림 7> 웹 브라우저 테스트.

마지막으로 당부를 하나 하자면 이 번 테스트는 아직 정식 버전이 아닌 것이므로 변화가 있다는 것을 확인 하는 것으로 만족해야 한다는 것이다. 다만, 몇 가지 확인해본 결과 정식 버전이 빨리 나오기를 기다릴뿐이다.