npm 설치 오류 firebase설치 시 제대로 설치되지 않는 현상을 발견했다. 터미널에 에러메시지는 딱히 뜨지 않았으나 사용할 수 없음은 물론 package.json에도 firebase가 보이지 않았다. 검색해본 결과 package-lock.json, node_modules를 삭제하고 다시 npm을 설치하라는 것이었는데(사실 나는 package.json까지 삭제했다🙄) 삭제까지는 성공 했으나 다시 설치하는 과정에서 package-lock.json만 다시 설치될 뿐 node_modules, package.json는 여전히 생성되지 않았다. 다행인지 불행인지 계속 설치하다보니 npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this com..

이벤트 버블링, 캡처링이란 해당 요소에 바인딩 된 이벤트를 실행할 때, 내가 실행시키려는 요소를 감싼 부모 요소들의 이벤트까지도 실행(전파)되는 것을 말한다. 아래 코드를 실행해보면 나는 버튼을 클릭했는데 버튼에 바인딩 된 이벤트 뿐만이 아니라 parant와 child에 바인딩 된 이벤트 까지 실행된다. const parant = document.querySelector('.parant'); const child = document.querySelector('.child'); const button = document.querySelector('button'); function parantClick(e){ alert('I am parant!') } function childClick(e){ alert('..

내가 까먹지 않으려고 저장해놓는 정보들 react 설치 npx create-react-app 프로젝트명 index.html root안에 app.js를 넣어서 구현함 렌더링 되는 파일이긴 하나 실제 코딩은 app.js에서 한다고 보면 됨 node_modules 프로젝트에 사용할 라이브러리를 모아 놓은 폴더 src 주된 source들이 있는 폴더 public static 파일(정적인 파일)들을 보관해놓은 폴더 package.json 설치한 라이브러리들을 모아 놓은 목록 기초문법 className - class라는 키워드가 이미 등록되어 있으므로 class 대신 className을 씀 {} - 변수명, 함수 등을 {}안에 넣어 바인딩 한다 style={ { overflow: 'hidden' } } - 태그안에..

고차함수란? 다른 함수를 전달 인자(매개변수)로 받거나, 함수를 결과로 반환하는 함수를 뜻한다. 1. map 기존의 배열을 순회하여 새로운 배열을 만들 때 사용된다. 이 때 기존의 배열은 변경되지 않는다. let array = [1, 2, 3, 4, 5] let arrayMap = array.map((item) => { return item + 1; }); console.log(arrayMap); //[2, 3, 4, 5, 6] console.log(array); //[1, 2, 3, 4, 5] ❓ forEach와의 차이점은? map은 콜백 함수를 반복적으로 실행한 결과를 반환하여 새로운 배열을 생성한다. forEach는 콜백 함수를 반복적으로 실행하지만 값을 반환하지 않아 리턴값을 사용할 수 없다. 2..

for in문 for in문은 객체의 반복문으로 객체의 프로퍼티를 순회하며 작업을 수행한다. 이 때, 열거가 가능한 ([[Enumerable]]속성이 true인) 객체만 사용이 가능하다. 객체의 key값에 접근할 수 있으며, 이를 이용하여 속성값을 출력하거나 저장할 수 있다. 예제 const obj = { name: 'nabi', age: 2, type: 'korean shothair', } for(const key in obj){ console.log(`${key}:${obj[key]}`) } //name:nabi //age:2 //type:korean shothair const list = { person1: { id: 1, name: "kim", age: 20, }, person2: { id: 2,..

컴포넌트란? 사전적 의미로는 구성 요소를 뜻한다. 이러한 의미 그대로 컴포넌트란 UI를 구성하는 개별적인 요소로써, 이것들을 조합하여 프로그래밍 할 수 있다. 컴포넌트를 사용하게 되면 여러가지 장점이 있다 1. 긴 html 태그들을 한 줄로 깔끔하게 치환할 수 있다. //Before function App() { return ( Logo About Work Contact title contents Logo About Work Contact contact me 010-1234-5678 dev-ee.tistory.com ⓒ2022. dev-ee all rights reserved ); }; //After function App() { return ( title contents ); }; 2. 각각 나눠져 있..