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