본문 바로가기

오늘의 커밋

(41)
230821 SendBird SDK v3 -> v4 마이그레이션하기 오늘의 할 일 비용 절감을 위해 센드버드 버전 업데이트를 진행하고자 했다. 센드버드는 나름대로 메이저한 솔루션이고, 상세한 가이드 문서가 있어서 솔직히 별로 안힘들 줄 알았다. 그래서 해야할 일은 센드버드 v3 → 센드버드 v4로 바꾸기 이다. 날 두렵게 한 가이드 문서의 글 모든 마이그레이션 작업이 완료되고 모든 오류가 수정될 때까지 센드버드 채팅 SDK v4는 앱이 컴파일되지 않을 수 있습니다. 모든 차단 오류를 수정한 후에는 경고를 제거하고 SDK를 앱과 다시 정렬하는 추가 작업이 필요할 수 있습니다. 이 작업에는 넉넉한 시간을 허용하는 것이 좋습니다. ... 하지만 회사에서 까라면 까야지. 일단 시작 이것이 메뉴얼인데, 살펴봐도 이해가 잘 안되는 것들이 있었다. v3 → v4 마이그레이션은 npm..
230818 왜 build 후 실행이 안될까 개요 npm run dev로 지금까지 작업한 내용이 정상적으로 동작하는걸 확인했음. 실제 개발서버에 배포하고자 // 빌드 npm run build // 생성된 정적 코드 실행 pm2 reload index 위 작업을 실행했는데 에러 발생 Named export 'useToast' not found. The requested module 'vue-toast-notification' is a CommonJS module, which may not support all module.exports as named exports. 이 오류의 핵심은 이부분이다. 이번에 추가한 toast 라이브러리는 CommonJS 형식의 라이브러리인데, 플러그인에 등록하여 전역으로 사용하고자 했다. 그런데, 웹팩이 빌드되면서, 코..
230817 nuxt에서 빠르게 기능 추가하기(안빠름) 오늘은 이전에 만들어놓은 임직원 조회 화면에서 추가적으로 이용정지, 이용가능 api를 추가하는 기능을 작업했다. 이용정지, 이용가능 상태값에 따른 ui 변경과 api 호출을 작업했는데, 임직원 조회 화면과 화면의 data-table에서 파생되는 dialog에 거의동일한 기능이 필요했다. vue3특) setup으로 data, method, function, style을 각 기능별로 나눠놓을 수 있음. 이기 때문에, 이용정지에 필요한 로직끼리 모아놓고 빠르게빠르게 복붙할 수 있었다. 다만 생소한 기능(특히 vuetify)으로 개발하느라 검색하는데 시간 많이 때려박아서 딱히 효율은 안나온 것 같다. chatGPT가 없었으면 이 개같은 vuetify로 어떻게 개발할 수 있었을까? 후 그리고 남는 자투리 시간에 ..
230816 nuxt에서 quillJS 이용하여 텍스트에디터 기능 구현하기 개요 현재 전문가 콘솔 편집기 채팅방에서 노션에서 복사한 텍스트를 붙여넣기하면 일부서식이 삭제되는 문제가 있음 원인 현재 편집기 채팅방에서 사용중인 quillJS는 노션의 문단번호, 글머리표를 텍스트가 아닌 서식으로 인식하고, 아래와 같이 서식은 자체적인 규칙으로 생성된 delta object로 처리함 그럼 오늘의 미션 드릴게요. 가장 최근 경험하고 있다고 생각되는 인지적 오류는 무엇인가요? 위의 인지적 오류를 경험하는 상황은 어떤 순간인가요? 어떤 이유로 위의 상황을 인지적 오류라고 생각하나요? 현재 quill Editor에서 허용된 서식은 4가지 list(문단번호, 글머리표)는 허용되지 않았기 때문에, 복사→ 붙여넣기해도 화면에 렌더링 되는 과정에서 삭제됨 해결방법 quillJS에서 list를 허용..
230814 vue3에서 typescript 사용하기, vuetify 사용하기, 양방향 바인딩 오늘의 해야할 일 이거를 이렇게 만들어야 한다. 어떻게해야하나. 헤더에 버튼을 추가할 컬럼을 추가해야한다. slot 을 이용하여 추가 컬럼을 넣는다. 라익디스 슬롯이랑 컬럼 명을 매핑시켜주면 된다. 일단 버튼은 만들었다. 다음은 버튼에 이벤트를 넣어야 한다. 이벤트는 컴포넌트 기준으로 아래와 같이 동작한다. Button(v-btn) → DataTable(v-data-table-server) → page 처음에는 Button 컴포넌트에 props으로 클릭 이벤트 함수를 전달하여 구현하고자 했는데, 생각해보니 @click 디렉티브는 이벤트 버블링의 규칙이 적용되므로 굳이 함수로 전달하는 과정이 필요하지 않았다. 그냥 상위 컴포넌트에서 @click 디렉티브를 사용하여 이벤트를 구현하면, 자연스럽게 클릭 이벤트..
22.02.14 랜섬웨어에 걸리다. 얌전히 모셔놓았던 데이터베이스를 다 털렸다. 이유는 간단하다 내가 몽고디비 외부 접속 포트를 열어놓았고, 몽고디비에 별다른 인증을 걸어놓지않은것이다. 복구해야지 뭐 별수있나 나의 무지함과 안일함을 탓해야지
docker 튜토리얼 도커가 리눅스 환경에 설치되어있는것 기준 docker ps 현재 도커 상태 확인 docker ps -a 현재 꺼져있는거까지 모든 도커 확인 docker images 현재 설치된 이미지 확인 docker run hello-world docker run -it ubuntu /bin/bash 우분투 이미지 설치하고 터미널로 이동하는 명령어 docker exec -it doodoo /bin/bash 이미 존재하는 컨테이너 실행하는 명령어 docker run -h doodoo1 --name doodoo2 -v ~/doodoo:/workspace -dit node /bin/bash 호스트 이름 doodoo, root에 표시되는 이름 doodoo, 작업 위치 ~/doodoo:/workspace 인 node 환경의 터..
2021.04.13 오늘의 커밋. 크롬에서 dragEnter 이슈 캘린더에 스케줄 영역을 드래그하여 날짜에 올리면 해당 날짜로 스케줄의 기간을 변경하는 기능 을 구현하던 도중 이슈가 발생했다. 드래그 하는 즉시 이상한 날짜로 이동한 것이다. 확인을 해보니 제한적인 상황에서만 해당 문제가 발생하고 있음을 확인했다. 결함 내용 : display:grid인 element에 dragEnter, dragLevae는 제대로 동작하지 않는다. 1. 윈도우 운영체제에서만 해당 현상 발생 2. 크롬기반 브라우저에서만 해당 현상 발생 3. 디스플레이 -> 배율 및 레이아웃이 125%일때만 발생(일반적으로 노트북에서는 125%가 디폴트다) 날짜 영역에 dragEnter, dragLeave 이벤트가 걸려있고 스케줄(grid) 영역에 dragStart, dragEnd 이벤트가 걸려있다 스케줄..