ExtJS 6 강좌 영상은 링크를 통해 제공됩니다. (YOUTUBE 채널 구독해주세요!!) https://youtu.be/YOkY8ra_AOk 지난 시간부터는 샘플 프로젝트를 위한 템플릿을 제작중입니다. 오늘은 지난시간에 정한 메뉴목록 클릭 시, 중앙영역에 변경되는 컴포넌트를 변경해보도록 합니다. treelist → listeners → selectionchange 트리리스트 컴포넌트의 리스트 변경이벤트 selectionchange(this,record,eOpts) this : 트리리스트 자기자신 record : 선택된 노드의 레코드 값들 eOpts : 리스너에 전달된 옵션객체 특정 위치 컴포넌트 교체 폼필드 컴포넌트의 레이블 옵션 fieldLabel : Stringvalue 값에 정의를 하면 폼필드의 ..
ExtJS 6 강좌 영상은 링크를 통해 제공됩니다. (YOUTUBE 채널 구독해주세요!!) https://youtu.be/5YjXYYoQ2ew 서버API 만들기 전, 화면개발 먼저 진행하겠습니다. app.js기존에 프로젝트 생성한 ExtJS 빌드 구조에서 app.json내에 존재하는 mainView를 주석 또는 지워줍니다. 로그인 - Login Form app → view → login 디렉토리 생성 후, Login.js 파일 생성 로그인의 경우 일반적으로 패널 또는 윈도우 컴포넌트로 생성을 하지만, 어떤 컴포넌트를 이용해서 만드는거에 대한 정답은 없습니다.여러분이 편하신 컴포넌트로 제작을 하시면 되지만, 저같은 경우는 윈도우 컴포넌트를 이용하여 만들어 보았습니다. Application.jsconfig ..
ExtJS 6 강좌 영상은 링크를 통해 제공됩니다. (YOUTUBE 채널 구독해주세요!!) https://youtu.be/PExqR3Pt1LM 지난시간에 Spring Boot를 이용하여 기본설정을 진행했었습니다. 2017/04/12 - [ExtJS 6 동영상강좌] - ExtJS6 실전응용편 두번째 강좌 - Spring boot로 개발 환경 구성 및 API 연동 테스트 1장 (development environment and API test 2-1) 2017/04/12 - [ExtJS 6 동영상강좌] - ExtJS6 실전응용편 두번째 강좌 - Spring boot로 개발 환경 구성 및 API 연동 테스트 2장 (development environment and API test 2-2) 이번시간에는 추가로 ..
ExtJS 6 강좌 영상은 링크를 통해 제공됩니다. (YOUTUBE 채널 구독해주세요!!) https://youtu.be/nUvatm6yIBM 지난 시간에 간단하게 Spring Boot 기본설정을 통하여 JSON API 생성하는 부분까지 진행했었습니다. 2017/04/11 - [ExtJS 6 동영상강좌] - ExtJS6 실전응용편 두번째 강좌 - Spring boot로 개발 환경 구성 및 API 연동 테스트 1장 이번시간은 우리가 실전응용편 첫번째 강좌에서 진행 했던대로 Sencha CMD를 통해서 webapp 디렉토리내에 ExtJS 프로젝트를 생성하도록 하겠습니다. 2017/04/11 - [ExtJS 6 동영상강좌] - ExtJS6 실전응용편 첫번째 강좌 - 빌드 후 샘플소스 WAS에 배포하기(Buil..
ExtJS 6 강좌 영상은 링크를 통해 제공됩니다. (YOUTUBE 채널 구독해주세요!!) https://youtu.be/nUvatm6yIBM ExtJS 실전/응용 두번째 강좌입니다. 많은 분들께서 서버연동하는 부분까지 요청을 주셔서 진행을 하게 되었습니다. 저의 경우, Dynamic Web Project 를 이용해서 프로젝트 생성을 하지 않고, Spring Boot를 이용해서 서버연동을 진행하도록 하겠습니다. Dynamic Web Project 로 진행을 하게 되면 이클립스의 경우 Building Workspace 동작을 하면서 이클립스 자체에서 메모리관련 문제가 발생합니다. Validation 설정으로 막을수도 있는 부분이긴 합니다만, 해당 부분은 IDE 설정부분이 기 때문에 따로 설명드리지 않도록 ..
ExtJS 6 강좌 영상은 링크를 통해 제공됩니다. (YOUTUBE 채널 구독해주세요!!) https://youtu.be/zSKJLVQ67xQ 안녕하세요 개발로짜입니다 ^^기초편에서 우리가 ExtJS의 문법과 컴포넌트 이해를 배웠다면,이번강좌에서는 간단한 웹프로그램을 만들어보면서 서버와 API 통신까지 해보는 시간을 가져보려고 합니다. 우선 기초편에서는 Generate 할때, classic(ExtJS) / modern(Sencha Touch) 구조로 생성하였는데, 실전/응용편에서는 ExtJS 만을 다루기 위하여 classic 버전만으로 진행을 하기 위해 새로운 ExtJS 프로젝트를 Generate 해주도록 하겠습니다. ExtJS 를 Generate 하기 위한 임의의 디렉토리 생성예) D:\study라는 ..
ExtJS 6 강좌 영상은 링크를 통해 제공됩니다. (YOUTUBE 채널 구독해주세요!!) https://youtu.be/vUSf6LnEWOk 우리는 지금까지 기본 컴포넌트 생성법에 대하여 알아보았습니다. 간단하게 템플릿 구성을 한 후, 중앙영역에 우리가 미리 정의해놓은 컴포넌트를 변경해보는 시간을 가져보도록 합니다. app.js Code 위와 같이 코드에서 각 버튼 클릭이벤트 발생 시, handler 함수내에 정의한 뷰포트의 중앙영역을 selector를 이용하여 변수에 담은 후, 중앙영역내에 있는 컴포넌트들을 모두 removeAll을 이용하여 삭제합니다. 그런 다음. add 함수를 이용하여 우리가 미리 define 해놓은 컴포넌트를 삽입하여 줍니다. GridSample.js Code ButtonSamp..