728x90 반응형 분류 전체보기174 TypeScript에서 <T>란 무엇일까? - Generic Type 들어서며 TypeScript는 단순하게 JavaScript에서 Type을 추가해준 언어이다. 하지만 TypeScript를 쓰면서 라는 새로운 아이를 만나게 된다. 처음에는 를 만나거나 쓸 일이 없어 단순하게 넘겼지만 TypeScript로 개발을 하면서 자연스럽게 를 만나게 되었다. 그럼 가 무엇이고 왜 TypeScript에서는 이걸 쓰는지에 대해서 이야기해보도록 하자. 쓰는 이유 JavaScript는 다른 언어들과 달리 type을 입력하지 않기 때문에 자유롭다. 그만큼 위험부담이 높기 때문에 JavaScript 개발자들은 필수적으로 TypeScript를 이용해서 type에 따른 위험 요소를 줄이고자 한다. TypeScript는 함수나 클라스를 사용하기 위해서는 미리 Type을 지정해줘야 한다. 그렇지만 .. 2022. 9. 26. [React] useState() 바로 반영 안되는 현상 해결 회원가입 서비스를 만들려고 하는데 비밀번호와 비밀번호 확인가 일치할 때만 가입할 수 있도록 만들고 싶었습니다. 하지만 위와 같이 비밀번호를 동일하게 입력했음에도 불구하고 한 박자 느리게 useState가 반영되었습니다. const onChange = (e) => { setUser({ ...user, [e.target.name]: e.target.value, }) if(user.password === user.passwordCheck) { setIsPassword(true); } else{ setIsPassword(false); } } 코드를 보면 input에 상태값이 바뀔 때마다 onChange 함수가 실행되면서 만약password와 passwordCheck가 같다면 true로 바꿔주고 같지 않다면 fa.. 2022. 9. 21. [Jest] Axios undefined 해결하기 with.mock Axios로 통신하여 데이터를 잘 가져오는지 확인하기 위해 테스트 코드를 작성했다. 하지만 예상과 달리 결과값이 undefined였다. 공식문서를 확인해보니 axios를 테스트하기 위해서는 jest.mock를 써줘야했다. 공식문서 : https://jestjs.io/docs/mock-functions#mocking-modules Mock Functions · Jest Mock functions allow you to test the links between code by erasing the actual implementation of a function, capturing calls to the function (and the parameters passed in those calls), capturi.. 2022. 9. 14. [MongoDB] Robo3T Failed to load documents 해결 방법 - Studio 3T 설치 그동안 잘 Robo3T를 사용하였는데 오늘부터 위와 같은 오류들이 생기기 시작했다. 알아보니 Robo3T v1.4의 문제 중 하나였다. 해결 방법은 v1.4.2을 다운로드 받는 것인데 알고보니 Robo3T는 개발 작업을 중단했으며 지원 중지되어 다운로드 받을 수 없다. 공식문서를 찾아보니 Robo3T 대신 Studio 3T를 다운로드 받는 것은 권장하고 있다. 다운로드하는 방법은 아주 간단하다. https://robomongo.org/ Robo 3T | Free, open-source MongoDB GUI (formerly Robomongo) Read by Dmitry Schetnikovich robomongo.org 위 링크를 클릭한 후 Download Studio 3T Free Today를 눌러주면 .. 2022. 8. 30. [NodeJS] code ERESOLVE ERESOLVE could not resolve 해결 클라이언트 Dockerfil을 작성 중 code ERESOLVE ERESOLVE could not resolve 라는 오류를 만나게 되었다. 오류의 원인은 npm v7에서는 npm install 충돌이 발생하면 실패한다고 한다. npm v4~6에서는 충돌이 있어도 경고만 뜨고 설치는 되었다고 한다. RUN npm install --save --legacy-peer-deps 발견한 해결 방법은 --save --legacy-peer-deps 였다. 해본 결과 Build도 잘 되었고 작동도 문제 없이 되었다. 좀 더 찾아보니 --legacy와 --force 둘 중 하나를 사용하여 해결하는 것 같았다. --legacy는 충돌을 무시하고 peerDependency가 맞지 않아도 일단 설치한다고 한다. --forc.. 2022. 8. 30. [TypeScript] object vs. Object 차이점 간단하게 변수에 객체를 넣고 싶었다. 그런데 객체에 object와 Object가 있다는 것을 알았다. 문제점 text라는 변수에 object[]라는 타입을 지정했다. 일부러 string을 넣어보니 바로 타입 에러가 표시되어 잘못 지정해줬다는 것을 개발자에게 알려준다. 이럴 경우 코드 작성시 생길 수 있는 에러 확률을 현저히 낮춰준다. 하지만 Object[]를 주면 오류가 뜨지 않는다. 이럴경우 매우 당황스러운 순간이다. 어째서 object는 잡아주고 Object는 잡아주지 않는 것일까? 차이점 object의 경우 원시형이 아닌 모든 값들을 받을 수 있다. 즉, string, number, boolean, symbol, null, undefined가 들어오면 type 에러를 발생한다는 것이다. 하지만 원시.. 2022. 8. 29. [NodeJS] 테스트 코드 참맛과 필요성 테스트 코드란테스트 코드란 통상적으로 서비스의 품질을 확인하거나 소프트웨어의 버그를 찾을 때 작성하는 코드이다.쉽게 말해서 내가 짠 코드가 잘 동작하는지 확인하는 도구이다. 또한 개발자라면 한 번씩 TDD에 대해서 들어보았을 것이다.Test-Driven Development 즉, 테스트 주도 개발이라고 불리면서 많은 개발자들이 해야하는 덕목처럼 주장하는 사람들이 많다.채용공고나 면접에서 테스트 코드를 잘 짜는지에 대해서 물어보기도 한다. 부정적인 생각많은 개발자들이 테스크 코드를 중요하게 생각하는데 솔직히 지금까지 필요성을 못느끼고 있었다.오류 사항을 파악할 수 있다고 하는데 console.log를 찍든 errer 메시지를 보면 바로바로 수정이 가능하다.오히려 테스크 코드를 먼저 짠다고 생각하니 자유롭.. 2022. 8. 24. [React] useEffect 두 번 호출?! with.StrictMode useEffect을 이용해서 백엔드로부터 받은 data를 확인하기 위해 console.log을 찍어보았습니다. 그런데..무려 두 번이나 콘솔에 찍혔습니다. 어째서 두 번이 호출된 것일까요? 🤔 root.render( ); 이유는 태그에 감싸져 있으면 개발 단계에서 오류를 잘 잡기 위해 두 번씩 렌더링 된다고 합니다! useEffect과 관련된 사항이 아니었군요. 그렇다면 StrictMode는 무엇일까요? 바로 React에서 제공하는 검사 도구입니다. 개발 모드일 때만 디버그를 하며 해당 태그로 감싸져 있는 컴포넌트의 자손까지 검사를 한다고 합니다. 공식문서 : https://ko.reactjs.org/docs/strict-mode.html Strict 모드 – React A JavaScript libra.. 2022. 8. 21. [NodeJS] 검색기능 만들기 (1) MongoDB Query 규모가 크지 않은 서비스라면 굳이 검색엔진을 구축할 필요는 없습니다. MongoDB Query를 가지고 간단한 검색기능을 알아보도록 하겠습니다. 1) Regex 아마 가장 많이 사용하는 방법이 정규식이라고 생각합니다. 정규식을 이용하면 쿼리 중에 문자열의 패턴을 검색 가능합니다. 정규식은 패턴을 일련의 문자와 일치시키는 일반화된 방법입니다. .find({ title: { $regex: "강아지" } }) 원하는 필드에 찾고자 하는 데이터를 $regex로 걸어줍니다. 그러면 title이라는 필드 안에 "강아지"라는 단어를 가진 데이터들을 모두 가지고 옵니다. 예를 들어, title이라는 데이터에 "강아지" 말고도 "강아지산책", "사료강아지" 등 강아지가 포함된 모든 데이터들이 검색됩니다. 부분 텍스트 검.. 2022. 8. 19. 이전 1 ··· 8 9 10 11 12 13 14 ··· 20 다음 728x90 반응형
