가장 널리 사용되는 차트 엔진 ECharts를 사용하여 전자상거래 플랫폼 데이터 표시

• 장1 제1장
• 1-1 코스소개
• 1-2 프로젝트 시연
• 1-3 데이터 시각화 개념
• 1-4 EChart 소개
• 1-5 ECharts로 빠르게 시작하세요
• 1-6 관련 구성 항목 설명
• 1-7 막대 차트의 기본 구현 및 공통 효과
• 1-8 일반 구성_제목 관련 구성
• 1-9 일반 구성_툴팁 관련 구성
• 1-10 일반 구성_toolbox 관련 구성
• 장2 2장
• 2-1 일반 구성_전설 관련 구성
• 2-2 꺾은선형 차트의 기본 구현
• 2-3 꺾은선형 차트의 일반적인 효과 1
• 2-4 꺾은선형 차트 2의 일반적인 효과
• 2-5 산점도의 기본 구현
• 2-6 산점도의 일반적인 효과
• 2-7 직각좌표계의 공통 구성 그리드
• 2-8 직교좌표계 공통 구성축
• 2-9 일반적으로 사용되는 직각 좌표계 구성 dataZoom
• 장3 세 번째 장
• 3-1 원형 차트의 기본 구현
• 3-2 원형 차트의 일반적인 효과
• 3-3 지도의 기본 구현 및 공통 구성
• 3-4 공통 지도 효과_지방 지도 표시
• 3-5 공통 지도 효과_공기질 표시
• 3-6 지도의 일반적인 효과_지도와 산점도의 조합
• 3-7 레이더 차트 구현
• 3-8 대시보드 구현
• 3-9 ECharts 기본 요약
• 3-10 테마 사용법
• 장4 4장
• 4-1 색상 팔레트 및 색상 그라디언트
• 4-2 다이렉트 스타일과 하이라이트 스타일 사용
• 4-3 차트 적응 구현
• 4-4 차트 로딩 애니메이션 구현
• 4-5 차트 증분 애니메이션 설명
• 4-6 차트 애니메이션 구성 항목
• 4-7 전역 ECharts 개체의 일반적인 메서드 1
• 4-8 전역 ECharts 개체의 일반적인 메서드 2
• 4-9 echartsInstance 개체 1의 일반적인 메서드
• 4-10 echartsInstance 객체 2의 일반적인 메서드
• 장5 5장
• 5-1 ECharts 고급 요약
• 5-2 Koa2 소개
• 5-3 Koa2로 빠르게 시작하기
• 5-4 Koa2 미들웨어의 특징
• 5-5 백엔드 프로젝트_프로젝트 준비
• 5-6 백엔드 프로젝트_총 시간이 많이 소요되는 미들웨어 개발
• 5-7 백엔드 프로젝트_응답 헤더 미들웨어 개발
• 5-8 백엔드 프로젝트_비즈니스 로직 미들웨어 개발
• 5-9 백엔드 프로젝트_교차 도메인 구성
• 5-10 프론트엔드 프로젝트_프로젝트 생성 및 준비
• 장6 6장
• 6-1 프론트엔드 프로젝트_가맹점 매출 통계_컴포넌트 구조 및 레이아웃 구조
• 6-2 프론트엔드 프로젝트_가맹점 매출통계_차트 기본 기능
• 6-3 프론트엔드 프로젝트_가맹점 매출 통계_동적 새로고침 구현
• 6-4 프론트엔드 프로젝트_가맹점 매출통계_UI 조정 1
• 6-5 프론트엔드 프로젝트_가맹점 매출통계_UI 조정 2
• 6-6 프론트엔드 프로젝트_가맹점 매출통계_분할옵션
• 6-7 프론트엔드 프로젝트_가맹점 판매통계_해상도 적응
• 6-8 프론트엔드 프로젝트_판매 동향 차트_일반 코드 구조
• 6-9 프론트엔드 프로젝트_판매동향 차트_기본 차트 표시
• 6-10 프론트엔드 프로젝트_판매 동향 차트_UI 조정
• 장7 제7장
• 7-1 프론트엔드 프로젝트_판매동향 차트_스위칭 차트 구현
• 7-2 프론트엔드 프로젝트_판매 동향 차트_해상도 적응
• 7-3 프론트엔드 프로젝트_가맹점 지도 배포_디스플레이 지도 1
• 7-4 프론트엔드 프로젝트_가맹점 지도 유통_디스플레이 지도 2
• 7-5 프론트엔드 프로젝트_가맹점 지도 분포_분산점 표시
• 7-6 프론트엔드 프로젝트_가맹점 맵 배포_UI 조정
• 7-7 프론트엔드 프로젝트_가맹점 지도 배포_해상도 적응
• 7-8 프론트엔드 프로젝트_가맹점 지도 배포_지도 클릭 효과
• 7-9 프론트엔드 프로젝트_판매 순위 차트_기본 차트 표시
• 7-10 프론트엔드 프로젝트_판매 순위 차트_UI 조정
• 장8 8장
• 8-1 프론트엔드 프로젝트_판매 순위 차트_번역 애니메이션 효과
• 8-2 프론트엔드 프로젝트_판매 순위 차트_해상도 적응
• 8-3 프론트엔드 프로젝트_핫셀 상품 비율_기본 차트 표시
• 8-4 프론트엔드 프로젝트_핫셀링 제품 비율_데이터 전환
• 8-5 프론트엔드 프로젝트_핫셀 상품 비율_UI 조정
• 8-6 프론트엔드 프로젝트_핫셀링 제품 비율_해상도 적응
• 8-7 프론트엔드 프로젝트_재고 판매 모듈_기본 차트 표시
• 8-8 프론트엔드 프로젝트_재고 판매 모듈_UI 조정
• 8-9 프론트엔드 프로젝트_재고 판매 모듈_전환 애니메이션
• 8-10 프론트엔드 프로젝트_재고 판매 모듈_해결책 적응 1
• 장9 9장
• 9-1 프론트엔드 프로젝트_재고 판매 모듈_해결책 적응 2
• 9-2 WebSocket_backend의 기본 사용
• 9-3 WebSocket_front end의 기본 사용
• 9-4 백엔드 프로젝트의 변화
• 9-5 프런트엔드 및 백엔드 데이터 필드에 대한 규칙
• 9-6 백엔드가 데이터를 수신할 때 처리
• 9-7 프런트 엔드 코드 변환_서버에 연결
• 9-8 프런트 엔드 코드 변환_수신된 데이터 처리
• 9-9 프런트엔드 코드 변환_컴포넌트 변환
• 9-10 프런트엔드 코드 변환_최적화
• 장10 10장
• 10-1 세부처리_컴포넌트 병합
• 10-2 디테일 처리_전체 화면 전환_레이아웃 스타일
• 10-3 상세처리_전체화면 전환_클릭 이벤트 처리
• 10-4 디테일 처리_전체 화면 전환_링크 효과
• 10-5 세부처리_테마전환_차트테마
• 10-6 세부처리_테마전환_정의 데이터
• 10-7 세부처리_테마 전환_네이티브 HTML 전환
• 10-8 디테일 처리_테마 전환_연계 효과