개발 학습74 S1: useState와 Props로 자식onClick<=>부모상태 제어하기 Sidebar 컴포넌트 내부에 버튼1과 2가 있으며 해당 버튼을 누르면 Sidebar는 그대로 출력된 상태에서 다른 컴포넌트 2개가 연결된 버튼으로 나타나게 하려고한다. 1. 자식 컴포넌트인 Sidebar에서 버튼마다 oncClick 이벤트를 달아 버튼울 누를시 props의 한 객체 요소로써 test에 값을 담아 props로 보낸다. 2. 부모 컴포넌트인 App에서 Sidebar컴포넌트를 나타내고 태그안에서 test를 받아와 부모의 상태값과 상태값을 변화시킬 함수를 담은 useState에의 상태값을 변화시키는 함수에 연결시킨다. * 자식은 자신의 버튼을 클릭하여 부모의 상태(state)를 바꿀수 있게 됐다. * 자식은 자기상태가 필요없다! 자식이 뭘 클릭했는지에 따라 부모가 뭘 보여줄지 결정하니 부모가 .. 2021. 9. 14. S1: React 랜덤함수로 명언 출력하기 2021. 9. 13. S1: React 기초 / JSX규칙 / create-react-app JSX 규칙 1. 하나의 엘리먼트안에 모든 엘리먼트가 포함 ( div로 묶기 ) 2. 클래스선언시 className으로 선언 3. React 엘리먼트는 대문자로 작성해야한다. 4. 자바 스크립트 표현식은 중괄호 사용 (const value 선언등을 내부에서 쓸 때 { } ) 5. if문 대신 삼항연산자를 사용한다. 6. 컴포넌트 안에서 나오는 html 문법들은 ( ) 로 묶어준다. 객체를 JSX표현식으로 바꾸는법 create-react-app 빠른 react spa를 위한 여러 툴체인이다. 설치 : npx create-react-app "만들 폴더명" 2021. 9. 13. S1: obj[키값] / 스프레드 / deep복사 obj가 객체로 만들어져 있고 새로운 객체를 만들어낼때 obj[키값] 을 하게되면 키값과 일치하는 obj내부 key값으로 객체가 새로 만들어진다. obj["키값"] = 새 키값 배열 구조분해와 ...스프레드 얇은복사와 깊은복사 배열.concat(배열2) 기존 배열에 concat의 배열2 요소를 추가할 수있다. typeof typeof의 반환값은 '타입'으로 문자열로 표기된다. 2021. 9. 10. S1: 엘리먼트(El)과 DOM 엘리먼트 추가와 삭제 새로운 엘리먼트 생성 : document .createElement('div') 기존 엘리먼트에 추가 : presentEl .append(newEl) 클래스 추가 : presentEl .classList . add('클래스명') 추가했던 엘리먼트 삭제 : newEl. remove() 모든 자식 엘리먼트 삭제 : 1. document.querySelector('#div') .innerHTML= "" 2. removeChild() for문 / forEach * HTMLCollection과 NodeList은 유사배열이라서 배열의 메소드를 쓸수 없으므로 배열로 바꾼뒤 메소드를 쓸 수 있다. 2021. 9. 8. S1: Git fork : 상대방 remote repository에서 내 remote repository로 복사하는것 clone : 내 remote repository에서 내 local repository로 복사하는것 (fork한 초기버전으로) push : 내 local repository에서 내 remote repository로 복사하는것 ssh로 github연결하기 1. ssh-keygen으로 키페어(공개키,비밀키) 생성 2. cat ~/.ssh/id_rsa.pub으로 공개키 복사 3. github 웹 세팅 설정 Git 명령어 git restore [파일명] : clone했을때의 초기상태로 되돌린다. git add . : 모든파일 버전 관리 시작 git commit -m "버전 기록 메시지" : log에 commi.. 2021. 9. 5. 이전 1 ··· 9 10 11 12 13 다음
