반응형 웹개발80 [2020.11.29] 11월 넷째주 회고록 이번 한 주는 내내 리액트에 대해서 공부했다. 리액트로 간단한 웹 사이트를 만들어보고 리액트 관련된 블로깅을 하면서 복습을 하는 시간을 가졌다. 확실히 블로깅을 해보니 복습도 잘되고 다른 사람에게 설명해주는 느낌이라 집중도 잘되었다. 그러나 조금 게으른 한 주가 아니었나 싶다. 일찍 일어나기로 했던 약속은 결국 지키지 못하였고.. 주말마다 알고리즘 문제를 풀자고 했던 목표도 지키지 못했다.. 그래도 12월이 되면 조금 여유로워지니 알고리즘 공부를 그때 넣어야겠다. 이제 곧 프로젝트에 들어간다. 프로젝트에 누가 되지 않도록 공부를 더 열심히 해야겠다. 또한 일찍 일어나는 습관도 꼭 들여야겠다. 한 해도 벌써 끝나가는데 마무리를 잘 할 수 있었으면 좋겠다. 다음 주는 DB에 대해서 공부하는 한 주가 될 것 .. 2020. 11. 29. Lifecycle 생명주기 이번에는 컴포넌트의 Lifecycle(생명주기)에 대해서 공부했다. 컴포넌트가 렌더링 될 때 몇 가지 상태 변화가 있는데 크게 몇 가지로 나눌 수 있다. 생성될 때 화면에 등장한(mount)후 새로운 props를 받을 때 새로운 상태를 가질 때 새로운 상태를 갖고 난 후 화면에서 사라지기(unmount) 전 이러한 상태 변화들은 생명 주기에 따라 나눌 수 있다. 이전 글의 Toggle 클래스를 불러와 이러한 생명주기를 적용해보면 import React from "react"; import "./styles.css"; function App (){ return ( ); } class Toggle extends React.Component { constructor(props){ super(props) thi.. 2020. 11. 27. this.state와 this.setState 이번에는 클래스형 컴포넌트에서 쓸 수 있는 this.state와 this.setState에 대해서 알아보겠다. state 객체는 내부에서 변화하는 값을 저장하는 하나의 공간이라고 생각하면 되는데 외부로 데이터를 전달해주기 위한(외부로부터 데이터를 전달받기 위한) props 객체와는 조금 차이가 있다. state를 사용하기 위해서는 클래스형 컴포넌트의 생성자에서 정의해줘야 하는데 간단한 사용방법을 예제를 통해 알아보고자 한다. import React from "react"; import "./styles.css"; function App (){ return ( ); } class Toggle extends React.Component { constructor(props){ super(props) this... 2020. 11. 27. Component(컴포넌트)와 Props 이전 React 글에 이어 오늘은 Component와 Props에 대해서 복습을 해볼까 한다. 리액트 공식문서를 좀 참고했다 ! import React from "react"; import "./styles.css"; function App() { return ( Hello World ); } export default App 이것은 함수형으로 작성된 컴포넌트이다. 이렇게 함수형으로 작성된 컴포넌트는 클래스형 컴포넌트로 바꿀 수 있는데 React.Component를 상속받아서 만들면 된다. import React from "react"; import "./styles.css"; class App extends React.Component { render(){ return ( Hello World ); }.. 2020. 11. 27. 이전 1 ··· 4 5 6 7 8 9 10 ··· 20 다음 반응형
