Library-Framework/React23 [React] State와 Props 리액트의 State 리액트의 장점은 UI 내에서 데이터가 변경된 부분만 업데이트 해준다는 것이다. 리액트에 데이터를 저장시켜서 자동으로 리렌더링을 시킬 수 있다. state는 app 컴포넌트의 렌더링 결과물에 영향을 주는 데이터를 갖고 있는 객체로, 컴포넌트 안에서 관리된다. 이를 통해, 사용하는 쪽과 구현하는 쪽을 철저하게 분리시켜 편의성을 높일 수 있다. 동적인 데이터를 다룰 때 사용한다. 리액트로 데이터를 저장하려면 React.useState() 를 사용할 수 있으며 괄호 안에 초기값을 지정해줄 수 있다. const [] = React.useState() 저장된 데이터를 확인해보면, 배열의 형태로 저장된 것을 확인할 수 있다. [ data, modifier ] data : 저장되는 값 modifie.. 2022. 6. 30. [React] element 만들기, JSX 리액트는 요새 많이들 쓰는 프레임워크 중 하나이다. 페이스북이 사용자 UI 구축을 위해 만든 라이브러리이며, interactive한 웹사이트를 만들게 도와준다. - 상호작용이 많은 UI를 만들 때 생기는 어려움을 줄여줌 - 어플리케이션의 각 상태에 대한 간단한 뷰만 설계 - 데이터가 변경됨에 따라 적절한 컴포넌트만 효율적으로 갱신하고 렌더링함 - 선언형 뷰 : 코드를 예측 가능하고 디버그하기 쉽게 만들어줌 기술 스택의 나머지 부분에는 관여하지 않기 때문에, 기존 코드를 다시 작성하지 않고도 리액트의 기능을 이용해 개발 할 수 있다는 것 또한 장점인 것 같다. 리액트 시작하기 html 파일에 리액트를 설치하기 위한 코드를 넣어줘야 한다. 첫번째 줄은 리액트로, 어플리케이션이 interactive하도록 만들.. 2022. 6. 30. [React] 리액트 개발 환경 설치하기 (Window) 1. Node.js 설치하기 우선, https://github.com/coreybutler/nvm-windows/releases 에 접속하여 설치 파일(nvm-setup.zip)을 실행한다. 설치 후, Windows PowerShell을 관리자 권한으로 열어준다. 이래야 에러(exit status 1: ������ �źεǾ����ϴ�.)를 피할 수 있다. 설치한 Node.js를 사용할 수 있게 하는 명령어를 입력해준 후, 버전 확인. 2. yarn & create-react-app 설치하기 (윈도우 사용자) scoop을 설치해야 한다.. 아래 링크를 참고해서 설치하면 됩니당. scoop 설치하기 (윈도우 명령어 설치 프로그램) http://scoop.sh/ 아래의 설치 방법은 윈도우 10 기준이다. P.. 2022. 2. 24. 이전 1 ··· 3 4 5 6 다음