728x90 반응형 분류 전체보기166 TypeScript + NodeJS(express) + MongoDB 조합으로 API 서버 만들때 주의할 점 들어서며 NodeJS를 쓰는 개발자들은 처음엔 유연한 JavaScript로 시작했다가 어느순간 TypeScript으로 넘어가게 되고 고마움을 느낍니다. 저도 개발을 하면 할수록 TypeScript의 필요성을 느끼고 있고 잘 이용할려고 합니다. 하지만 TypeScript로 API 서버를 만들면서 의아했던 부분들이 있었습니다. 의문 1. 상황 req.body로 클라이언트로부터 서버로 데이터를 전달 받았을 때 type 오류가 발생하지 않습니다. 제가 생각했을 때 아래 두가지 상황에서 분명 오류가 발생하고 데이터가 저장되지 않아야 하는데 그렇지 않았습니다. 2-1. Interface에 정의한 요소가 아님에도 오류가 발생하지 않는다. // interface.ts export interface UserInterfa.. 2022. 9. 28. 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] 테스트 코드 작성하기 (1) 알아버린 참맛 + 필요성 테스트 코드란 테스트 코드란 통상적으로 서비스의 품질을 확인하거나 소프트웨어의 버그를 찾을 때 작성하는 코드이다. 쉽게 말해서 내가 짠 코드가 잘 동작하는지 확인하는 도구이다. 또한 개발자라면 한 번씩 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. 이전 1 ··· 7 8 9 10 11 12 13 ··· 19 다음 728x90 반응형
