리액트21 [리액트] React hook 간단하게 알아보기 참고) 한국어 버전 공식 문서이다. Hook의 개요 – React A JavaScript library for building user interfaces ko.reactjs.org 이는 단순히 리액트 hook을 공부한 지 얼마 안 된 나의 생각을 정리하고자 쓴 글이다. 틀린 부분이 있을 수도 있으니 항상 공부는 공식 문서로! React hook은 16.8 버전에 새로 추가되었다. 콘퍼런스 영상을 보니 한 2년 전이다. 우선 리액트 훅을 배운지 정말 얼마 안 되었지만 벌써 이렇게 좋아진 이유는 코드가 간단하다. (아주아주 심플해짐) class App extends React.Component에서 드디어 탈출이 가능하다. state는 간단히 useState를 사용하여 나타낼 수 있게 되었다. 말.. 2021. 1. 10. [리액트] 중괄호는 언제 사용하나요 For instance, because JSX is a syntactic extension of JavaScript, you can actually write JavaScript directly within JSX. To do this, you simply include the code you want to be treated as JavaScript within curly braces: { 'this is treated as JavaScript code' }. Keep this in mind, since it's used in several future challenges. 출처: freecodecamp.org JSX는 JavaScript + HTML이다. JSX에서 자바스크립트 코드는 {} (cu.. 2021. 1. 9. [리액트] 클래스형, 함수형 컴포넌트 차이 간단 정리 리액트 컴포넌트를 만드는 두가지 방식이 있다. - 클래스 컴포넌트와 함수 컴포넌트. 생김새 - 클래스 컴포넌트 class Welcome extends React.Component { render() { return Hello, {this.props.name}; } } - 함수 컴포넌트 function Welcome(props) { return Hello, {props.name}; } 함수형 컴포넌트가 클래스형보다 더 간단하다. 하지만 함수형이 클래스형보다 뒤늦게 나온거라 클래스형으로 작성 된 프로젝트가 많이 존재한다. -> 유지보수를 위해서 클래스 컴포넌트를 알아둬야 한다. 특징 - 클래스 컴포넌트 Component로부터 상속을 받아야한다. class 키워드가 필요하다. render()가 필수적이다. s.. 2021. 1. 8. 이전 1 2 3 4 다음