React

🌀 터밀에서 해당 디렉토리로 이동👉 터미널에 > create-react-app .을 친다.👉 작업이 다 끝나면 해당 디렉토리에 필요한 파일들이 생겨난 것을 확인할 수 있다.👉 해당 디렉토리를 에디터에서 연다.👉 Vs Code 터미널에서 npm start를 입력

👉 react는 페이스북에서 만든 javascript의 UI 라이브러리다. 리엑트는 컴포넌트의 가독성, 재사용성을 높여주고 우지보수를 쉽게 만들어준다. ✅ 여기서 잠깐!! 라이브러리란 ??✏️ 라이브러리는 제이쿼리와 같이 재사용이 필요한 반복적인 코드 작성을 없애기

🌈 State와 Evnet에 대해서,,, 🌀 State 👉 state : 상태 👉 컴포넌트 내부에서 가지고 있는 컴포넌트의 상태 값 👉 화면에 보여줄 컴포넌트의 UI정보를 지니고 있는 객체 👉 컴포넌트 내에서 정의하고 사용하면 얼마든지 데이터(객체)가 변경

🌀처음 작성했던 코드

🌈 React에서 이미지슬라이드 기능 구현 🌀React slide 👉 React로 '홀라' 프로젝트 진행 중 내가 맡은 기능 구현은 '메인 슬라이더'였다. 처음 슬라이드 기능을 구현할 때 정말 감이 아예 안왔다.... 물어도 보고 구글링도 해보고 혼자 생각도 해보았다. class형 component에서 슬라이드 기능 구현을 찾는게 생각보다 쉽지는 ...

리액트 슬라이드 라이브러리📝 SimpleSlider 사용법공식 사이트 👉 https://react-slick.neostack.com/👉 기본 설치와 슬라이더의 css작업을 위한 npm 두가지 모두 설치해야한다. ✅ 슬라이더의 기본 형태는 공식문서에 들어

🚨 Styled-components에 대해서 알아보자,,,,자동 중요 Css : styled-components는 페이지에서 렌더링되는 구성 요소를 추적하고 완전히 자동으로 해당 스타일만 삽입합니다. 코드 분할과 함께 이는 사용자가 필요한 최소한의 코드를 로드함을 의

검증 추가 및 로직 재설정하기enteredAge앞에 + 를 붙임으로서 숫자인지 확실하게 확인할 수 있게 해준다. useEffect 훅 사용하기 유저가 인증된 상태라면 이 페이지를 리로드 하더라도 유지되어야 한다.  그러나 현재 상태에서 새로고침 시에 인증 상태가 사라

🚨  오늘은 ref에 대해서 공부하기,,,,=  ref는 상당히 강력한 아이다. 👉  기본 상태에서의 ref는 다른 DOM요소로 엑세스해서 작업할 수 있게 해주는 역할이다. 예시) 여기 보이는 코드들 중에서 위와 같이 input 태그에서 유저가 입력하는 바를 추적해

setTimeout => builtin 메서드클린업 함수 (익명의 함수 리턴) return () => {}useEffect 함수가 작동할 때마다, 작동하기 전에, 돌아가는 아주 첫 번째를 제외하고는 클린업 함수가 돌아간다.클린업함수 작동 -> 돔에서부터 특정한 컴포넌트

또 다른 빌트인 훅상태 관리를 도와준다.useState와 비슷하지만, 능력이 더 많고 더 복잡한 상태일 때 유용하다.  👉  복잡한 multiple 상태일 대 useState를 사용하고 관리할 때 에러를 일으킨다, 이건 안좋은 상황이거나 효율적이지 않거나 잠재적인

✓ 기존에는 props를 데이터를 전달받고props.명 이렇게 작성했다.✓ 클론을 이용하는 방법이다.: 을 사용하고 원하는 변수명을 작성하면 된다.