JS 4

WSL에 Electron 설치할 때 팁!

WSL에서 Electron을 설치하려고 하면 chrome-sandbox와 관련한 권한 에러가 계속 뜹니다. 어찌어찌 고쳐보려고 해도 각종 문제가 교차되서 일어나는 지라 해결방법이 없는 줄 알았는데. 의외로 쉬운 해결방법이 있습니다. 바로 설치는 cmd에서 하고 실행만 WSL로 하면 된다는 말씀! 예제로 electron-quick-start를 설치해보겠습니다. WSL에서 먼저 WSL을 켜서 프로젝트 폴더로 이동해 다음과 같이 입력합니다. git clone https://github.com/electron/electron-quick-start 이렇게 electron-quick-start를 클론하고 나서 WSL을 끄고 cmd를 켭니다. CMD에서 cmd에서 프로젝트 폴더 내의 electron-quick-sta..

우분투 electron 실행 시 libX11-xcb.so 에러

야심차게 electron으로 데스크탑 앱을 만들어야겠다고 설치하려는 순간! error while loading shared libraries: libX11-xcb.so.1: cannot open shared object file: No such file or directory 이런 식으로 에러가 날 때가 있습니다. electron은 chromium을 쓰는데 관련 라이브러리가 없어서 생기는 문제입니다. 바로 라이브러리를 깔아서 상콤하게 해결해봅시다. sudo apt-get install -y gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 l..

node.js & npm 업데이트하기

오늘 해볼 것은 node.js와 npm을 업데이트하는 일입니다. 좀 더 쉬운 방법이 있으면 좋겠다 싶으면서도 어쩔 수 있나요. 쓰려면 해야지...ㅋ 1) node.js 업데이트 sudo npm cache clean -f sudo npm install -g n sudo n lts node -v 간단하쥬? 첫번째 코드는 npm의 캐시를 삭제하는 코드입니다. 두번째는 n이라는 node.js 설치 모듈을 설치하는 코드입니다. 세번째 코드는 바로 node.js 최신버전을 설치하는 코드입니다. 만약 안정적인 버전을 설치하고 싶으시면 lts 대신 stable을 입력하시면 되겠습니다. 마지막으로 설치하고 나서 node -v로 버전 체크 한번 해주시면 되겠습니다. 2) npm 업데이트 이번에는 바로 npm을 업데이트 하..

쉽고 가벼운 슬라이더, slick.js를 사용해보자

1. 시작 이번에 외주 작업을 하면서 홈페이지에 슬라이더를 달아야 했습니다. 순수하게 css를 쓰거나 javascript로 직접 짤 수도 있지만, 대 4차 산업혁명 시대. 대부분의 소스들은 이미 온라인에 있는데 굳이 불필요한 노동을 할 필요는 없겠죠. 클라이언트에서 요구한 슬라이더는 협력기관들의 로고가 자동으로 넘어가는 슬라이더여서, 방식은 carousel에 autoplay를 내장으로 지원하는 라이브러리가 필요했습니다. 그래서 carousel 라이브러리 중 쓸만한 것들은 3가지 정도 후보군에 올렸습니다. 첫째는 Owl Carousel입니다.(https://owlcarousel2.github.io/OwlCarousel2/) Home | Owl Carousel | 2.3.4 Modules and Plugin..