전체 글399 fetch를 통해 요청을 날릴때 headers는 쓰지 않기 fetch를 통해 post요청을 날리려고 할때 const fileInput = document.querySelector('#your-file-input') ; const formData = new FormData(); formData.append('file', fileInput.files[0]); const options = { method: 'POST', body: formData, // header를 아래처럼 셋팅하면 안된다고 한다 // headers: { // 'Content-Type': 'multipart/form-data', // } }; fetch('your-upload-url', options); Content-Type: multipart/form-data; boundary=----WebKi.. 2023. 6. 16. ESM과 CJS CommonJS 자바스크립트의 공식 스펙이 브라우저만 지원했기 때문에 이를 서버사이드 및 데스크탑 어플리케이션에서 지원하기 위한 노력이 있었다. 그걸 위해 만든 그룹이 CommonJS이며 여기선 자바스크립트가 범용적인 언어로 쓰이기 위한 스펙을 정의하고 있다. 그룹을 만들었을 때, 범용적인 언어로 만들기 위해서는 '모듈화의 개념'이 필요했고 이 그룹만의 모듈 방식을 정의하게 되었는데 그것이 바로 CommonJS 방식의 모듈화다. 다른 모듈을 사용할 때는 require 를, 모듈을 해당 스코프 밖으로 보낼 때에는 module.exports 를 사용하는 방식으로, Node.js에선 현재 이 방식을 사용하고 있다. [ 출처 ] https://baeharam.netlify.app/posts/javascript/.. 2023. 6. 15. Failed to load plugin 'jsx-a11y' declared in 'package.json 작업을 하는데 따로 어떤 코드를 추가하지도 않았는데 갑자기 npm start를 실행하니 맞딱드린 오류 [eslint] Failed to load plugin 'jsx-a11y' declared in 'package.json » eslint-config-react-app': Cannot find module 'deep-equal' Require stack: - /node_modules/aria-query/lib/elementRoleMap.js - /node_modules/aria-query/lib/index.js - /node_modules/eslint-plugin-jsx-a11y/lib/rules/aria-activedescendant-has-tabindex.js - /node_modules/eslint.. 2023. 6. 14. Next.js에서 mediapipe를 사용하려다 만난 ESM / CJS 의 차이 리액트에서는 잘만 작동되던 mediapipe를 회사에서 진행중인 nextjs에 끌고와서 사용을 하려고 하다보니 'export' not defined 였나 하는 에러를 만나면서 ESM과 CJS의 차이점에 대해 알게되었다. js가 돌아가는 node.js에는 CommonJS와 ECMAScript Modules 두 가지 모듈 시스템이 존재한다고 한다. CJS는 require/module.exports를 하고 ESM은 import/export문을 사용한다. CJS는 '동기적'으로 작동하고, ESM은 비동기적으로 작동하는데 따라서 ESM에서는 CJS를 import할 수 있지만, CJS에서는 require을 할 수 없다고 한다 (이유 : CJS는 Top-level Await를 지원하지 않는 '동기적'이라서) 따라서 .. 2023. 6. 9. [ Blob ] formData를 보내는데, 왜 blob으로 감싸니 정상적으로 전송이 되었을까? 내가 서버로 post를 날려야했던건 이미지 파일과 json형식의 데이터였는데 그 중 json형식 데이터를 아래처럼 보내고 있었다. formData.append("postDto", JSON.stringify(postDto)); 그러나 계속 발생했던 500 에러!!! json형식으로 만들어 보내는 걸 처음하다보니 어느 부분이 문제인지(받는 쪽 설정 문제인지 내쪽 문제인지조차 헷갈렸다) 하지만 백엔드분께서 금방 시원하게도 해결을 해주셨다 ㅎㅎ (최고>_ 따라서 서버가 JSON 형식의 데이터를 예상하고 있다면, JSON 형식의 데이터를 명시적으로 전달해야 했던 것 [수정 코드] const blob = new Blob([JSON.stringify(postDto)], { type: 'application/json'.. 2023. 6. 6. [읽는듕] 클린코드 확실히 본격(?) 개발자로 살아가게 되면서 요즘 들어 내가 어떤 개발자로써 살아가고 싶은지 고민을 많이 하게 되고 주변에 조언도 많이 구하게 되는 것 같다 입사 후에 정말 많은 도움을 준 너무 고마운 리더님(ㅊㄱ 고맙습니당ㅎㅎ)이 추천해주셨던 클린 코드를 깔짝깔짝 읽고 잇는데 (너무 두꺼워서 완독하고 싶은 욕심은 안든당) 와닿았던 문장 " 하나의 코드는 하나의 기능만 수행하도록 해라" " 의존성을 최대한 줄여야 버그를 피할 수 있다 " 그리고 "르블랑의 법칙" 나중에 고쳐야지 하고 생각한 코드의 '나중'은 돌아오지 않는다는 것 처음부터 코드를 짤때 다른 개발자가 볼때, 또 추후의 유지보수가 편리한 코드는 어떤 코드일까를 연구하는 것 마치 잘 쓴 책처럼 읽혀지는 코드가 좋은 코드라는 말 내 코드를 처음 본.. 2023. 6. 5. 이전 1 2 3 4 5 6 ··· 67 다음
