웹 프로그래밍 노트

Scope : 해당 의존성을 언제 어떻게 Class Path에 넣어서 사용할 것인가를 정의하는 값이다.

Scope Type 

1. Compile : 
 - Compile 시점에 필요하다.
 - 기본값(=Default)이다.
 - 프로젝트의 모든 Class Path에 추가된다.
 - 기본값이기 때문에 만일 scope 설정을 안하면 compile이 기본입니다
 
2. Runtime : 
 - Runtime 시점에 필요하다.
 - Compile 시점에는 필요가 없지만 실행 시점에는 필요하다.
 - Runtime, 테스트 시 Class Path에 추가 되지만 Compile시에는 추가 되지 않는다.
 - ex) JDBC 드라이버
 
3. Provided :
 - Compile 시점에 필요하지만 배포시점에는 불필요한 라이브러리로 JDK, servlet API, Java EE API 등이 해당된다.
 - provided 스코프는 최종 Build Artifact 에 포함되지 않을 때 사용한다. 
 - 예를 들면 프로젝트가 servlet api를 의존하고 있는데, tomcat에서는 기본적으로 servlet api을 제공하고 있을 경우 artifact 에 포함시킬 필요가 없다.
 - Scope 값을 provided로 설정한 의존성에 대해서는 Runtime 시점에 JDK 혹은 컨테이너가 제공한다.
 - 간략 요약하면 Wep Application 개발 시 Servlet API or Java EE API들은 provided Scope으로 지정해야한다. 왜냐하면 톰캣과 같은 컨테이너가 제공해주기 때문이다.
 - 만약 운영환경에서 servlet-api.jar 중복으로 인한 문제가 발생한다면 꼭 provided로 바꿔주셔야 합니다.
 - ex) Servlet API
 
4. Test
 - Compile 시점에 필요하다.
 - 배포때는 제외된다.
 - ex) JUnit
 
5. system
 - system은 provided와 유사하지만 JAR 파일을 직접 사용합니다.
 - 이 때는 JAR 파일의 위치를 지정하는 systemPath 엘리먼트가 따라와야 해요.

에러 내용

ORA-12899: value too large for column

"스키마"."테이블명"."컬럼" (actual: m, maximun: n)

→ 해당 테이블 컬럼값의 타입 길이보다 실제 입력된 값이 커서 발생하는 에러이다.

해결 방법

해당 테이블의 컬럼의 타입과 길이를 확인하고, 문제가 발생하는 데이터를 찾는다.

이때 문자열 길이 함수를 사용한다.

에러 처리 방법은 아래 두가지 방법 중 하나를 선택한다.

1. 해당 문제가 되는 데이터를 찾아 값을(길이) 수정한다.

2. 해당 테이블의 컬럼 길이를 수정한다. ( 예 : VARCHAR2(30) → VARCHAR2(40) )

글자 수 구하기 LENGTH()

SELECT * FROM EMP

WHERE LENGTH(ENAME) = 5;

바이트 수 구하기 LENGTHB()

SELECT * FROM EMP

WHERE LENGTHB(ENAME) = 5;

LENGTH 함수는 입력된 문자열의 글자 수를 반환하고 LENGTHB 함수는 바이트 수로 반환한다. LENGTHB 함수는 시스템 문자셋 설정에 따라서 한글을 2byte 또는 3byte로 계산하므로 주의해야 한다.

시스템 문자셋을 확인하는 방법 (몇 byte로 계산되는지), CONVERT()

한글 문자셋

- KO16KSC5601(2byte)

- KO16MSWIN949(2byte)

- UTF8(3byte)

- AL32UTF8(3byte)

SELECT * 
 FROM nls_database_parameters 
WHERE parameter LIKE 'NLS_CHARACTERSET'

[결과]

한글을 2byte로 인식하게 하기 (3byte → 2byte)

SELECT LENGTHB(CONVERT('오라클', 'KO16MSWIN949')) AS LENGTHB
 FROM dual;

[결과]

3장 인스턴스 & 컴포넌트

1. Vue 인스턴스 속성 
 1) data : data 부분
 2) el : html id를 가진 요소를 의미함
 3) template : 화면에 표시할 html, css 등의 태그 요소를 정의하는 속성
 4) methods : 화면 로직의 제어와 관계된 메소드를 정의하는 속성 (이벤트 처리와 같은 로직)
 5) created : 뷰 인스턴스가 생성되자마자 실행할 로직을 정의할 수 있는 속성
 
2. 뷰 인스턴스 라이프 사이클

 1) 인스턴스 생성 → 인스턴스를 화면에 부착
  1> beforeCreate : 인스턴스가 생성되고 나서 가장 처음으로 실행되는 단계 (data 속성과 methods 속성이 아직 인스턴스에 정의되어 있지 않고 돔과 같은 화면 요소에도 접근할 수 없음)
  2> created : data 속성과 methods 속성에 정의도니 값에 접근하여 로직을 실행할 수 있는 단계 (서버에 데이터를 요청하여 받아오는 로직을 수행하기 좋은 단계)
  3> beforeMount : template 속성을 el에 지정한 화면 요소에 인스턴스를 부착하기 직전 단계
  4> mounuted : el 속성에 지정한 화면 요소에 인스턴스가 부착되고 호출되는 단계로 template 속성에 정의한 화면 요소에 접근할 수 있어 화면 요소를 제어하는 로직을 수행하기 좋은 단계

 2) 인스턴스를 화면에 부착 → 인스턴스 내용 갱신
  1> beforeUpdate : 인스턴스에 정의한 속성이 화면에 치환되는 단계 (데이터가 변경되면 가상 돔으로 화면을 다시 그리기 전에 호출되는 단계, 변경 예정 데이터의 값과 관련된 로직을 미리 넣을 수 있음)
  2> update : 데이터가 변경되고 나서 가상 돔으로 다시 화면을 그리고 나면 실행되는 단계
 
 3) 인스턴스 내용 갱신 → 인스턴스 소멸  
  1> beforeDestroy : 뷰 인스턴스가 파괴되기 직전에 호출되는 단계 (인스턴스에 접근할 수 있음, 데이터를 삭제하기 좋은 단계)
  2> destroyed : 뷰 인스턴스가 파괴되고 나서 호출되는 단계

3. 컴포넌트 : 조합하여 화면을 구성할 수 있는 블록을 의미함
 1) 컴포넌트 등록 방법
  1> 전역 컴포넌트 등록
Vue.component('my-component', {
       template: '<div> 전역 컴포넌트가 등록되었습니다!</div>'
    });
  
  2> 지역 컴포넌트 등록
new Vue({
        components: {
  // 컴포넌트 이름 : 컴포넌트 내용
          'my-local-component': cmp
        }
});

4. 하위에서 상위 컴포넌트로 이벤트 전달하기
 1) 이벤트 발생 :
this.$emit('이벤트명');
 2) 이벤트 수신 :
<child-component v-on:show-log="printText"></child-component>
- show-log : 이벤트명
- printText : 상위 컴포넌트의 메소드명