GO CAN DO IT

ApplicationContext는 Bean Factory의 역할 + Spring의 여러가지 기능들을 담당하고 있다. 이 ApplicationContext는 다음과 같은 인터페이스들을 상속받고 있는데 ApplicationEventPublisher EnvironmentCapable HierarchicalBeanFactory ListableBeanFactory MessageSource ResourceLoader ResourcePatternResolver 이들 중 가장 먼저 살펴볼 것은, EnvionmentCapable 인터페이스이다. 이 Environment가 제공하는 기능은 크게 프로파일과 프로퍼티로 나눌 수 있는데, 먼저 프로파일에 대해 알아보자. 1. 프로파일 인터페이스 이 프로파일은 개발/ 운영서버가..

Bean의 Scope는 기본적으로 싱글톤이다. 프로그램 구동시 Bean의 인스턴스는 오직 하나라는 뜻이다. Bean이 가질수 있는 Scope 는 싱글톤 외에 매번 인스턴스를 새로 생성하는 ProtoType 도 있다. 만약, 프로토 타입 빈이 싱글톤 빈을 참조하면 어떻게 될까? 매번 프로토타입의 빈은 새로운 인스턴스로 생성되고, 그 인스턴스들이 바라보는 싱글톤 빈은 동일한 인스턴스일 것이다. 이럴 때는 아무런 문제가 되지 않는다. 그렇다면, 싱글톤 빈이 프로토 타입 빈을 참조하면 어떻게 될까? 싱글톤이 생성 된 이후에 프로토타입 빈이 변경이 되어도 해당 내용이 업데이트가 되지 않는다. 이를 업데이트하려면 Scoped-proxy값을 설정해주거나, 참조시 참조 객체를 Object-Provider 리스트로 감싸..

여기 BookRepository 객체와, BookRepository 객체를 사용하는 BookService 객체가 있다고 가정해보자. 그리고 이 BookService 객체에서 BookRepository 객체를 주입받아야 하는 상황에서 BookService는 Bean으로 등록을 해주고, BookRepository 는 Bean으로 등록을 하지 않았다고 해보자. // #1. BookService @Service public class BookService { BookRepository bookrepository; @Autowired public void BookService(BookRepository bookRepository){ this.bookRepository = bookRepository; } } // ..

#스프링 IoC 토비의 스프링에서 먼저 공부한 스프링 IoC에 대해 다시 한번 리마인드를 해보자. First, IoC stands for Inversion Of Control 즉 제어의 역전이라는 뜻이다. 스프링 프레임워크 안에서의 객체들은 자신들이 사용할 객체들을 스스로 생성하지도 않고, 자기 자신들도 어디서 사용되는지 알 수가 없다. 오브젝트들의 생성과 책임에 대한 제어가 오브젝트 스스로에게 있지 않고, 이 권한을 위임한 다른 특별한 오브젝트에게 있다! 오브젝트의 입장에서는 그 특별한 오브젝트로부터 생성과 책임에 대해 제어를 받으니 control의 방향이 inversed 된 것이다. 그리고 이러한 IoC방식에서 말하는 특별한 Object를 Application Context, 제어권이 없는 오브젝트들..

이번에는 $ vue create vue-form $ cd vue-form $ npm run serve 명령어를 통해 vue-form 패키지를 만들고 작업을 해주었다. 새로 작성한 App.vue 소스는 다음과 같다. // App.vue id: pw: login 여기서 추가적으로 event.preventDefault() 는 기본적으로 과거 자바스크립트에서 사용되었던 문법이고, Vue에서는 form 태그의 submit 속성값으로 prevent를 넣어줄 수 있다. // event.preventDefault()를 주석처리 submitForm : function () { //event.preventDefault(); console.log('username' + this.username); console.log('p..

App.vue 파일을 활용해서 한번 화면에 데이터를 뿌려보도록 하자. 기존에 html 소스 안에서 뷰 인스턴스를 생성했던 방법과는 아주 조금 다르다. 코드를 통해 알아보자 {{str}} #1. 싱글 파일 컴포넌트에서 html 을 선언할 때는, 가장 상위에 div 태그를 하나 선언하고 , 그 안에 header던, body던 생성을 해줘야 한다. #2. 기존에 html 파일에서 뷰 인스턴스 객체를 선언하고 주입해주었던 방식 #3. 싱글파일 컴포넌트에서는 이런식으로 변수를 선언해주면 안되고 #4. 방식으로 선언을 해주어야 한다. 그 이유는, 여러 객체들의 재사용성을 높이기 위함으로 변수를 함수형으로 선언하고 , 해당 값을 리턴해주는 형태로 사용한다. #싱글파일 컴포넌트 체계에서 컴포넌트 등록하기 컴포넌트를 등..

Vue CLI 를 사용하기 위해서 https://cli.vuejs.org/guide/installation.html 에 접속해서 명령어를 확인하고, 비주얼 스튜디오 코드에서 터미널을 열어 해당 명령어들을 실행해준다. npm install -g @vue/cli # OR yarn global add @vue/cli 뷰 버전이 4가 넘어가면 defaule( ver2) 로 설정해주어야 한다. 🎉 Successfully created project vue-cli. 👉 Get started with the following commands: $ cd vue-cli $ npm run serve gayoung@yungayeong-ui-MacBookAir learn-vue-js-master % cd vue-cli gay..

watch는 뷰 인스턴스의 어떤 데이터가 변경되면 이를 감지해주는 기능이다. 뷰 인스턴스 내 watch를 선언하고 어떤 변수를 watch 할 것인지, 어떤 행위를 할 것인지 정해주면 된다. 코드로 알아보자. {{num}} increase 이 코드는 아래와 같이 실행된다. 버튼이 눌릴 때마다 num값이 증가하고, num값의 변화를 watch가 감지하고 있다가 콘솔로그를 출력한다. computed 와 watch 둘 다 특정 데이터가 변경되면 실행되는 속성이라는 점은 같지만, 뷰 공식문서에서는 watch보다 computed를 사용할 것 을 권장하고 있다. 캐싱이나 튜닝이 더 잘되어 있기 때문이다. Vue does provide a more generic way to observe and react to dat..

뷰에서 데이터를 화면에 표시하는 방법은 두가지가 있다. 데이터 바인딩과 디렉티브! 코드로 알아보자. {{num}} {{doubleNum}} //# 3. 클래스 바인딩 v-if Loading.. test user has been logged in Loading..2 #1. bind 방식 : {{}} 태그 안에 변수 주입을 통해 데이터를 표현하는 방법 #2. 디렉티브 방식 : v-bind: Api를 활용하여 id값에 뷰 인스턴스의 데이터 변수값을 주입하는 방식. : v-bind:class , v-bind:id 등 속성값들을 인스턴스의 변수를 통해 관리할 수 있다. #3. 클래스 바인딩 : 뷰 인스턴스의 변수값에 조건을 부여하여 속성들을 관리하는 방식. if 와 show 의 차이점은 - if : 조건에 해당하..

#axios란 axios란 , ajax처럼 비동기 애플리케이션 개발을 위한 HTTP 통신 라이브러리이다. 과거 Vue 커뮤니티에서 공식적으로 쓰이고 있던 Vue Resource를 대신하여 현재 가장 널리쓰이고 있는 라이브러리이다. https://github.com/axios/axios GitHub - axios/axios: Promise based HTTP client for the browser and node.js Promise based HTTP client for the browser and node.js - GitHub - axios/axios: Promise based HTTP client for the browser and node.js github.com 여기에 들어가면 해당 라이브러리를 ..