본문 바로가기

전체 글

(348)
[Sub Issue] Use pragmatic-drag-and-drop 직접 pragmatic-drag-and-drop 패키지를 사용해서 react-beautiful-dnd 패키지에서 migration 작업을 진행합니다. 1. 기존 react-beautiful-dnd 코드 주석 처리 후 dnd 외 기능 정상 동작 확인2. 코드 삭제 및 git commit3. 제공되는 튜토리얼 따라서 진행- draggble: 실제 드래그할 컴포넌트에 사용.- dropTargetForElements: 드롭될 수 있는 컴포넌트에 사용.- monitorForElements: 최상단에서 드래그와 드롭을 감시하는 컴포넌트에서 사용.  참고https://atlassian.design/components/pragmatic-drag-and-drop/tutorial/
[JS 꿀팁] 배열 요소 확인에는 어떤 걸 사용해야 좋을까? 상황과거의 코드를 보고 의문이 들었고, 더 좋은 방법을 찾아내어 기록합니다.if(!Arr.find()) { // next job}위와 같이 코드가 짜여있었고, if 문을 사용해 배열 내부에 원하는 요소가 있는지 확인하고 있다면 다음 작업을 진행하려는 과정입니다. 여기서 왜 findIndexOf()가 아닌 find()를 사용했는가에 대한 의문이 들었습니다. Array.find() vs Array.findIndexOf()find(): 내부에 요소가 있다면 요소를 반환하고, 없다면 undefined를 반환findIndexOf(): 내부에 요소가 있다면 인덱스를 반환하고, 없다면 -1을 반환위 코드에서 사용한 조건문을 사용한다면 js에서 falsy 한 값들로 인해 오류가 발생할 수 있습니다. 그렇기에 둘 중 하..
[무료 웹 빌더] 리틀리 간단하게 웹 사이트를 만들고 제작자의 상품 및 재능 판매 가능 모바일 최적화 사이트 참고https://start.litt.ly/https://litt.ly/start_now
[JS 꿀팁] label 코테를 진행하다가 발견한 코드에서 처음 보는 문법을 발견했고, 찾아보니 대박이라 기록하고 공유합니다. 대박까지는 아니었고 신기해서 남겨둡니다. 실제로 사용되는 문법은 아니니 이런게 있구나 정도만 알고 있으면 될 듯합니다. 참고https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/label
[용어] BOM(Browser Object Model) Browser Object Model의 약자로 브라우저가 제공하는 추가 객체를 의미합니다. DOM(Document Object Model)과 달리 표준이 없어 브라우저가 제공하고 싶은 기능을 제공해 줄 수 있습니다. 현대 브라우저는 비슷한 기능을 제공합니다. 가장 상위 객체로는 브라우저 전역 객체로 사용되는 window가 있습니다.windowscreenlocationhistoryalert(), confirm()navigatorBOM은 브라우저가 기능을 제공하기 위한 객체입니다. 참고https://en.wikipedia.org/wiki/Browser_Object_Modelhttps://ko.javascript.info/browser-environmenthttps://www.w3schools.com/js/j..
[package error] @atlaskit/codemod-cli 패키지 No codemods available. Please make sure you have the latest version of the packages you are trying to upgrade before running the codemod 에러 react-beautiful-dnd를 pragmatic-drag-and-drop으로 마이그레이션 하는 과정에서 에러가 발생했습니다.  The codemod client doesn't appear to give an option for adoption-from-rbd-13 · Issue #154 · atlassian/pragmatic-drag-and-dropnpx @atlaskit/codemod-cli --parser {tsx|babylon} --extensions ts,tsx,js I am getting this message 📚 Atlassian-Frontend codemod library @ 0.26.3 📚 No codemods available. Please make sure you have t..
[Node] how to update node?(노드 최신 버전 업데이트) windows 쉬운 방법공식 사이트에 들어가서 새로운 버전의 .msi를 다운로드하고 실행시켜 설치하면 끝입니다. 설치가 끝나면 cmd 창에  node -v  명령어를 실행하면 설치된 node의 버전이 출력됩니다.조금 복잡하지만 유연한 방법1. nvm-windows: windows 환경에 맞게 개발되어 안정적인 도구로 fnm보다 느리지만 windows 내에서 충분한 실행 속도를 제공합니다. 방대한 커뮤니티가 형성되어 있어 문제 해결에 도움을 받을 수 있습니다.2. fnm: rust 언어로 개발되어 nvm-windows보다 빠른 속도를 제공합니다. 크로스 플랫폼을 지원해 다양한 환경에서 실행시킬 수 있습니다. 커뮤니티가 확장 중이지만 nvm-windows에 비해 부족합니다. 결론현재는 노드를 업데이트하려는 이유는 크로스 ..
[Node] how to install nvm-windows(nvm windows 설치) 설치설치하시기 전에 기존에 설치되어 있는 node는 전부 삭제하시고 설치하셔야 합니다. 설치의 경우 github release 페이지에 가서 원하는 버전을 다운로드하시면 됩니다. 설치에 대한 설명은 다음 페이지에 나와있습니다. 영어가 읽기 싫고 어떤 것을 다운로드해야 할지 모르겠었던 저와 같은 사람들을 위해 기록합니다.release 페이지에서 원하는 버전의 nvm-setup.exe를 다운로드합니다. 다른 거 다운로드하실 필요가 없습니다.실행합니다. 순서대로 '동의 > next' → '원하는 설치 위치 설정(나중에 삭제도 여기서 합니다.)' → 'nvm에서 제공하는 여러 버전을 저장하는 위치 설정' → '데스크톱 알림(읽어보시고 필요한 알림만 체크하세요)' → '기타 정보 안내 메일 입력(생략 가능)' →..