이 에러는 괄호 하나때문에 3일간 골머리를 썩은 후 작성한 글입니다. 포트폴리오 웹사이트를 제작하던 중 버튼요소의 사용빈도가 잦아졌고, 불필요하게 컴포넌트별로 버튼스타일을 지정해주기 보다는 재사용가능한 공용 버튼 컴포넌트를 만들어서 사용해야겠다고 생각했습니다. 그래서 아래와 같이 버튼이벤트나 텍스트, 스타일요소를 props로 받아 사용할 수 있도록 버튼컴포넌트를 생성했습니다. 버튼 컴포넌트를 바꿨으니 이제 버튼태그와 컴포넌트별로 구성되어있던 버튼 스타일 코드들을 지워주고 버튼컴포넌트로 대체해주면 끝입니다. 이처럼 버튼 컴포넌트로 바꿔줬습니다. 그런데 .. 버튼 컴포넌트를 적용했더니, 해당 페이지 이외에도 모든 서비스 페이지에 스타일이 깨져버렸습니다. 내가 리액트 컴포넌트 사용방법에 위배되는 코드를 작성한..

구글 애널리틱스로부터 fatching한 데이터를 . 디비에 넣어서 관리하고싶은데 백엔드 팀원이 없기때문에 직접 노드서버에 DB를 붙이는 과정에서 겪은 에러이다. 대충 해석해보면 "핸드쉐이크가 가득 차 있는데, 그 후에 또 핸드쉐이크를 채울 순 없다." 음... 나 배부른데 또 뭘 먹이려고? 라는 뉘앙스이다. 아마도 내가 한번이면 되는 걸 처리가 되기전에 너무 빨리요청하거나 혹은, 두번 요청한다는 느낌이다. 아니나 다를까 다른 사람들의 트러블슈팅 기록을 보니 DB connection이 중복으로 호출된게 문제였다. //sql 연결하기 const connection = mysql.createConnection({ host: 'localhost', user: 'root', password: 'drrsrd0330..

내가 마주한 문제는 진행중인 사이드 프로젝트의 캘린더를 체크박스로 묶어서 여러항목을 한번에 삭제하는 기능을 구현하다가 마주한 문제입니다. 기능구현에 앞서, 로직을 구성할 때 나의 머릿속에서 수도코드를 작성해봤다. 로직 수도코드 체크박스의 상태와 선택된 항목을 담을 상태를 만든다. 체크박스가 체크되면 체크박스핸들러라는 함수가 실행되고, 해당 함수에서는 체크박스의 상태를 true로 변경하고 선택된 항목을 배열 타입의 state에 추가한다. 조건문을 통해 체크박스가 비활성화된다면 배열에서 해당항목을 필터해서 삭제해준다. 삭제버튼을 누르면 해당 배열에 들어간 항목들을 순차적으로 순회하면서 DELETE요청을 서버로 요청한다. 위의 로직으로 구현을 했고, 체크박스를 클릭했을 때 내 예상과는 다른 결과가 나왔다. 내..

※MUI 를 이용하여 구글 애널리틱스로부터 데이터를 받아와 대시보드에 보여주는 작업을 하다가 만나게 된 에러입니다.※ 에러내용을 읽어보고는 "아 설치안된 모듈이 있구나? 설치해주면 되겠네" 라고 생각해서 install을 해주기 시작했다. 그런데 아무것도 만지지 않았는데 갑자기 돌발적으로 이런 에러가 발생하는게 이상해서 구글링을 해봤다. 요약하자면 Webpack5 이전 버전에서는 Node.js 의 핵심모듈에 폴리필을 기본적으로 포함하고 있었지만, 그 이후 버전부터는 더 이상 폴리필을 포함하고 있지않아서 생기는 문제라고한다.. 여기서 든 의문점들 그렇다면 왜 처음에 npm start했을때는 에러가 발생하지 않았는가? MUI는 CRA로 빌드 된 프로젝트같은데, 웹팩설정을 어떻게 수정해줘야 하는가? 에러창을 끄..