함수 컴포넌트

React - 함수 컴포넌트 & useState

이번 포스팅에서는 함수 컴포넌트에 대한 개념에 대해 알아보고 이를 이용해 Counter 버튼을 만들어 보고자 한다. 우선 VSCode 터미널에서 npx create-react-app을 이용해 React app을 설치해주도록 하자. 그 후 npm run start를 이용해 React app을 실행시켜 제대로 설치가 되었는지 확인해보면 된다. npx create-react-app [디렉토리명] npm run start 함수 컴포넌트 props & children useState를 이용해 카운터 만들기 1. 함수 컴포넌트 함수 컴포넌트는 기존에 사용했던 클래스 컴포넌트와 다르게 함수를 이용해서 component를 생성한다. JavaScript에서 함수를 만들던 방식 그대로 함수를 만들어서 comp..

React 기본 개념

React란? React & ReactDOM Component 클래스형 Component 함수형 Component 1. React란? React 공식 홈페이지에서는 React를 다음과 같이 정의하고 있다. "사용자 인터페이스를 만들기 위한 JavaScript 라이브러리" 말 뜻 그대로 React는 JavaScript 라이브러리 혹은 웹 프레임워크라고 생각하면 된다. (라이브러리 보다는 프레임워크에 가깝다고 생각한다.) 라이브러리와 프레임워크의 차이를 간략히 기술하자면 폴더 구조가 없는 형태를 라이브러리, 폴더 구조가 있는 형태를 프레임워크라고 볼 수 있다. 따라서 프레임워크를 사용할 때는 특정 디렉토리 안에서 작업을 해줘야만 하는 특성이 있다. React는 Facebook에서 제공해주는 오픈..