Sencha Architect - 총 8시간 24분 / 강의당평균 : 50분23초

Sencha Architect

전체 : 8시간 24분 / 강의당평균 : 50분23초

01 센차아키텍트 소개와 시작

센차아키텍트에 대해서 알아보고 사용환경을 설정한 후 간단한 예제를 만들어서 디버깅 해봅니다. 그리고 MVC 아케텍쳐와 클래스에 대해 알아봅니다.

25분

책갈피 : [00:00] 센차아키텍트 / [01:28] 센차아키텍트의 기능 / [01:41] 비주얼한 화면 / [02:30] 코드에디터 / [02:47] 서버게시와 미리보기 / [02:56] 앱배포와 모범사례 준수 / [03:28] 사용준비 / [03:34] 톰캣서버준비 / [03:50] 센차아키텍트 설치 / [04:47] 인터페이스 / [05:23] 화면모드 / [05:53] 도구상자 / [06:19] 프로젝트 관리자 / [06:59] 속성창 / [07:18] 로그창 / [08:18] 새프로젝트 / [08:53] 컨테이너 / [09:06] panel적용 / [09:37] 속성확인 / [10:00] html내용 작성 / [10:31] code확인 / [10:59] 저장 / [11:50] 생성된 폴더확인 / [12:15] view폴더 / [12:50] app.html / [13:33] 센차서버와의 연결확인 / [14:22] 경로수정 / [14:54] library / [15:08] base path / [16:07] theme / [16:44] 소스의 theme확인 / [17:06] app.js / [18:09] mypanel.js / [18:46] 실행 / [19:06] 경로설정 / [19:29] 결과확인 / [19:49] preview / [20:28] 확인 / [21:17] publish / [21:40] project setting / [22:22] 요소검사 / [22:59] 쇼콘솔 / [23:34] elements / [24:23] resources / [24:37] 그 외의 메뉴 / [25:23] mvc아키텍처

02 화면의 구성과 레이아웃(1)

패키지와 경로, 컴포넌트와 컨테이너에 대해 알아보고 센차터치 레이아웃을 공부한 후 센차아키텍트에서 레이아웃 예제를 만들어봅니다.

1시간 13분

책갈피 : [00:00] mvc아키텍처 / [00:38] index.html / [01:20] app.js / [01:36] controller / [01:52] model / [02:07] store와 view / [02:47] 개발순서 / [04:37] 예제 / [05:23] index.html / [06:16] app.js / [07:19] app폴더 / [08:01] myview.js / [08:51] mymodel.js / [09:38] mystore.js / [10:25] mycontroller.js / [12:08] 클래스 / [12:51] 센차터치의 클래스 / [13:28] app.js / [14:10] launch / [14:37] ext.define / [14:53] config / [15:13] 메소드 / [15:57] 객체 / [17:14] index.html / [18:04] 실행 / [18:41] 클래스의 상속 / [18:54] app.js / [19:43] ext.define / [21:11] 실행 / [21:44] config / [22:02] app.js / [22:27] subbirds클래스 / [22:51] 속성부여 / [23:04] 속성호출 / [23:16] apply / [25:12] 결과예상 / [25:57] 실행 / [26:53] 속성공유 / [27:12] app.js / [27:42] statics / [28:50] 실행 / [29:07] console.log / [29:22] 요소검사 / [29:54] 이벤트 / [30:50] app.js / [31:25] launch / [31:51] config / [32:34] panel / [33:45] button / [34:13] 버튼이벤트 / [34:45] 실행 / [36:02] 파일경로 / [36:35] 예제보기 / [38:07] subfile.js / [39:38] app.js / [40:32] panel / [41:05] 내용호출 / [41:51] 실행 / [43:07] 다른폴더의 파일연결 / [43:59] subfile.js / [44:59] app.js / [45:50] 실행 / [46:34] 컴포넌트와 컨테이너 / [48:03] app.js / [48:37] 패널생성 / [48:50] items / [49:39] 실행 / [50:44] app.js / [51:12] panel / [51:32] chilepanel / [52:38] 실행 / [53:24] sethtml / [53:58] 센차터치레이아웃 / [54:18] default / [54:30] card / [54:41] fit / [54:53] hbox/vbox / [55:24] 소스보기 / [55:46] 패널생성 / [56:09] layout / [57:00] 실행 / [57:22] 레이아웃변경 / [59:18] align변경 / [01:01:57] docked / [01:03:49] 복잡한 구조 / [01:04:12] items / [01:04:49] type / [01:05:12] 실행 / [01:06:08] 새 프로젝트 / [01:07:01] panel / [01:07:19] 프로젝트관리자확인 / [01:07:49] toolbar / [01:08:35] 내용입력 / [01:08:56] 속성창확인 / [01:09:46] 패널추가 / [01:10:44] 패널의 이동 / [01:11:16] 패널복사 / [01:11:50] 레이아웃변경 / [01:12:14] 설정창 / [01:12:52] 속성창에서의 변경

03 레이아웃(2)과 폼 컴포넌트

레이아웃 예제를 이어서 만들어보고, 파일의 분리와 게시,그리고 프리뷰 방법을 알아봅니다. 그리고 폼 컴포넌트에 대해 공부하고 예제를 통해서 폼 컴포넌트 필드들을 사용해봅니다.

56분

책갈피 : [00:00] 패널 / [00:24] displayname변경 / [00:51] flex / [01:11] style / [01:25] 배경색지정 / [02:04] 패널2이름변경 / [02:24] flex / [02:41] 배경색변경 / [03:03] 패널3의 이름변경 / [03:12] flex / [03:30] 배경색지정 / [03:55] 레이아웃 / [04:21] 폰종류 / [04:22] switch orientation / [04:49] 레이아웃변경 / [04:53] hbox / [05:15] 패널추가 / [06:07] 레이아웃변경 / [06:21] 패널이름변경 / [06:47] 배경색설정 / [07:06] 패널5이름변경 / [07:18] flex / [07:36] 배경색지정 / [08:44] 코드보기 / [09:06] layout / [10:15] 코드의 분리 / [10:46] promote to class / [11:30] 디자인확인 / [11:48] 코드확인 / [12:25] 분리된코드확인 / [13:00] 저장 / [13:07] 폴더확인 / [13:37] 분리된 파일확인 / [14:08] 파일명과 앨리어스명 변경 / [14:26] userclassname / [14:41] useralias / [14:51] 변경내용 확인 / [15:26] 분리된 파일 합치기 / [15:40] inline class / [15:56] 디자인보기 / [16:13] publish / [16:26] 경로입력 / [16:47] preview / [17:07] 확인 / [17:43] scrollable / [18:03] 검색기능 / [18:25] vertical / [19:11] 그외의 레이아웃 / [19:33] 패널위치이동 / [20:21] 컴포넌트 / [20:32] 입력컴포넌트 / [20:47] forms / [22:02] 폼컴포넌트 / [22:09] fieldset / [22:32] text / [22:46] textarea / [22:54] number / [23:06] hidden / [23:20] checkbox / [23:32] datepicker / [24:00] email / [24:10] password / [24:23] radio / [24:38] select / [25:02] slider / [25:22] spinner / [25:45] toggle / [25:56] url / [26:21] 프로젝트생성 / [27:28] 폼패널추가 / [27:43] fieldset추가 / [28:19] 이름입력 / [29:28] checkbox추가 / [29:51] date picker추가 / [30:04] number추가 / [30:13] 여러필드추가 / [30:37] 각각의 필드명변경 / [31:13] publish / [31:41] 결과확인 / [33:16] 라디오와 체크박스 / [34:14] 코드보기 / [35:00] 저장 / [35:28] 폼패널/필드셋추가 / [35:50] 이름변경 / [36:28] button / [37:12] spacer / [38:04] button추가 / [38:27] 패널추가 / [38:45] 필드이동 / [39:22] layout hbox / [40:00] 코드확인 / [41:40] 새프로젝트 생성 / [42:02] 폼패널추가 / [42:10] titlebar / [42:34] 내용입력 / [42:54] 저장 / [43:25] 위치변경 / [43:59] dock in parent / [44:25] 필드셋추가 / [44:49] 이름변경 / [45:30] displayname / [45:45] label / [46:56] button / [47:15] 이름변경 / [47:31] displayname / [48:12] id / [49:32] 버튼에 이벤트부여 / [49:42] event bindings / [50:17] tab이벤트 / [50:36] 관리자확인 / [51:18] 코드에디터 / [51:44] 코드작성 / [52:52] 저장 / [53:07] 폴더확인 / [53:27] myformpannel.js / [54:43] publish / [54:58] 결과확인

04 셀렉트, 슬라이더, 토글 필드와 픽커 필드&컴포넌트

셀렉트,슬라이더,토글 필드에 대해서 자세히 알아보고 예제를 만들어 본 후 MVC구조로 변경해봅니다. 그리고 픽커 필드와 픽커 컴포넌트도 사용해봅니다.

52분

책갈피 : [00:00] 폼컴포넌트 / [00:22] 필드들 / [00:39] 새 프로젝트 / [00:58] 도구상자 / [01:16] 폼패널 / [01:43] 제목입력 / [02:01] 필드셋 / [02:31] 셀렉트필드 / [02:34] 슬라이더 / [02:41] 토글필드 / [03:12] 필드위치변경 / [03:32] 패널추가 / [03:51] 버튼추가 / [04:28] label변경 / [04:38] id값 부여 / [05:15] label값변경 / [05:45] id변경 / [06:03] 레이아웃변경 / [06:20] vbox / [06:47] 버튼내용변경 / [07:15] models / [07:27] 모델추가 / [07:47] 스토어추가 / [08:27] 필드의 add / [08:56] 필드추가 / [09:29] 모델의 연결 / [09:58] data입력 / [11:01] 스토어연결 / [11:15] displayname변경 / [11:32] valuefield / [12:10] 화면확인 / [12:45] event bindings / [13:00] 이벤트추가 / [13:27] 이벤트작성 / [13:57] 코드확인 / [14:35] alert / [15:01] 폴더확인 / [15:19] mymodel.js / [15:30] field내용 / [15:41] mystore.js / [15:48] data확인 / [16:31] myformfile.js / [17:11] items / [17:54] 이벤트내용확인 / [18:14] 결과확인 / [19:04] 프리뷰 / [19:17] 화면확인 / [19:32] 요소검사 / [19:48] 오류확인 / [20:42] 저장후 확인 / [21:03] displayfield / [21:33] 결과확인 / [22:14] 읽어오기버튼 / [23:32] 새프로젝트 / [24:18] 컨트롤러추가 / [24:48] 컨트롤러 레퍼런스 추가 / [25:31] 폼패널 / [25:42] titlebar / [25:56] fieldset / [26:32] 필드추가 / [26:52] 버튼추가 / [26:57] 필드명변경 / [27:50] model추가 / [27:58] store추가 / [28:22] 필드추가 / [28:55] 스토어의 모델추가 / [29:23] data입력 / [30:16] store연결 / [30:32] valuefield / [31:10] name값 변경 / [32:13] 읽어오기 / [33:08] reference속성추가 / [33:31] selector / [33:48] xtype / [34:01] reference1속성변경 / [34:37] reference2속성변경 / [35:04] reference3속성변경 / [35:40] 버튼이벤트추가 / [35:49] controller action / [36:08] controlquery / [36:17] targettype / [36:42] tap / [37:09] 이벤트코드입력 / [37:43] myselectfield / [38:28] 코드보기 / [38:59] 퍼블리시 / [39:19] 결과확인 / [40:10] 새프로젝트 / [40:16] 피커 / [41:43] panel추가 / [41:53] toolbar입력 / [42:16] date picker field / [42:53] text field / [42:56] button / [43:29] date picker / [44:04] 필드명변경 / [44:38] displayname / [44:47] id / [45:38] 버튼이벤트 / [46:11] 이벤트코드작성 / [46:59] hidden속성 / [47:22] done버튼 / [47:41] 이벤트추가 / [47:58] 코드입력 / [49:20] 소스보기 / [50:02] 이벤트코드수정 / [50:21] 퍼블리시 / [50:32] 결과확인 / [51:02] 날짜선택버튼

05 아이콘과 UI, 메시지 박스와 사용자 함수, 탭패널과 캐러셀

아이콘 사용방법과 유저인터페이스를 변경하는 방법을 알아보고 메시지 박스와 사용자 함수를 사용해봅니다. 그리고 탭패널과 캐러셀을 구성하는 방법을 공부하고 직접 만들어봅니다.

50분

책갈피 : [00:00] 아이콘과 UI / [00:24] 아이콘확인 / [01:39] 새프로젝트저장 / [02:00] 패널추가 / [02:07] titlebar / [02:29] label / [02:40] html속성변경 / [02:49] button / [03:16] icon관련속성 / [03:51] 아이콘선택 / [04:14] UI / [04:25] button추가 / [04:53] UI선택 / [06:06] 알림기능추가 / [06:21] badgetext / [06:53] mypanel.js / [07:05] items / [07:33] ui / [07:57] 메세지박스와 사용자함수 / [08:03] 메세지박스 / [08:18] alert와의 차이 / [08:56] 프로젝트저장 / [09:41] panel추가 / [09:50] titlebar / [10:42] spacer / [10:57] text field / [11:21] spacer / [11:55] segmented button / [12:57] name변경 / [13:43] container / [14:07] 레이아웃 / [14:43] 이벤트적용 / [15:00] event bindings / [15:27] 코드작성 / [16:23] prompt버튼 / [17:43] 저장 / [17:54] confirm / [18:07] 코드작성 / [18:56] 함수추가 / [19:19] mypanel / [19:29] functions / [20:12] 추가된 함수확인 / [20:26] 함수속성창 / [20:43] fn값 / [20:51] params / [21:14] 코드작성 / [21:52] 함수추가 / [22:13] 생성된 함수 속성변경 / [22:39] 코드작성 / [23:14] mytextfield / [23:41] mypanel코드확인 / [24:40] publish / [24:56] 결과확인 / [27:54] 다양한 화면구성 / [28:03] 새 프로젝트저장 / [28:15] tappanel / [28:40] tappanel추가 / [29:24] 프로젝트관리창 / [29:44] 이름변경 / [30:37] html속성 / [30:57] style / [31:55] 배경2의 속성 / [32:28] 배경색의 속성 / [33:15] publish후 확인 / [33:46] 이미지경로 / [33:59] 이미지폴더 생성 / [34:10] 다시확인 / [34:43] 탭변경확인 / [35:19] 코드확인 / [36:13] 설정버튼메뉴 / [36:22] card switch animation / [36:38] 결과확인 / [36:59] flip / [37:21] pop / [37:40] scroll과 slide / [38:06] 코드확인 / [38:29] carousel의 속성 / [39:22] ui / [39:39] direction / [39:50] indecator / [40:08] carousel의 메소드 / [40:12] next/prev / [40:24] getactiveitem/getactiveitem/getactiveindex / [40:59] cardswitch이벤트 / [41:19] 새프로젝트 / [41:51] carousel추가 / [42:10] toolbar / [42:31] button / [42:48] container / [43:22] 이름변경 / [43:42] dock방식변경 / [44:04] style속성변경 / [45:18] 폴더생성 / [45:31] img폴더생성 / [46:06] 버튼에 이벤트 추가 / [46:56] 코드작성 / [47:39] 소스확인 / [48:23] 다음버튼이벤트작성 / [48:54] 소스확인 / [49:25] 결과확인

06 오버레이창, 페이지의 구성과 이동(1)

오버레이창을 만드는 방법을 공부해서 팝업창으로 사용해보고 다양한 페이지의 구성방법과 페이지간의 이동방법에 대해 알아봅니다.

49분

책갈피 : [00:00] 오버레이창 / [00:52] 프로젝트이름지정 / [01:19] panel / [01:38] button / [01:57] html입력 / [02:31] panel/toolbar/button / [03:04] html입력 / [03:36] 클래스분리 / [03:46] promote to class / [03:58] 속성변경 / [05:12] hidden / [05:22] width / [05:49] 이벤트추가 / [06:01] 코드작성 / [06:33] 팝업창이벤트추가 / [06:50] 코드작성 / [07:21] 버튼이름변경 / [07:41] 결과확인 / [08:44] 페이지이동 / [09:13] 화면이동흐름 / [09:49] 파일의 구성 / [11:37] 프로젝트명지정 / [11:58] panel / [12:45] 패널추가 / [13:02] useralias / [13:14] userclassname / [13:22] 레이아웃변경 / [13:32] mypanel속성변경 / [14:08] 패널추가 / [14:19] 속성변경 / [15:24] 패널추가/속성변경 / [16:18] mypanelsub1 / [16:49] 패널이동 / [17:04] mypanelsub2 / [17:43] flex / [18:15] promot to class / [18:55] 화면2의 구성 / [19:26] html작성 / [20:04] mypaneltop2 / [20:25] 레이아웃변경 / [20:52] mypanelsub3 / [21:15] mypanelsub4 / [21:38] 패널이동 / [22:03] 화면3carousel구성 / [22:13] carousel추가 / [22:37] mypanel5와 6 생성 / [23:04] 패널이동 / [23:10] promot to class / [23:57] 파일구조 다시확인 / [24:21] 패널이동 / [25:03] titlebar / [25:38] 시작버튼 / [26:00] centered / [26:41] 소스코드확인 / [27:14] mypanellogin코드확인 / [27:54] 메인패널 / [28:19] 패널이동 / [29:47] titlebar / [30:04] button / [30:27] mypaneltop2설정 / [31:02] toolbar / [31:12] button / [31:37] sub3버튼추가 / [32:02] dock방식변경 / [32:11] sub4버튼추가 / [32:48] mycarousel / [33:20] sub5html / [33:55] toolbar/button추가 / [34:52] dock방식변경 / [35:41] 툴바정렬변경 / [36:04] mypanel / [36:12] main화면 / [36:33] top1화면 / [36:54] top2 / [37:18] sub4 / [37:49] top3 / [38:01] sub6 / [38:36] 버튼제어 / [38:54] login의 시작버튼 / [39:10] name / [39:29] 속성추가 / [39:39] name지정 / [40:08] top1의 버튼name / [40:38] top2의 버튼name / [41:09] sub3의 버튼name / [41:28] sub4의 버튼name / [41:51] mycarousel의 버튼 / [42:17] main의 버튼 / [43:16] controller / [43:37] views / [43:53] 패널추가 / [44:18] 코드보기 / [44:35] controller reference / [45:11] ref/selector/xtype / [45:34] mypanellogin추가 / [45:47] 속성지정 / [45:57] 소스확인 / [46:20] mypanelmain추가 / [46:31] 속성지정 / [46:43] mypaneltop1추가 / [46:58] mypaneltop2추가 / [47:12] mycarousel추가 / [47:44] mypanelsub1추가 / [47:59] mypanelsub2 / [48:15] mypanelsub3/4 / [48:51] mypanelsub5/6

07 페이지의 구성과 이동(2), 리스트뷰, 데이터뷰, Ajax 데이터

페이지 구성과 이동 예제를 만들어보고 리스트뷰와 데이터뷰를 공부합니다. 그리고 서버 데이터의 사용법을 배우기 위해 Ajax로 데이터를 가져오는 예제를 만들어 봅니다.

50분

책갈피 : [00:00] 화면구성과 제어 / [00:24] 레퍼런스추가 / [01:06] ref / [01:18] selector / [01:38] xtype / [01:50] 코드확인 / [02:15] btnlogintop1 / [02:36] 속성변경 / [03:08] btnlogintop2추가 / [03:36] btnlogintop3추가 / [04:20] 서브화면호출버튼 / [04:47] btnpage1추가 / [05:26] btnpage2추가 / [05:45] btnpage2 / [06:20] btnsub3추가 / [06:48] btnsub4추가 / [07:24] controller액션정의 / [07:42] 컨트롤러액션추가 / [07:59] query / [08:08] target type / [08:16] fn / [08:39] eventbining name / [08:59] 코드보기 / [09:34] 컨트롤액션추가 / [09:49] btnlogintop1 / [10:03] 속성변경 / [10:25] btnlogintop2추가 / [10:57] btnlogintop3추가 / [11:39] btnpage1추가 / [12:09] btnpage2 / [12:34] btnpage3 / [13:08] btnsub3 / [13:27] btnsub4 / [13:49] 코드확인 / [14:14] onloginbuttontap / [15:08] 소스입력 / [15:45] 저장 / [16:03] 결과확인 / [16:48] logintop1button / [17:06] 소스입력 / [17:36] 결과확인 / [18:16] logintop2소스입력 / [18:43] logintop3소스입력 / [18:52] page1소스입력 / [19:18] page2소스입력 / [19:36] page3소스입력 / [19:51] sub3소스입력 / [20:27] sub4소스입력 / [20:50] 결과확인 / [22:14] page3소스보기 / [22:30] getmycarousel / [22:44] 재확인 / [24:22] 새프로젝트 / [24:51] 저장 / [25:14] 패널추가 / [25:21] titlebar / [25:41] list / [26:02] layout / [26:25] flex값 / [27:02] model / [27:24] fields / [28:01] store / [28:31] autoload / [28:36] data / [28:49] 코드입력 / [30:45] model / [31:03] store / [31:19] 코드보기 / [31:42] 코드입력 / [31:55] 디자인모드 / [32:18] 결과보기 / [32:59] event bindings / [33:26] itemtap / [33:48] 코드입력 / [34:15] 결과확인 / [34:42] 새프로젝트 / [34:48] dataview / [35:40] 저장 / [35:56] panel / [36:11] toolbar / [36:50] dataview / [37:13] model / [37:22] store / [37:33] layout / [37:44] flex / [38:19] fields / [38:53] model / [39:10] data edit / [39:25] 코드입력 / [40:33] store / [41:06] itemtpl코드입력 / [42:21] img추가 / [42:47] 결과확인 / [43:11] img사이즈지정 / [43:33] 결과확인 / [44:02] event bindings / [44:25] ajax / [45:06] 톰캣서버 / [45:30] ajaxdata.jsp / [45:59] users / [46:31] 새프로젝트 / [47:24] toolbar / [47:37] button / [48:21] list / [48:40] layout / [49:09] displayname

08 Ajax 데이터 가져오기와 MVC 아키텍처, 멀티미디어 제어, 센차터치 차트(1)

서버에서 Ajax로 데이터를 불러와보고, MVC 아키텍처로 제어해봅니다. 그리고 멀티미디어의 비디오, 오디오, 지도 등을 사용해봅니다. 마지막으로 센차터치 차트의 종류에 대해 알아보고 사용법을 배워봅니다.

49분

책갈피 : [00:00] 화면구성과 ajax / [00:46] model / [01:11] useralias / [01:20] classname / [01:43] field name / [02:06] 코드보기 / [02:22] store / [02:46] alias / [02:58] classname / [03:22] model / [03:35] storeid / [04:08] proxy / [04:25] ajax proxy / [04:47] displayname / [05:16] url / [05:43] reader / [06:20] myjsonreader / [06:31] 속성변경 / [07:12] phnstore소스 / [07:41] lstphn / [07:51] store연결 / [08:20] itemtpl소스 / [09:21] lstphn속성 / [09:49] mypanel코드 / [10:19] 결과보기 / [11:13] 다른이름으로 저장 / [11:48] 버튼속성 / [12:22] name속성추가 / [12:49] lstphn name속성추가 / [13:20] 컨트롤러 추가 / [13:39] mycontroller / [13:53] 속성변경 / [14:35] 컨트롤러 레퍼런스 / [14:53] 속성변경 / [15:59] controller action / [16:14] query / [16:38] fn / [16:57] eventbinding name / [17:14] databutton소스 / [17:32] 코드입력 / [18:19] mycontroller소스 / [19:01] phnstore autoload / [19:14] 결과확인 / [19:53] 새 프로젝트 / [20:36] 비디어의 제어 / [20:59] 저장 / [21:10] panel / [21:17] toolbar / [21:23] button / [22:02] dock / [22:37] layout / [23:00] medio / [23:12] video / [23:24] flex / [23:48] url / [24:21] 시작버튼 이벤트추가 / [24:38] 소스입력 / [25:14] 정지버튼 이벤트추가 / [25:27] 소스입력 / [25:44] mypanel소스확인 / [26:23] id / [26:39] 결과확인 / [27:27] audio / [27:52] 새 프로젝트 / [28:09] 지도 / [28:24] panel/toolbar/button / [29:19] map / [29:58] 크기조정 / [30:08] id / [30:24] 버튼이벤트 / [30:33] tap / [30:51] 소스입력 / [31:21] locationupdate / [32:01] locationerror / [32:10] geo.updatelocation / [32:40] 폴더확인 / [32:46] app.html / [33:16] mypanel코드확인 / [33:41] 결과확인 / [34:38] map 삭제후 추가 / [34:51] id / [35:08] 결과재확인 / [36:13] 차트 / [36:25] 새프로젝트 / [37:00] chart종류 / [38:38] carousel / [39:05] titlebar / [39:35] panel추가 / [40:00] panel명 변경 / [41:27] list / [41:47] layout / [42:05] flex / [42:22] areachartpanel / [42:37] areachart / [43:01] layout / [43:33] barchart / [43:45] layout / [44:02] radachart / [44:15] layout / [44:31] columchart / [44:50] layout / [45:18] model추가 / [45:44] 속성변경 / [47:03] store / [47:19] alias / [47:30] classname / [47:42] storeid / [48:30] scoremodel/scarestore소스확인 / [49:07] model

09 센차터치 차트(2), 나침반 앱 만들기(1)

데이터를 입력해서 차트로 만들어보고, 네이티브 앱을 만들기 위한 환경설정을 해줍니다. 그리고 센차아키텍트를 이용해서 나침반 앱을 구현해 봅니다.

48분

책갈피 : [00:00] 차트 / [00:53] 데이터입력 / [01:19] 코드에디터창 / [01:58] 코드작성 / [02:24] list / [02:44] listpanel / [02:54] mylist설정변경 / [03:21] itemtpl / [03:35] 필드삽입 / [04:14] areachart설정 / [04:47] 추가메뉴확인 / [04:56] myareachart1 / [05:10] store / [05:34] categoryaxis / [06:03] numericaxis / [06:29] areaseries / [07:37] 범례설정 / [07:47] labelfield / [08:42] barchart / [09:02] store / [09:08] categoryaxis1 / [09:21] numericaxis1 / [09:39] barseries / [10:28] labelfield / [10:44] radachartpanel / [11:09] myradachart / [11:25] numericaxis2 / [11:54] categoryaxis2 / [12:08] raderseries / [13:19] columchartpanel / [13:27] linechart1 / [13:47] categoryaxis3 / [14:05] numericaxis3 / [14:09] lineseries / [15:11] 결과보기 / [16:28] 네이티브앱 / [17:17] 안드로이드개발환경설정 / [17:45] 설치항목 / [18:11] JDK / [18:26] 제어판 / [18:35] 시스템속성창 / [19:17] cmd창 / [19:54] 이클립스 / [20:49] 안드로이드SDK / [21:16] 이클립스실행 / [21:39] 안드로이드SDK지정 / [22:08] install new software / [23:00] preferences / [23:28] 안드로이드가상장치 / [23:47] AVD / [24:11] android virtual device manager / [24:37] new AVD / [25:58] start / [26:42] 앱제작 / [27:03] 폰갭설치 / [27:35] 새프로젝트 / [27:51] application설정창 / [28:58] icon설정창 / [30:06] 패키지구조확인 / [30:23] res폴더 / [30:38] 폰갭폴더확인 / [30:52] cordova.jar / [31:09] 파일복사 / [31:39] xml폴더복사 / [32:05] properties / [32:15] java build path / [33:03] mainactivity.java / [33:35] 소스수정 / [34:07] 파일경로입력 / [34:42] droidgap추가 / [35:15] androidmanirest.xml / [35:54] 소스크기변경 / [36:52] 스크린코드추가 / [37:28] 권한부여코드추가 / [38:15] permissions / [38:44] 폴더확인 / [39:07] cordova.js / [39:30] www폴더복사 / [39:56] run configuration / [40:43] 애뮬레이터창 / [41:51] 나침반만들기 / [42:12] 새프로젝트 / [42:37] panel / [42:51] toolbar / [43:12] button / [43:26] dock변경 / [44:00] 나침반이미지 / [44:49] html / [45:43] 경로지정 / [46:18] style / [47:09] 이미지크기조절

10 나침반 앱 만들기(2)와 네이티브 앱 구현, 센차 디바이스

센차아키텍트로 만든 나침반을 폰갭과 연동하여 실제로 모바일에서 움직일 수 있게 만들어 주고, Sencha Cmd를 이용해 네이티브 앱을 구현해 봅니다. 그리고 마지막으로 센차 디바이스에 대해 공부합니다.

52분

책갈피 : [00:00] 나침반 / [00:30] 세부사항설정 / [00:46] 버튼이름변경 / [01:05] dock변경 / [01:29] requires / [02:16] launch이벤트추가 / [02:39] 코드입력 / [03:40] 폴더확인 / [03:48] app.js / [04:01] requires / [04:12] launch / [05:03] 변수추가 / [05:24] 회전메소드추가 / [05:50] console.log / [06:48] settimeout / [07:15] 버튼에 이벤트 부여 / [07:37] 소스코드입력 / [08:18] 우측버튼이벤트부여 / [08:54] 결과확인 / [10:07] 다른이름저장 / [10:47] 라이브러리로더 / [11:01] application속성 / [11:20] loader추가 / [11:42] loader속성창 / [11:55] paths editor창 / [12:11] 소스코드입력 / [13:10] requires추가 / [13:47] 메소드추가 / [14:11] 변수선언 / [14:45] startwatch / [15:41] stopwatch / [15:58] onsuccess/onerror / [16:48] application추가내용확인 / [17:00] loader path소스수정 / [17:34] 결과확인 / [17:46] 에러확인 / [18:49] 파일복사 / [18:59] 결과확인 / [20:08] 폰갭과 연동 / [20:16] 이클립스-새프로젝트 / [21:10] 라이브러리 연결작업 / [21:49] 폴더확인 / [22:12] 폴더내용복사 / [22:45] index.html삭제 / [22:58] app.html / [23:29] 라이브러리경로 / [23:51] 폴더구조확인 / [24:10] res폴더 / [24:51] config.xml / [25:25] 소스변경 / [26:35] 권한부여 / [26:42] access origin / [27:13] run / [27:44] 결과확인 / [28:47] 제어버튼확인 / [29:08] 네이티브앱구현 / [29:45] 새프로젝트 / [30:12] package / [30:30] install plug-ins / [30:49] 폴더경로지정 / [31:36] 차트프로젝트열기 / [31:54] 다른이름저장 / [32:24] project settings / [32:55] package / [33:03] 경로변경 / [33:48] setup project with cmd / [34:03] 라이브러리위치지정 / [34:43] package settings / [35:20] configure / [35:44] 속성확인 / [35:57] applicationid / [36:34] applicationname / [36:47] inputpath / [37:03] outputpath / [37:30] platform / [38:15] androidapilevel / [38:45] sdkpath / [39:35] android virtual device manager / [40:18] 결과확인 / [40:40] 프로젝트관리자창 / [40:50] packager속성 / [41:31] sencah cmd setup / [41:54] simulate / [42:30] 루비인스톨러 / [42:57] 루비설치확인 / [43:44] gem install compass / [44:50] outputpath / [45:17] 센차디바이스 / [45:58] ext.device / [46:24] camera/connection/contacts/device / [47:00] geolocation/notification/orientation/push / [47:31] ext.device.camera / [48:11] ext.device.connection / [48:35] ext.device.contacts / [48:50] ext.device.device / [49:22] ext.device.geolocation / [50:32] ext.device.notification

샘플확인 : 알지오 검색후 -> 강의검색란 -> Sencha Architect