Thumbnail
개발 · 프로그래밍 프론트엔드

Sencha ExtJS 6 로 화면개발 더이상 고민하지 말자 - 기초편 대시보드

(4.9)
27개의 수강평 ∙  1,611명의 수강생

무료

지식공유자: 개발로짜
총 31개 수업 (9시간 3분)
수강기한: 
무제한
수료증: 미발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가 공유

초급자를 위해 준비한
[웹 개발, 프론트엔드] 강의입니다.

디자이너 + 퍼블리셔 + 개발자의 조합으로 대부분의 사이트를 제작합니다. 순수하게 Sencha의 ExtJS 컴포넌트를 이용하면, 디자이너와 퍼블리셔 없이 화면개발이 가능합니다. 단, 상용화 목적으로 ExtJS를 사용하신다면, 라이센스정책을 정확하게 숙지하시고 사용하시길 바라겠습니다.

강좌소개

ExtJS는 강력한 자바스크립트 UI 프레임워크입니다. 그리드,차트,트리외에도 수백가지 컴포넌트들을 제공합니다. 전문적인 CSS 지식이 없어도 레이아웃 및 화면을 짧은 시간내에 만들 수 있습니다. 기본편에서는 오로지 컴포넌트들을 이용해서 레이아웃 배치 및 컴포넌트 이해, 그리고 이벤트(클릭,더블클릭 등..) 기본동작방법에 대하여 알아보도록 합니다. ExtJS는 오로지 자바스크립트로만 화면개발 및 기능을 구현합니다. 즉, BODY 태그에 어떠한 HTML 코드도 들어가지 않습니다. 요즘 이슈가 되고 있는 Angular, React 와는 별도로  UI를 만드는 재미를 느끼실 수 있을겁니다. 아래는 ExtJS 만을 이용해서 만들어본 WebOS 시연영상입니다.    
※ 상용목적으로 ExtJS를 고려하시는 분들이시라면 라이센스정책에 대해서 정확히 숙지 후, 프로젝트에사용하시길 바랍니다.

참고 URL

https://github.com/mongoworld/extjs_world (강의에서 진행 될 샘플코드)
http://mongodev.tistory.com (강의관련 내용 정리 블로그)
https://www.youtube.com/channel/UCmIEd8PTq5PXJyXlboXKOpQ 질문관련 댓글은 youtube 채널을 통해서 달아주세요 ^^ 구독도 부탁드릴게요 ㅠㅠ

강좌대상

  • CSS 기술부분이 약해서 화면개발에 자신없는 디자이너 및 개발자
  • 대학 졸업작품을 웹어플리케이션으로 만들고자 하는 대학생
  • 디자이너 및 퍼블리셔 인력이 존재하지 않는 기업
  • 화면구성을 CS 프로그램과 같은 구조로 기획을 하고계신 분

안녕하세요
개발로짜 입니다.
개발로짜의 썸네일
커리큘럼 총 31 개 ˙ 9시간 3분의 수업
이 강의는 영상, 수업 노트가 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 1강. 오리엔테이션
섹션 1. 2강.ExtJS 환경구성
섹션 2. 3강.다양한 테마변경과 헬로월드 메시지 띄우기
섹션 3. 4강.ExtJS 문법이해 및 레이아웃 알아보기
문법 및 레이아웃 이해(1) 미리보기 21:37
문법 및 레이아웃 이해(2) 17:08
종이에 레이아웃을 나눠보고 border 레이아웃 속성을 통하여 화면을 만들어보세요 01:00
섹션 4. 5강.ExtJS 레이아웃 추가로 알아보기
레이아웃 추가로 알아보기 21:54
섹션 5. 6강.ExtJS API 문서보는 방법 간단 소개
API 문서보는법 22:55
섹션 6. 7강.ExtJS 6 버튼종류 알아보기
섹션 7. 8강.ExtJS 6 메시지상자 다뤄보기
섹션 8. 9강.ExtJS 6 윈도우 컴포넌트 알아보기
윈도우 컴포넌트의 속성들을 알아보자 14:05
섹션 9. 10강.ExtJS 6 탭패널 알아보기
탭패널 간단히 만들어보기 04:46
섹션 10. 11강.ExtJS 6 폼필드 알아보기
입력태그에는 어떤것들이 있을까? 15:48
섹션 11. 12강.ExtJS 6 데이터스토어 이해
DataStore 이해(1) - 콤보박스 연동 11:28
DataStore 이해(2) - 그리드 연동 09:36
DataStore 이해(3) - Ajax편 16:38
섹션 12. 13강.ExtJS 6 트리패널 알아보기
트리(TreePanel) + Tree Store 이해 20:28
섹션 13. 14강.ExtJS 6 그리드 페이징 및 버퍼스토어
섹션 14. 15강.ExtJS 6 그리드 에디팅 플러그인
그리드 에디팅플러그인 적용(cellediting,rowediting) 20:53
섹션 15. 16강.ExtJS 6 이벤트 리스너 알아보기
툴바 종류 및 이벤트리스너 + 그리드 renderer 이해 24:40
섹션 16. 17강.ExtJS 6 그리드 CRUD 예제
그리드 조회,등록,수정,삭제 한방에 끝내기 28:51
섹션 17. 18강.ExtJS 6 Ajax 이해
ExtJS Ajax 클래스 이해하기 24:03
섹션 18. 19강. ExtJS 차트그래프
세로,가로 그래프 이해 16:14
누적막대그래프 이해 12:56
선형그래프 이해 11:56
영역그래프 이해 17:42
분산/분포 그래프 이해 13:54
원형 그래프 이해 미리보기 11:01
섹션 19. 20강. ExtJS 소스코드 가독성 높이기
섹션 20. 21강. ExtJS 컴포넌트 교체
섹션 21. UI 템플릿 예제
강의 게시일 : 2017년 01월 20일 (마지막 업데이트일 : 2018년 04월 09일)
수강평 총 27개
수강생분들이 직접 작성하신 수강평입니다.
4.9
27개의 수강평
5점
4점
3점
2점
1점
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
everick9 thumbnail
5
감사합니다~!
2022-04-30
Chang Hwan Yang thumbnail
5
ExtJS 사용하는 곳이 있어서 찾아보게 되었습니다. ExtJS를 이해하는데 아주 좋은 강의라 생각합니다.
2023-03-12
sulkiu73 thumbnail
5
강의 잘 들었습니다 감사합니다!!
2022-06-09
쿠카이든 thumbnail
5
ExtJS 6로 화면을 개발하니 정말 재미있네요! 명강의 감사합니다~!
2024-01-08
KYUNG TAE BAE thumbnail
5
Sencha ExtJS 6에 대해 처음 배웠는데.. 많은 도움이 되었습니다! 좋은 강의 감사드려요
2023-12-30