준준의 기록일지

라이프사이클 : 어떤 객체가 생성부터 파괴되는 시점 사이에서 자동으로 호출되는 메서드들의 집합 컴포넌트 생성과 DOM에 마운트 - 컴포넌트가 생성되고, DOM에 마운트(추가)될 때 다음과 같은 순서로 메서드가 호출된다. 이러한 과정은 딱 한번만 반복된다 constructor(props) : 객체가 생성될 때 componentWillMount() : 컴포넌트가 DOM에 마운트되기 직전 render() : 컴포넌트가 렌더링될 때 componentDidMount() : 컴포넌트가 DOM에 마운트된 직후. 컴포넌트 업데이트 - 컴포넌트의 프로퍼티가 변경되면 다음과 같은 메서드가 호출된다. componentWillReceiveProps(nextProps) : 컴포넌트의 프로퍼티가 변경될 때, 새로운 속성을 받았을..

자바스크립트가 주, html 부가 되는 형식의 코드로 시대가 변해가고 있다. toString(2) : 숫자에 toString(2)를 하면 이진수로 변환된다. 컴포넌트 함수 명시 : 대문자 ex) Card, Name 리액트에서 컴포넌트를 만들때 가장 중요한 부분 상태(state) : 화면에 출력하고 싶은 것. this.state = {} function일때와 화살표일때 this의 의미가 다른데, function일 경우 this 값이 undefined로 정의된다. 해결방안 -> function (){}.bind(this)와 같이 정의한다. 화살표일 경우 this 값이 변하지 않고 잘 가져오므로 걱정할 필요 없다.

ExtJS에서는 각각 아래와 같이 변수를 comonent화해서 사용할 수 있다. 1 2 3 4 5 6 7 8 9 var panel=Ext.create("Ext.Panel", { id:'errorPage', height:400, width:800, html:'Hello Ext Js', text:'abcde', renderTo:document.body, hidden:true }); Colored by Color Scripter cs 해당 컴포넌트를 사용하기 위해서는 내부에 id값을 명시하고 var errorPage=Ext.getComp("errorPage") 로 가져와서 사용할 수 있따. 객체 조회 참고 사이트 m.blog.naver.com/PostView.nhn?blogId=h9911120&logNo=50..

잘 설명된 props, state 블로그 trustyoo86.github.io/react/2017/11/18/props-state-react.html kern의 FE-Note kern의 Front-end 개발 노트입니다. trustyoo86.github.io props, state의 차이점을 통해 state를 알아보자. props : 사용자가 컴포넌트를 사용하는 입장에서 중요 -> 사용자가 컴포넌트를 조작할 수 있게 한다. (외부) state : props의 값에 따라 내부 구현에 필요한 데이터. -> 사용자가 알 필요 없는 부분. (내부) 두 부분 외부, 내부를 철저하게 분리하는 것이 중요하다. state는 컴포넌트가 다양한 일들을 할 수 있게 만든다. props에 하드코딩 된 값을 state로 만들고..