개발자

이 프로젝트는 Spring Mybatis Oracle 로 진행했던 프로젝트를 SpringBoot JPA MySQL을 이용한 프로젝트로 리팩토링하기 위한 프로젝트이다. SpringBoot와 MySQL 연동, JPA를 사용하기 위한 준비 build.gradle 에 추가해 주어야 하는 항목들이다. implementation 'org.springframework.boot:spring-boot-starter-data-jpa' 첫번째 설정은 jpa를 사용하기 위해 필요한 라이브러리를 다운받는 dependeny이다. implementation group: 'mysql', name: 'mysql-connector-java', version: '8.0.32' 두번째 설절을 살펴보자, 위 설정은 mysql 의존성을 주입해..

최종 구현 페이지 결과 돌렸을때 첫번 째 컴포넌트에서 더하기,빼기를 이용해 입력한 result 값이 / 두번째 component 로넘어가고 마지막 component 에는 [두번재 컴포넌트 성공] 값과 result 값이 "6"이 최종적으로 넘어가게 된다. 마지막 component에서 computed를 이용해 5이상이면 색깔이 바뀌는 로직까지 구현해봤다. 코드를 보면서 복습해보자 data 함수에 result 변수를 선언해주어야 한다. data object 타입이 아닌 function 타입으로 선언한 이유는 여러 컴포넌트에서 컴포넌트 A를 호출 한 경우, A 컴포넌트의 변수 값이 호출한 컴포넌트들에 의해 변경되는 상황을 예방하기 위한 것이다. 선언된 변수는 {{ result}} 를 통해 화면에 그려지게 된다...

이벤트 버블링이란? 클릭한 DOM과 겹쳐있는 부모나,자식 DOM까지 같이 선택이 되어서 이벤트가 발생 하는 것을이벤트 전파 현상이라 함 버블링은 자신을 포함해 부모의 이벤트 까지 발생시키는 것 캡처링은 반대로 자신을 포함해 자식의 이벤트 까지 발생시키는 것 이벤트 버블링은 특정 화면 요소에서 이벤트가 발생했을 때 해당 이벤트가 더 상위의 화면 요소들로 전달되어 가는 특성을 의미합니다. HTML요소는 트리 형식이죠? 그렇다면 그 랜딩페이지에서 가 최상위 요소가 됩니다. 그 밑으로 자식 요소들이 있죠. 브라우저는 이벤트를 하위 컴포넌트에서 상위 컴포넌트로 전파시키는 방식을 가집니다. 이 것을 ' 이벤트 버블링' 이라고 합니다. 우리는 이 이벤트버블링과 캡처링등을 통해 이벤트 위임을 할 수 있습니다. 이 이벤..

components 로 시작 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 출력될 문구 1 {{ message2 }} {{ msg }} export default { name: 'childGo', data() { return { message2 : "출력될 문구2(child에서 data로 바인딩)" //message2 데이터 바인딩 } }, props: { msg: String //pros 으로 부모에게 보내준다 (String,object 같은 형식 쓰기) } } Colored by Color Scripter cs props 로 부모에게서 데이터 받는다(String,object 같은..

v-bind(디렉티브) html의 속성인 id,class,style 등에 대해 model 의 데이터를 연결할 때 사용, 보통 엘리먼트의 상태값을 바꿔줄 때 사용한다. . 예시 1 :title 이용 v-bind를 이용해 마우스를 몇초동안 올리고 있으면 v-bind에 의해 message가 출력된다. v-bind:[attribute]=" " 라는 디렉티브는 Vue.js를 통해 html 속성 값을 자바 스크립트에서 동적으로 바인딩 한다. 예시 2 App.feel 값에 따라 동적으로 데이터를 바인딩 할 수 도 있다. 아래의 코드에서 html부분에 조건을 주고 js부분에서 데이터를 값에 따라 바인딩 될 수 있도록 넣어준다. V-bind를 이용하면 이렇게 엘리먼트 속성을 동적으로 바꿔줄 수 있다. 아래 코드의 결과는..

Vue 란? - 사용자 인터페이슬 만들기 위한 동적 javascript 프레임 워크로, 프런트앤드 개발을 쉽게 하기 위한 오픈 소스 프레임 워크이다. - Vue 라이브러리의 기초는 HTML,CSS 및 JS 이다. - Vue의 핵심 라이브러리는 양방향 데이터 바인딩을 사용하여 프로토타입과 뷰 구성 요소 간의 동적 조정을 가능하게 하는 뷰 모델 구성요소에 의존한다. - MVVM(Model- View – ViewModel) 패턴의 ViewModel로, UI 코드와 데이터 제어 로 직을 분리하기 위해 설계된 패턴이다. 웹페이지는 돔과 자바스크립트로 만들어 지게 된다. 뷰 모 델이 없는 경우 직접 모델과 뷰를 연결해야 하는데, 뷰 모델을 중간에서 연결해 주는 것이 MVVM 이다. MVVM 패턴이란? View(ht..

공식 문서에 나와있는 사용법 data를 함수로 사용 ( vue 정리 한것과 비교해보기) 처음 값은 카운트:0 에서 시작, 클릭하면 카운트값이 1씩 증가 어플리케이션 생성 모든 Vue 애플리케이션은 다음 함수를 사용하여 새 애플리케이션 인스턴스를 생성 하여 시작합니다 1 2 3 4 5 6 import {createApp} from 'vue' const app = creatApp({ /* root component options */ }) cs -기존에 new Vue() 생성자 함수를 사용하는 대신 vreateApp() 함수를 사용한다 createApp(app).mount(#app); 여러 속성을 동적으로 바인딩 1 2 3 4 5 6 7 8 9 date () { return { objectOfAttrs : ..

Log(로그), Logging(로깅) 로그란, 애플리케이션(또는 운영체제)이 발생하는 다양한 이벤트에 대한 기록을 뜻한다. 기록하는 행위를 Logging(로깅) 이라고 한다. (Logging의 대상 : 콘솔,파일,데이터베이스 등) 1. 로깅을 하는 이유 - 애플리케이션의 문제 발생시, 원인 분석을 위한 정보로 활용하기 위함 - 애플리케이션의 성능 분석 -에플리케이션 사용자들에 대한 분석 및 통계 System.out.println()은 안되는 걸까? system.out을 처리하는 동안 다른 쓰레드가 block이 걸리게 되고, 이러한 현상이 많아진다면 성능저하의 원인이 될 수도 있다. 따라서 로그를 남기는 적절한 방식이 아니다. 2.로깅을 위한 로킹프레임 워크 - logbak : log4j를 더 발전 시킨 ..

Bean (빈) 스프링 컨테이너가 관리하는 자바 객체를 빈(Bean)이라 한다. 자바에서 객체를 생성할 때 주로 new를 통해 생성하는데, 이 객체를 의미하는 것이 아니라 컨테이너에서 스스로 생성하고 관리하는 객체를 의미한다. 컨테이너에서의 관리를 통해 객체를 여러번 생성할 필요가 없고, 공용으로 사용할 수 있다. Annotation Annotation은 Java 5부터 추가된 문법 요소로, 코드 사이에 주석처럼 쓰이며 특별한 의미, 기능을 수행하도록 하는 기술입니다. 실제 데이터가 아닌 데이터를 위한 데이터로 메타데이터 (meta data)로 불립니다. @Bean : @bean 어노테이션은 개발자가 직접 제어가 불가능한 외부 라이브러리등을 bean으로 만들때 사용된다 @ComponentScan: @Co..