React

- ## react 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리 UI를 만들기위한 라이브러리 자바스크립트는 직관적이지만 너무 길다 JS와 HTML이 가진 분리감 →JS+XML →JSX 리렌더링이 잦은

리액트로 만들어진 어플리케이션을 이루는 최소 단위\-코드를 묶어서 태그화 (사용자 정의 태그)\-앞글자 대문자로 생성 => 기존 HTML 태그와 구분\-export(내보기) +import(불러오기) 보통 자동으로 된다. 자동완성 해주기환경설정Extention 확장 도구

들어가기 전 check! state는 상태가 변할 수 있는 수 ->변수 -DOM 장서영 document.getElementById.innerText = ‘정호준’ ~>값을 바꾸는 행위 + 화면을 바꾸는 행위 -JSX 값만 바꿔서는 화면이 바뀌지 않는 것 ~>state

map 함수 배열함수(자바스크립트) : 배열을 사용할 때 편하게 쓰기 위해 만든 함수 push() :배열의 맨 끝에 새로운 값을 쌓는 함수 pop() :배열의 맨 끝에 있는 데이터 삭제 하는 함수 map() :배열 안에서 내가 원하는 규칙에 따라서 새로운 배열을 생성

useRef -특정 요소를 선택해서 그 요소에 변화를 주고 싶을 때, 바닐라 script에서는 getElementById, querySelector.. 등의 문법을 사용했다 -React 에서도 특정 요소에 접근해야할 일이 종종 발생함 ex) 특정 input에만 focu

context :리액트 컴포넌트 간에 값을 전역적으로 공유할 수 있게 해주는 기능 Q.우리에게는 데이터를 주고받는 props가 있는데 왜 context를 써야하는가? A. props로만 데이터를 전달하면 깊숙하게 위치한 컴포넌트에 데이터를 전달하는 경우 여

TodoList -MiniGame - TodoList(state, map, context개념) 배열을 map을 이용해서 추가 해보자~ add를 누르면 Todo List에 추가 Delete를 누르면 삭제 → context이용하는게 편할 듯~ -스프레드 문법 key

useEffect에 대해 설명하기 전 이때까지 사용한객체지향(OOP) 함수형 프로그래밍에대해 알아보자 >함수형 프로그래밍 → 토끼가 하는 일이 각각의 함수 우리는 이미 React에서 rafce를 통해 함수형 프로그래밍을 하고있었음 그럼 React는 함수형 프로그

여기서 잠깐!!콜백함수 (함수 안에 함수)이런 콜백 지옥이 생기게 됨그래서 promise 새로 생김promiseasync await너 잠깐만 비동기 할건데 잠깐 기다려!!movieList배열을 통해 화면에 영화표 출력해보기https://kobis.or.kr/k

1)react router 설치 npm i react-router-dom2) router를 사용할 수 있는 환경 세팅 \- router 기능을 사용하고 싶으면, 그 사용하고 싶은 범위를 BrowserRouter 라는 컴포넌트로 감싸주어야한다

라우트 실습1 상품 목록페이지에서 상품을 누르면 상품 상세 정보 페이지 메인 창 상품목록 페이지 상품을 누르면 상품 상세 페이지가 뜸 App.js ProductList에 list와 setList값, ProductDetail에는 list값 넘겨주기 Heade

리액트로 카카오맵 띄우기 kakao developers 로그인 내 애플리케이션 해당 애플리케이션 클릭 후 JavaScript 키 복사 그리고 사이트 도메인 localhost로 보내주기 리액트 카카오맵 사이트? https://react-kakao-maps-sdk.