Component

SOLID원칙이 벽과 방에 벽돌을 배치하는 방법이라면, 컴포넌트 원칙은 빌딩에 방을 배치하는 방법을 설명해준다. 큰 빌딩과 마찬가지로 대규모 소프트웨어 시스템은 작은 컴포넌트들로 만들어진다. 컴포넌트는 시스템의 구성 요소로 배포할 수 있는 가장 작은 단위다. 자바의 경우 jar 파일이 컴포넌트 컴포넌트 응집도 어떤 클래스를 어느 컴포넌트에 포함시켜야 할까? 소프트웨어 엔지니어링 원칙의 도움이 필요하다. 컴포넌트 응집도와 관련된 세 가지 원칙 REP : 재사용/릴리스 등가 원칙 (Reuse/Release Equivalence Principle) CCP : 공통 폐쇄 원칙 (Common Closure Principle) CRP : 공통 재사용 원칙 (Common Reuse Principle) REP: 재사용..

kotlin 데이터 클래스는 구조 분해 선언(Destructuring Declaration)이라는 특성을 갖고 있다. 구조 분해를 사용하면 복합적인 값을 분해해서 여러 다른 변수를 한꺼번에 초기화할 수 있다. val p = Point(10, 20) val (x, y) = p // x => 10 // y => 20 구조 분해 선언의 각 변수를 초기화하기 위해 componentN이라는 함수를 호출한다. data 클래스의 주 생성자에 들어있는 프로퍼티에 대해서는 컴파일러가 자동으로 componentN함수를 만들어준다. val (x, y) = p // 위 코드 컴파일 후 val x = p.component1() val y = p.component2() // data 타입이 아닌 클래스에서 구현하는 방법 clas..

Vue의 경우 컴포넌트로 화면을 구성하므로 같은 웹 페이지라도 데이터를 공유할 수 없음 그 이유는 컴포넌트마다 자체적으로 고유한 유효 범위(Scope) 를 갖기 때문 각 컴포넌트의 유효 범위가 독립적이기 때문에 다른 컴포넌트의 값을 직접적으로 참조할 수가 없음 상 하위 컴포넌트 관계 직접 다른 컴포넌트의 값을 참조할 수 없기 때문에, 뷰 프레임워크 자체에서 정의한 컴포넌트 데이터 전달 방법을 따라야 한다. 기본적인 데이터 전달 방법은 바로 상위(부모) - 하위(자식) 컴포넌트 간의 데이터 전달 방법 하위 컴포넌트 — 이벤트발생 —> 상위 컴포넌트 상위 컴포넌트 — props 전달 —> 하위 컴포넌트 하위에서 상위는 기본적으로 이벤트만 전달할 수 있음 상위에서 하위 컴포넌트로 데이터 전달하기 상위컴포넌트에..

컴포넌트(component)란 조합하여 화면을 구성할 수 있는 블록을 의미 컴포넌트를 활용하면 화면을 빠르게 구조화하여 일괄적인 패턴으로 개발할 수 있음. 화면의 영역을 컴포넌트로 쪼개서 재활용할 수 있는 형태로 관리하면 나중에 코드를 다시 사용하기가 훨씬 편리함. 컴포넌트 등록하기 전역(Global) : 여러 인스턴스에서 공통으로 사용할 수 있는 컴포넌트 지역(Local) : 특정 인스턴스에만 유효한 범위를 갖음 전역 컴포넌트 등록 라이브러리 로딩 후 Vue 변수를 이용하여 등록 Vue.component("컴포넌트 이름", { // 컴포넌트 내용 }); 컴포넌트 이름 ⇒ template 속성에서 사용할 HTML 사용자 정의 태그(custom tag) 컴포넌트 내용 ⇒ 컴포넌트 태그가 실제 화면의 HTM..