[React] Assign object to a variable before exporting as module default warning
·
React/버그
React를 사용해서 개발하다가 터미널을 열었을 때 제목과 같은 오류가 발생했다. Assign object to a variable before exporting as module default warning 기능상 문제가 되는 부분은 없었지만 무엇이 문제인지 알아봤다. 확인을 해보니 나의 export 습관에서 비롯된 문제였다. export default { value: "123", key: "toto" } 다음과 같이 export 를 할 때 default에 객체로 바로 반환해서 발생한 문제였다. 해결하는 방법도 간단했는데, const object = { value : "123", key: "toto", } export default object 다음과 같이 변수로 명칭을 정해주고 export를 하면 문..
[JavaScript] ??와 || 의 차이
·
JavaScript
JavaScript로 개발하다보면 값의 결정을 내려야 하는 경우가 있다. const getValue = () => { return value ? value : "" } 다음과 같이 value의 값이 있을 때 value 없을 때 다른 값을 넘기는 경우이다. 이때 예시와 같이 삼항 연산자를 사용할 수 있다. 하지만 다른 방법으로는 제목처럼 || 또는 ?? 를 사용할 수 있다. 지금까지는 그냥 손이 가는데로 사용했지만 이 둘의 차이가 뭘까? || 연산자 먼저 || 연산자는 논리 OR 연산자이다. 왼쪽의 피연산자가 truthy인 경우 왼쪽 피연산자를 반환하고 아니라면 오른쪽 피연산자를 반환한다. truthy라는 것은 뭘까? 이것은 조건식에서 true로 간주되는 모든 값을 의미한다. 대표적인 truthy 값으론 ..
[알고리즘] 2016년
·
알고리즘
문제 설명 2016년 1월 1일은 금요일입니다. 2016년 a월 b일은 무슨 요일일까요? 두 수 a ,b를 입력받아 2016년 a월 b일이 무슨 요일인지 리턴하는 함수, solution을 완성하세요. 요일의 이름은 일요일부터 토요일까지 각각 SUN,MON,TUE,WED,THU,FRI,SAT 입니다. 예를 들어 a=5, b=24라면 5월 24일은 화요일이므로 문자열 "TUE"를 반환하세요. 제한사항 2016년은 윤년입니다. 2016년 a월 b일은 실제로 있는 날입니다. (13월 26일이나 2월 45일같은 날짜는 주어지지 않습니다) 입출력 예 a b result 5 24 "TUE" 나의 풀이 const day = ["SUN","MON","TUE","WED","THU","FRI","SAT"] function ..
[알고리즘] x만큼 간격이 있는 n개의 숫자
·
알고리즘
문제 설명 함수 solution은 정수 x와 자연수 n을 입력 받아, x부터 시작해 x씩 증가하는 숫자를 n개 지니는 리스트를 리턴해야 합니다. 다음 제한 조건을 보고, 조건을 만족하는 함수, solution을 완성해주세요. 제한사항 x는 -10000000 이상, 10000000 이하인 정수입니다. n은 1000 이하인 자연수입니다. 입출력 예 x n answer 4 3 [4,8,12] -4 2 [-4, -8] 2 5 [2,4,6,8,10] 나의 풀이 function solution(x, n) { var answer = []; for(let i=1; i
[알고리즘] 예산
·
알고리즘
문제 설명 S사에서는 각 부서에 필요한 물품을 지원해 주기 위해 부서별로 물품을 구매하는데 필요한 금액을 조사했습니다. 그러나, 전체 예산이 정해져 있기 때문에 모든 부서의 물품을 구매해 줄 수는 없습니다. 그래서 최대한 많은 부서의 물품을 구매해 줄 수 있도록 하려고 합니다. 물품을 구매해 줄 때는 각 부서가 신청한 금액만큼을 모두 지원해 줘야 합니다. 예를 들어 1,000원을 신청한 부서에는 정확히 1,000원을 지원해야 하며, 1,000원보다 적은 금액을 지원해 줄 수는 없습니다. 부서별로 신청한 금액이 들어있는 배열 d와 예산 budget이 매개변수로 주어질 때, 최대 몇 개의 부서에 물품을 지원할 수 있는지 return 하도록 solution 함수를 완성해주세요. 제한사항 d는 부서별로 신청한 ..
[알고리즘] 직사각형 별찍기
·
알고리즘
문제 설명 이 문제에는 표준 입력으로 두 개의 정수 n과 m이 주어집니다. 별(*) 문자를 이용해 가로의 길이가 n, 세로의 길이가 m인 직사각형 형태를 출력해보세요. 제한사항 n과 m은 각각 1000 이하인 자연수입니다. 입출력 예 입력 5 3 출력 ***** ***** ***** 나의 풀이 process.stdin.setEncoding('utf8'); process.stdin.on('data', data => { const n = data.split(" "); const a = Number(n[0]), b = Number(n[1]); for(let i = 0; i < b; i++) { console.log("*".repeat(a) ) } });
Copilot 사용기
·
개발생활
최근 Chat GPT가 유행이다. 그래서 개발에도 AI를 어떻게 해야 잘 써야할까? 생각한 적이 있는데, 생각으로만 그치고 결론을 내리지 못했다. Chat GPT를 사용하는 방법도 있지만, 개인적으로 질문을 통해 결과를 얻는 방식보다 바로 바로 개발하는 것이 더 효율적이라고 생각했다. 한번의 질문으로 원하는 결과물을 얻을 수 있다면 당연히 사용을 고려하겠지만 그것이 아닌 추가적인 질문을 통해서 원하는 결과를 얻어야 한다면 복잡도가 높은 개발이 아니면 효율이 좋은가? 라는 생각이 있기 때문이다. 그래서 굳이 사용하자면 검증을 하는 단계 또는 Chat GPT와 나의 개발이 어떤 방식으로 다른지 확인하는 정도로 사용할 수 있겠다고 생각했다. 그런데, 회사를 통해 Copilot을 사용할 수 있는 기회를 얻었다...
[React] MSW - Failed to register the Service Worker: Failed to register a ServiceWorker for scope
·
React/버그
현재 프로젝트에서 백엔드 작업이 딜레이가 되어 msw로 테스트를 진행하려고 했는데, 오류가 발생했다. 오류 내용은 제목과 같은 [MSW] Failed to register the Service Worker: Failed to register a ServiceWorker for scope 설정을 전부 하고 실행을 시켰는데 정상적으로 msw가 실행되지 않았다. 그래서 다시 처음부터 설정을 해봤는데, 내가 놓친것이 있었다. msw는 프로젝트 내에 mockServiceWorker.js 파일이 있어야 정상적으로 작동하는데, 이것은 내가 직접 만드는 것이 아닌 명령어를 통해서 생성하는 것이다. npx msw init 폴더 를 통해서 public 폴더에 mockServiceWorker를 생성하니 정상적으로 msw가 ..