React

ES6의 문법을 ES5로 변환해주는 역할ES6 문법을 아직 지원하지 않는 브라우저의 호환성을 위해 사용react 파일은 컴포넌트를 담당하고,react-dom 파일은 실제 DOM의 렌더링을 담당한다. \-> 실제 페이지에 jsx형태의 코드를 렌더링 할 때 사용리액트 15

컴포넌트 내부의 immutable data(변하지 않는 데이터)를 처리할 때 사용JSX 내부에 {this.props.프로퍼티이름} 으로 작성컴포넌트의 속성에서 <Component 프로퍼티이름="값" /> 로 값 전달this.props.children은 기본 pro

컴포넌트에서 유동적인 데이터를 처리할 때 사용초기값 설정이 필수 -> 생성자 내부에서 this.state = {state이름: 값} 으로 설정JSX 내부에서 {this.state.state이름} 값을 수정할 때는 setState({state이름: 값})으로 변경, co

project로 개별 평가를 하는데 뭐라도 참여하고 싶어서할줄 모르는데 그냥 할 수 있다고 해버렸다..스타일 컴포넌트는 CSS스타일을 가진 컴포넌트를 생성하는 것 같다스타일을 가진 컴포넌트를 바로 생성 -> 네이밍이 겹쳐서 혼란을 겪는 문제가 없다.className을

리액트는 맵핑 시 자바스크립트 문법을 그대로 사용할 수 있다.map() 메소드는 파라미터로 전달 된 함수를 배열의 각 요소에 처리 후, 결과를 새로운 배열로 return 한다.Arr.map(callback, \[thisArg])1\. callback: 새로운 배열의 요

Node Package Manager: 자바스크립트 패키지 관리 모듈 \- hpmjs.xom에서 node_modules 폴더에 라이브러리를 받고 package.json에 명세하여 관리해줌npx: npm에서 제공하는 실행 도구 (node.js기반 파일들의 설치와 실행을

프레임워크는 이미 짜여진 틀(frame)이 있고,그 안에 원하는 기능을 채워 넣어 프로그램을 완성한다.틀 밖으로 확장하거나 다른 프레임워크/라이브러리를 함께 사용하기 어렵다. (충돌 위험)상대적으로 무겁다 (사용하지 않는 것도 이미 구현되어 있기 때문)정해진 틀이 없어

온라인 플레이 그라운드 \-> 웹 환경에서 리액트 개발웹사이트에 react 추가 \-> 웹사이트에 부분적으로 추가 (어려움)새 react 앱 만들기 \-> toolchains 사용 (개발 도구 모음) 파일과 컴포넌트 스케일링서드파티 npm 라이브러리 사용실수를

벨로퍼트님의 리액트 네이티브를 다루는 기술 이라는 책을 보며react native 스터디를 하던중에async storage 를 다루는 예제가 나왔다useEffect 와 함께 사용하여첫 렌더링 시에는 async storage 에서 데이터를 get 해오고첫 렌더링 + 데이

@react-native-community/datetimepicker 는 딱히 react-native-modal-datetime-picker 를 안써도 꽤나 괜찮은 것 같다 쓰면 아래 모달을 쉽게 구현할 수 있다는 점이 좋음.. mode: 'date' 면 날짜 'ti

함수 컴포넌트는 React Hooks 를 사용하여 상태 관리와 라이프사이클 이벤트 처리 등을 보다 간결하게 처리할 수 있다또한 함수 컴포넌트는 순수 자바스크립트 함수로 작성되기 때문에코드가 간결하고 이해하기 쉽다간결한 문법: 화살표 함수는 function 키워드를 사용

상태를 동기적으로 업데이트 할 수 있는 기능이 생겼다물론 비동기적으로 배치처리 하는 것이 효율적일 수 있지만코드를 작성하다 보면 동기적인 상태가 필요하다flushSync 의 콜백함수에 동기적으로 업데이트할 setState 를 주면 된다

jsx 에서는 기본적으로 개행 문자나 태그 모두 문자열로 출력한다css 설정으로 개행문자(\\n) 를 사용할 수 있다