본문 바로가기

JavaScript30

내 react-router-dom Link는 왜 작동하지 않는가? 문제 발생 영화 앱을 만들던 중, 콘텐츠 아이디 값에 해당하는 URL을 찾아갈 수 있도록 링크를 걸었다. 그런데 링크는 제대로 걸려 있는 것 같은데, 링크를 눌러도 아무런 반응이 없었다. 확인해보니 URL은 제대로 변경이 되는데, 해당하는 URL로 렌더링이 되지 않는 것이었다. 잘 모를 땐 구글링을 해보자. 구글링을 해보니 이미 나같은 사람들이 꽤 많이 있었다! 그런데 문제는 원인이 다양해서, 딱 내 코드에 맞는 것을 찾기가 힘들다는 것이었다. 다만 대부분은 route의 세팅 문제였고, 어쨌든 내가 react-router-dom을 제대로 모르고 있다는 것은 사실인듯 했다. 그럼 내 문제는?? 그러다 문득 든 생각. 주소가 변했다는 것을 인식을 못하는 건가?? 내 Router는 이렇게 설정되어 있었다. 그.. 2020. 7. 4.
Google api client 라이브러리 node-js 삽질기 google api 라이브러리를 사용해보자. google api 편하게 사용할 수 있도록 미리 세팅이 된 라이브러리가 있다. https://developers.google.com/api-client-library 그런데 라이브러리를 설치하고 import하여 실행하는 순간 오류가 발생한다. ./node_modules/googleapis-common/build/src/http2.js Module not found: Can't resolve 'http2' in 'C:\..생략..\node_modules\googleapis-common\build\src' http2 모듈을 못 찾는다는 건데, http2는 nodejs 설치 시에 core에 같이 설치 되는 것이기 때문에 설치가 안되어 있을 수가 없다. 실제로 확인.. 2020. 7. 1.
Webpack webpack module bundler 의존 관계에 있는 모듈들을 하나의 JS파일로 번들링한다. 의존 모듈이 하나의 파일로 번들링되므로 별도의 모듈 로더가 필요없어진다. ES6+로 작성했을 경우, Babel을 로드하여 ES5 코드로 변경해야한다. Sass를 사용했을 경우, Sass 트랜스파일링도 진행한다. 설치 npm install webpack webpack-cli webpack : 파일에서 webpack을 사용 가능하게 해준다. webpack-cli : 콘솔에서 webpack을 사용 가능하게 해준다. 설정 package.json에서 스크립트를 작성해 놓으면 쓰기 편하다. "scripts":{ "dev:server": "nodemon --exec babel-node init.js --delay 2",.. 2020. 3. 13.
JavaScript - Typed Array JavaScript 배열은 진짜 배열이 아니다. 배열은 연속적인 메모리 로케이션의 묶음을 사용한다. 따라서 특정 값을 찾기가 용이하다. ( 어느 메모리 블록에 저장되어있는지 찾기가 쉬움 ) 반면, JavaScript의 배열은 hash-map 이다. Linked List를 통해서 구현된다. ( ??? ) 특정 값을 찾으려면 메모리 시작점부터 원하는 값까지 탐색해 나가야 한다. JavaScript 배열의 진화 최근 JavaScript 엔진의 경우, 모든 요소가 동일한 타입을 가진 배열의 경우, 연속적으로 메모리를 할당한다. ES6 이후, Typed Array가 추가되었으며, 이를 통해 ArrayBuffer를 사용할 수 있게 되었다. ArrayBuffer는 contiguous 메모리 블록을 제공하고, 이것을 .. 2020. 3. 11.