(코딩한 내용 중 일부) .stage를 가진 stageElem를 선언하고, 클릭했을 때 doorHandler라는 event를 발생. doorHandler event가 발생되면 타켓이 되는 targetElem 변수를 선언. 하지만 if문을 사용해서 이 event는 door-body 클래스를 가졌을 경우에만 작동하게 함. door-body를 가졌을 때 클릭한 것의 parentNode(부모 요소)에 door-opened 클래스가 추가되게 함
전역변수를 줄이는게 좋은 이유 = 협업을 할 경우 전역변수를 너도 나도 막 쓰다가 나중에 합치게 되면 겹치거나 하는 혼란이 올 수 있어서 줄일 수 있으면 줄이는게 좋다. body 태그 안에 있을시, 통째로 괄호로 감싸주고 바로 뒤에 ()로 호출해주면 전역변수가 아닌 상태로 쓸 수 있다. head 태그 안에 썼을 경우 window.addEventListener('load', function() { // 여기서 변수 선언 }); 이렇게도 할 수 있다.
1. import {useState} 2. useState(보관할 자료) 3. let [작명, 작명] (Destructuring 문법이다) Destructuring이란? let [name, age] = ['Kim', 20] 그럼 각각 name = 'Kim', age = 20 이라는 변수가 생성됩니다. 귀찮게 등호여러번 쓸 필요 없이 왼쪽 오른쪽 형식을 똑같이 맞춰주시면 자동으로 알아서 변수가 생성됩니다. 이게 변수만들 때 쓰는 destructuring 문법입니다. = state는 변동사항이 생기면 state쓰는 html도 자동으로 재렌더링해준다. function App(){ let [글제목, b] = useState('남자 코트 추천'); return ( { 글제목 } ) } 남자 코트 추천을 여자 코트..
1. 작업용 폴더를 생성 (그 전에 node js가 설치되어 있는지 확인) 2. shift + 우클릭해서 여기에 PowerShell 창 열기 클릭 3. 터미널이 열리면 npx create-react-app 프로젝트명 4. vscode에서 폴더 오픈 (다른방법) 만든 폴더를 vscode로 열고 터미널에 npx create-react-app ./ (현재폴더라는 뜻) 하면 설치 끝. 5. 터미널 열어서 npm start 입력
크롬, 엣지, 오페라에선 user-drag 앞에 -webkit-을 붙여줘야 작동한다. 사파리는 안붙여도 user-drag 지원. -webkit-user-drag: none; 웹 페이지에서 사용자가 이미지 드래그 하는 것을 방지할 수 있다
