Dawon's blog
취소

React - props를 객체로 받아서 편하게 사용하기

(제목을 뭐라고 해야 할 지 잘 모르겠다.) 부모 컴포넌트에서 자식 컴포넌트에 props를 넘겼을 때 자식 컴포넌트에서 JSX요소에 하나 하나 적기에는 너무 많을 때 사용하면 좋은 방법 같다! // 부모 컴포넌트 <Input input={{ id: "amount", type: "number", min: "1", ...

styled-components - Received `false` for a non-boolean attribute 에러 해결하기

styled-components를 사용하는데 콘솔에 경고가 떴다. 내 코드는 다음과 같다. const FormControl = styled.div` margin: 0.5rem 0; & label { font-weight: bold; display: block; margin-bottom: 0.5rem; ...

Project setting - CRA, TypeScript, ESLint, Prettier, Lint-staged, Husky

미래의 나를 위해 남겨두는 프로젝트 세팅하기 CRA로 TypeScript 프로젝트 세팅하기 npx create-react-app my-app --template typescript ESLint 설정 ESLint란 자바스크립트 코드에서 설정에 위배되는 코드나 안티 패턴을 자동으로 검출하도록 도와주는 오픈소스 설치(npm 기준) npm...

prettier - Error loading node module 해결하기

CRA로 프로젝트를 생성했는데 prettier가 먹히지 않고 다음과 같은 에러가 생겼다. ["ERROR" - 1:23:19 PM] Error handling text editor change ["ERROR" - 1:23:19 PM] Error loading node module '/home/~/node_modules/prettier.' Err...

npm - EACCES permissins error 해결하기

npm 업데이트를 하려고 하니 다음과 같은 에러가 발생했다. Error: EACCES: permission denied, rename '/usr/lib/node_modules/npm' -> ~~~ npm 최신 버전으로 업데이트하기 sudo npm i -g npm 에러 해결하기 npm docs 페이지에서 보니 global 설치 시 저런 ...

JavaScript - toString(),parseInt() 진수 변환

지금까지 toString()을 데이터를 문자열로 바꾸기 위해서만 사용했는데, 진수 변환도 가능하다고 한다. toString() 문자열 반환 객체에 toString()을 사용하면 "[object Object]"를 반환한다. 배열에 toString()을 사용하면 배열 안의 요소들을 하나의 문자열로 반환한다. let num = 11...

Javascript - lastIndexOf()

프로그래머스 0단계 ‘한 번만 등장한 문자’ 내 풀이 function solution(s) { // s가 'hello'라면 // 주어진 문자를 set을 사용해 중복이 없는 배열로 만든다. let set = new Set([...s]); // [h,e,l,o] // set에 있는 각 요소가 몇 번씩 나왔는지 횟수를 cnt 배...

원티드 프리온보딩 챌린지 6월 - 사전과제

원티드 프리온보딩 챌린지 6월을 신청했다. 이번 주제는 컴포넌트 주도 개발이다. 원래는 테스트 주도 개발에 관심이 많지만, 이번 챌린지를 통해 컴포넌트에 대해 좀 더 깊이 이해하고 컴포넌트 주도 개발에 대해서도 알고 싶어서 신청하게 되었다. (그리고 취업도..) 사전 미션 사전미션은 버튼 디자인 시안을 Figma로 제작하기이다. 요구사항은...

Node - Readline

아래 문제는 프로그래머스 0단계 문제 중 ‘직각삼각형 출력하기’ 이다. > "_"의 높이와 너비를 1이라고 했을 때, "_"을 이용해 직각 이등변 삼각형을 그리려고합니다. 정수 n 이 주어지면 높이와 너비가 n 인 직각 이등변 삼각형을 출력하도록 코드를 작성해보세요. 입력 : 3 출력 : * ** *** 내가 당황한건 ...

JavaScript-reduce메소드

프로그래머스 LV.0을 풀다보니 reduce메소드를 사용한 코드를 많이 보게 되었다. 사용방법 // 사용방법 array.reduce((누적값, 현재값, 현재 인덱스, 원본 배열) => { return 결과; }, 초기값); reduce 함수의 return값은 누적값에 계속 누적된다. → 최종적으로 하나의 값이 된다. 누적...