[Angular] Multi Drag and Drop
·
개발 (Development)/Angular
1. CSS .selected{ border: 1px solid green!important; } .selected.hide{ opacity: 0.3; } .selected를 정의하여 선택된 item과 선택되지 않은 item을 구별한다. 2. JavaScript(TypeScript) import {CdkDragDrop, CdkDragStart, CdkDragEnd, moveItemInArray, transferArrayItem} from '@angular/cdk/drag-drop'; Drag & Drop 동작에 필요한 CdkDragDrop, CdkDragStart, CdkDragEnd 를 import 한다. drop(event: CdkDragDrop) { // If current element has "..
[React] 프로젝트 환경 설정
·
개발 (Development)/React
1. Node.js 설치 https://nodejs.org/ko/download/ 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 운영체제에 맞는 Installer를 선택 후 설치한다. 2. Yarn 설치 https://classic.yarnpkg.com/en/docs/install#windows-stable Yarn Fast, reliable, and secure dependency management. classic.yarnpkg.com 운영체제에 맞는 방식에 따라 설치하면 된다. 나는 cmd 창에서 아래 명령어를 입력하여 설치했다. npm install --global y..
[Vue.js] 프로젝트 환경 설정
·
개발 (Development)/Vue.js
1. Node.js 설치 현재 기준 LTS 버전인 v16.14.2 설치 https://nodejs.org/ko/download/ 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. Visual Studio Code 설치 및 Plug In 설치 https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud appli..
[Java] 자료 구조
·
개발 (Development)/Java
Java Collection Java에서 컬렉션이란 데이터의 집합, 그룹을 의미하며, JCF(Java Collections Framework)는 이러한 데이터, 자료구조인 컬렉션과 이를 구현하는 클래스를 정의하는 인터페이스를 제공한다. 다음은 Java 컬렉션 프레임워크의 상속구조를 나타낸다. Collection 인터페이스는 List, Set, Queue로 크게 3가지 상위 인터페이스로 분류할 수 있다. 그리고 여기에 Map의 경우 Collection 인터페이스를 상속 받고 있지 않지만 Collection으로 분류된다. Collection 인터페이스의 특징 인터페이스 구현클래스 특징 List LinkedList Vector ArrayList Stack 순서가 있는 데이터의 집합으로 데이터의 중복을 허용한다..