Vault HashCorp 에서 만든 오픈소스 프로젝트다. 깃허브 상에 존재하는 ID / Password 를 저장하는 방식은 보안적으로 취약하다. 따라서 이 정보를 vault 서버에 저장해놓는다. 어플리케이션 시작시 vault 서버에서 가져와 ID / Password를 사용한다. 높은 확장성, 더불어 Spring Vault 라고 오픈소스 프로젝트로 Vault 를 간단히 사용할 수 있는 모듈이 존재한다. Secret 가장 간단하게 사용자가 요청한 값을 key-value 로 저장할 수 있는 데이터 secret/mydbs/mysql username hello password world ... vault: uri: vault 도메인 token: vault 토큰 path: mysql: secret/mydbs/my..

AuthenticationFilter 의 결과로 Security context 가 채워진다. 사용자의 Request 가 들어오면 해당 요청을 처리하기 위해 어떤 필터를 사용할지 불러온다. WebSecurityConfigurerAdapter 를 작성하는 과정은 어떤 필터들을 사용해야 하는지 지정하는 과정과 같다. @Configuration @EnableWebSecurity public class SecurityConfig extends WebSecurityConfigurerAdapter { @Override protected void configure(HttpSecurity http) throws Exception { http.authorizeRequests() .mvcMatchers("/account/*..

userCallback userCallback 은 불필요한 렌더링을 막을 수 있으므로 하위 컴포넌트의 참조 함수로 사용되는 경우 습관적으로 사용하는 것이 좋다. contextAPI - createContext createContext 로 context 를 생성한다. export const MyContext = createContext({ myData : [], dispatch: () => {} }); 이렇게 한번 Context 로 등록해놓으면 이후에 다른곳에서 import + useContext 로 사용할 수 있다. context 에 dispatch 를 넣어두면 다른곳에서 해당 context 를 불러와서 dispatch 를 할 수 있다. contextAPI - Provider render 에서 컴포넌트를..

일단 Component 로 만들고 불필요한 렌더링이 된다면 PureComponent 로 전환 하는 방식을 이용하자 일반적으로 제일 마지막에 있는 컴포넌트는 PureComponent 일 확률이 높다. 라이프사이클 생성시 라이프 사이클 : constructor -> render -> ref 설정해주는 메소드 -> componentDidMount 리렌더링 라이프 사이클 : shouldComponentUpdate -> render -> componentDidUpdate 소멸시 라이프 사이클 : componentWillUnmount -> 소멸 이외의 라이프 사이클은 deprecated 될 예정이므로 사용하지 않는 것이 좋다. componentDidMount 렌더링이 처음 시도되고 정상적으로 렌더링이 성공했다면 단..

import require : node 의 모듈시스템 import 와 require 는 호환이 되긴한다. import 를 쓰면 babel 이 require 로 변환해준다. export 엄밀히 따지면 export defaut 와 module.export 는 다르다. export 되는게 객체나 배열이면 구조분해하여 import 할 수 있다. export 는 여러개 올수 있으나 export default 는 단 한번만 나올 수 있다. defaultValue value 와 onChange 는 같이 써야된다. 두 조합을 쓰기 싫다면 defaultValue 를 써야한다. map {["A", "B", "C", "D"].map((alphabet) => { return ( {alphabet} ); })} 배열에서 사용할..

다음 강의 내용을 기반으로 정리하고 있습니다. 강의 동영상 강의 깃허브 JSX JSX 가 없는 경우 원래는 아래와 같이 써야한다. 바벨은 자바스크립트의 최신 문법과 JSX 를 사용할 수 있게 도와주는 도구다. const reactElement = React.createElement; render() { reactElement(...); } 태그안에 함수를 직접 입력할 경우 함수가 매번 생기게된다. 가능한 JSX 안의 함수는 클래스안의 메소드로 분리하는 것이 좋다. 프래그먼트 JSX 에서의 렌더의 최상위 컴포넌트는 반드시 하나만 존재해야한다. 일반적으로 ~~ 로 감싸지게 되는데 불필요한 div 태그가 HTML 에 생기므로 불필요한 div 를 원치 않는다면 아래와 같이 빈 태그() 나 프래그먼트() 를사용할..