daisylee

이슈 antd로 불러온 컴포넌트에 styled-components를 적용할 때, 이미 컴포넌트가 상단에 정의되어 있어서 동일한 변수명을 가진 styled-components를 만들 수 없어서 난감했습니다. 같은 이름을 쓰자니 상단에 있어서 중복되고, 다른 이름을 쓰자니 이미 정해져 있는 antd 컴포넌트명을 함부로 바꾸면 안 되는거 아닌가...? 라는 생각이 들었습니다. 해결 방법 해결 방법은 의외로 간단했는데, styled(컴포넌트) 처럼 사용해서 가져다써도 상관없었습니다! styled-component로 활용하는 방법으로는 1. 스타일링된 엘리먼트를 만들어서 가져다 쓰기 2. 이미 만들어진 컴포넌트를 스타일링해서 가져다 쓰기 로 나눠볼 수 있겠습니다. 1번 방법은 styled.태그명 처럼 작성하고, ..

강의를 듣거나 혼자 토이 프로젝트를 만들 때, 아무 생각 없이 습관적으로 CRA(Create React App)를 통해 개발을 시작하다보니 리액트가 동작하는 기본적인 원리를 지나치게 되는 것 같습니다. CRA 없이 index.html에 리액트를 적용하는 방법을 정리해보았습니다. 우선 대부분의 설정은 리액트 공식문서에 나와있으므로 공식 문서만 따라해도 잘 작동할 것입니다. 저는 제가 보기 쉽게 정리를 하고 싶어서 블로그에 적고있습니다😊 https://ko.reactjs.org/docs/add-react-to-a-website.html 웹사이트에 React 추가 – React A JavaScript library for building user interfaces ko.reactjs.org 1. 태그 안에 ..

컴포넌트와 props를 다시 배워보니... 복습할 겸 다시 공부를 해보니 렌더링 영역(최상단 부모 컴포넌트)에서는 실제로 보여지는 데이터를 props로 넘겨주는 역할, 컴포넌트(자식 컴포넌트) 정의 영역에서는 넘겨받은 데이터를 가공한다고 생각하니까 이해하기 쉬웠던 것 같습니다. 부모에서는 데이터를 넘겨주고, 정의된 자식 컴포넌트에서는 데이터를 처리한다! 스타일링은 그때그때 알맞게 사용하자 강의에서는 리액트 컴포넌트 스타일링에 대해 1. 인라인 스타일링 2. emotion 3. styled-components 4. tailwind(테일윈드) 이렇게 4가지에 대해 소개하고 있습니다. 이중에서 저는 인라인 스타일링과 styled-components를 사용해보았는데요. 최근에는 emotion을 많이 사용한다고 ..

yarn start로 실행시키려고 하는데 다음과 같은 에러가 발생했습니다. 구글링을 해보니, npm을 최신 버전으로 해결하면 되는 문제였습니다. 터미널에 npm update 를 입력하고 다시 npm start나 yarn start를 하면 됩니다. 혹시 npm audit 이 보이면 그대로 실행하면 됩니다. (취약성 검사) https://kim-mj.tistory.com/269 [React/에러] 'react-scripts'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 리액트를 시작하거나 git clone을 받은 후, npm install을 하고 npm start를 했음에도 'react-scripts'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 ..

프로그래머스 Level 1 문제들을 풀면서 유독 자주 보이던 풀이가 바로 가우스 계산법이라고도 불리는 등차수열의 합입니다. 연속한 두 항의 차가 일정한 등차수열의 합은 첫 항과 마지막 항을 더한 뒤 항의 개수를 곱하고 2로 나눈 값이 됩니다. 프로그래머스 문제 중에서는 '두 정수 사이의 합', '부족한 금액 계산하기'에서 활용할 수 있습니다. 등차수열의 합을 써먹어 봅시다 이 간단한 공식을 사용하면 나중에도 유용하겠다고 생각해서, '두 정수 사이의 합'이라는 문제를 조금 더 들여다보면서 등차수열의 합을 활용하는 방법을 정리해보겠습니다. 두 정수 a, b 사이에 속한 정수를 포함한 정수의 합을 반환하는 함수를 작성하는 문제입니다. https://programmers.co.kr/learn/courses/30..

프로그래머스로 코딩테스트를 풀어보는데 아주 간단한 문제가 있었습니다. 정수로 이루어진 문자열을 숫자형으로 바꿔주는 함수를 작성하는 문제였습니다. 당연히 문자열을 정수형으로 변환해주는 parseInt 메서드가 떠올라 코드를 작성하고 다른 사람의 풀이를 보는데, 눈에 띄는 풀이가 있었습니다. 그것도 아주아주 간단한 풀이. 아마 제가 본 문제중에 가장 간단한 풀이가 아닐까 싶습니다! 메서드를 사용하지 않고는 도저히 풀 수 없을 것이라고 생각했는데, 왜 맞는걸까요? 연잔사의 형변환을 기억하자 덧셈, 뺄셈, 곱셈, 나눗셈의 사칙연산 산술자에는 +, -, *, / 가 있습니다. 만약 숫자로 이루어진 문자열과 숫자형을 사칙연산하면 결과값의 타입은 어떻게 될까요? 덧셈을 제외한 뺄셈, 곱셈, 나눗셈은 숫자로 형변환이 ..