만족

https://satisfactoryplace.tistory.com/131 [React] 검색엔진 최적화(SEO):: Prerendering (react-snap) React는 대표적인 SPA제작 라이브러리이다. SPA가 사용감이나 개발적인 측면에서는 유리하지만, 빌드된 결과물을 보면 는 텅 비어있고 js가 body를 바꾸기 때문에 검색엔진은 이 사이트를 비어있는 satisfactoryplace.tistory.com 위 포스트에서 react-snap 으로 prerendering을 사용하는 방법에 대해 설명했었다. 그러나 언제부턴가 오류와 함께 동작하지 않게 되었고, 해결 방법을 알아내기 위해 react-snap의 레포를 둘러보았으나 개발이 끊긴지 오래 되어 이슈는 많은데 픽스 버전이 전혀 나오지 않는 상..

|-components |---AAA |-----AAA.js |---BBB |-----BBB.js |-App.js 이런 구조로 되어 있을 때, AAA.js가 BBB.js를 import 한다면 아래와 같다. import * from '../BBB/BBB' 이정도는 괜찮다. 그런데 만약 components와 같은 레벨에 utils라는 디렉터리가 있고, AAA.js에서 utils/index.js를 import하려면 어떻게 할까? |-components |---AAA |-----AAA.js |---BBB |-----BBB.js |-utils |---index.js |-App.js import * from '../../utils'; 우우욱... 디렉터리이 깊이가 더 깊어지면 아래와 같이 ../로 도배된다 꺄아아아..

redux-thunk에 대해 redux 문서에서는 아래와 같이 설명하고 있다. For Redux specifically, "thunks" are a pattern of writing functions with logic inside that can interact with a Redux store's dispatch and getState methods. Redux에서 thunks는 리덕스 스토어의 dispatch, getState와 상호작용하는 내부 로직을 포함한 함수를 작성하는 패턴입니다. 다시 말하면, 함수 내부 로직에서 별도로 redux store와 상호작용하는 로직을 구현하기 위해 사용하는 패턴이라는 뜻이다. 특히 비동기로 스토어와 상호작용할 때 유용하다. https://github.com/re..

http 프로토콜을 강제로 https로 변경하여 사용하도록 설정해보자. https://developer.mozilla.org/ko/docs/Web/HTTP/Headers/Strict-Transport-Security Strict-Transport-Security - HTTP | MDN HTTP Strict-Transport-Security response header (종종 HSTS (en-US) 로 약칭) 는 HTTP 대신 HTTPS만을 사용하여 통신해야한다고 웹사이트가 브라우저에 알리는 보안 기능. developer.mozilla.org MDN에 의하면, Strict-Transport-Securty 헤더를 통해 클라이언트(브라우저)에게 https를 사용해야 한다고 알려줄 수 있다고 한다. Strict..

redux에 대해 포스트를 작성하고, 이후 redux-toolkit에 대해 작성해보겠다 하고는 시간이 꽤나 지났다. https://satisfactoryplace.tistory.com/278 [Nodejs] Redux의 기본 이해 https://redux.js.org/tutorials/fundamentals/part-1-overview Redux Fundamentals, Part 1: Redux Overview | Redux The official Fundamentals tutorial for Redux: learn the fundamentals of using Redux red.. satisfactoryplace.tistory.com 이번에 회사에 입사하게 되었는데, 마침 상태관리 도구로 redux-t..

IOS Safari ios에서 유니콘 광고차단과 같은 앱을 사용하신다면 '화이트리스트에 등록'을 진행해야 합니다. ios의 경우 타 앱에서 내부적으로 safari를 사용할 수 있기 때문에 사파리 브라우저를 직접 사용하지 않더라도 다른 앱에서 열리는 페이지에도 영향을 미칠 수 있습니다. 사파리를 열고 광고차단 해제를 원하는 사이트에 접속 후, 하단의 공유 아이콘(3번쨰)를 누릅니다. 스크롤을 내려 '화이트리스트' 항목을 선택하여 해당 페이지에서 광고차단을 하지 않도록 변경할 수 있습니다. PC 구글 크롬 대부분 애드블록 확장 프로그램을 위의 확장 프로그램을 사용합니다. 여기에서 접속중인 사이트에 대해 애드블록을 해제하려면 Once/Always 둘 중 하나를 누릅니다. Once는 이번만 애드블록을 해제하고,..

위와 같이 스크립트 태그를 선언하고 사용했을 것이다. script에서 지정한 js에서 import/export를 사용하기 위해서는 type='module'을 사용해야 한다. 이제 /path/js/code에서 import/export를 사용할 수 있다. 사용해보기 // /path/js/lib.js export const foo= ()=>{ console.log('hello'); } lib.js 파일을 만들고 위 내용을 작성한다. lib.js는 script태그에 넣어주지 않아도 된다. // /path/js/code.js import {foo} from './lib.js'; foo(); /path/js/code.js에는 위와 같이 import를 사용해 lib.js에서 export한 변수를 사용할 수 있다. 주..

몽고디비를 캐시서버 역할로 사용중이다. 약 1년쯤 되었는데, 상당한 용량이 쌓여 오랫동안 사용되지 않은 데이터는 정리했다. # mongo shell use DB_NAME db.COLLECTION.deleteMany(...); 대략 이런 느낌으로 해서 6달 이상 사용되지 않은 데이터 약 100~200만개를 삭제했다. 그런데 삭제가 완료되었음에도 디스크 용량을 뱉어내질 않는다. 몽고디비는 공간이 남더라도 이후 쓰여질 document를 위해 disk space를 반환하지 않는다고 한다. 디스크 용량 회수 use DB_NAME db.runCommand({ compact: 'COLLECTION_NAME' }); 을 사용하여 해당 컬렉션의 비어 있는 디스크 공간을 회수할 수 있다. 이것을 모든 컬렉션에 대해 반복하..