오랜만에 블로그에 글을 작성하기로 맘을 먹었는데 하나를 작성하고 나니 다른걸 작성하기가 너무 귀찮다. 쓸까...말까...설명 작성이 귀찮다... 근데 샘플은 있다. 일단 내 자신이 설명 글을 작성할 맘이 생길때까지... 깃 저장소에 저장되어있는 샘플을 보시길... 껄껄... https://github.com/baobao-jane/nextjs-shaka-player-example GitHub - baobao-jane/nextjs-shaka-player-example Contribute to baobao-jane/nextjs-shaka-player-example development by creating an account on GitHub. github.com 오랜만에 휴가내고 쉬는 날이니 게임을 하러 가..

들어가기전에 앞서... 기존 회사에서 관리하는 프로젝트들은 패키지 매니저를 yarn classIc을 사용하였다. 여기서 yarn classic 은 yarn 의 1.x 버전이라고 보면 된다. 본격적인 마이그레이션 방법에 대해 설명하기 전 왜 yarn berry 로 버전 업을 했는지에 대해서 설명하려고한다. 굳이 볼 필요는 없다. yarn classic과 차이점 yarn berry는 종속성을 설치하고 해결하기 위해 PnP(Plug'n'Play)라는 기능을 사용한다. 특히, node_modules 폴더를 사용하지 않는 것이 주요 차이점 중 하나이다. node_modules은 폴더(파일 시스템)을 이용하여 의존성을 검색하며 굉장히 비효율적으로 동작하는데, 이는 yarn classic 뿐만 아니라 npm에서도 해..

회사에서 맡아 운영하는 서비스에서 채널톡을 도입하였다. 공식문서에 보면 자바스크립트로 밖에 되어있지 않아서 도입을 하려면 커스텀훅을 사용해서 도입해야했다. 구글링을 했지만 딱히 뭔가 확 오는 방법이 없어서 직접 커스텀훅을 만들기로 결정! ts 파일을 hook 디랙토리에 생성 후 일단 공식 문서에 있는 인터페이스들을 긁어왔다. 그 후 스크립트를 function으로 작성 후 채널톡에서 제공하는 기본 함수들을 타입스크립트로 변경하여 적용하였다. declare global { interface Window { ChannelIO?: IChannelIO; ChannelIOInitialized?: boolean; } } interface IChannelIO { c?: (...args: any) => void; q?:..

프로젝트를 정리하기 위해 맥북에 개발환경 설정을 하다가 나중에 사용하기 위해 설치 방법을 정리. Homebrew 설치 맥에서 개발환경 세팅을 할 때 가장 먼저 설치해야 할 패키지 관리 프로그램이다. Homebrew 홈페이지에 접속을 하면 바로 밑의 명령어가 뜬다. 혹시 궁금하면 접속해보자 -> https://brew.sh/index_ko 터미널을 켜고 터미널에 붙여넣기한다 . /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" node, npm 설치 homebrew를 설치 후 아래 명령어를 통해 설치한다. brew install node 설치가 완료되면 제대로 설치가 되었는지 버전..