본문 바로가기

개발 도구 및 Git 사용법/VSCode, Webstorm 등 개발도구6

VSCode : prettier 환경 설정하기 개요 VSCode에서 Prettier를 설정하는 방법에 대해 알아보겠습니다.  설정방법 1. 플러그인 설치하기   VSCode에서 `Prettier - Code formatter` 플러그인을 install 합니다. 2. VSCode Setting 변경 `Code > Preperence > Setting` 으로 이동합니다. Default Formatter 를 Prettier로 변경합니다.Format On Save 에 체크합니다. 위와 같이 설정하면 파일을 저장할때마다 Prettier가 적용된 결과로 바뀌는 것을 확인하실 수 있습니다.  마무리 오늘은 간단히 VSCode에서 prettier 설정을 하는 방법에 대해 알아보았습니다. 다음번에도 유용한 내용으로 포스팅하겠습니다. 2024. 12. 15.
VSCode vs Webstorm : 개인적으로 둘다 써보고 느낀 장단점 개요 회사에서 WebStorm IDE를 사용해서 쭉 웹개발을 진행해 오다가, VSCode로 개발을 진행해야 되는 상황이 생겼습니다. 사용 이후에는 VSCode가 생각보다 괜찮고 장점도 많아서, 최근에는 계속 VSCode를 통해 개발을 진행하게 되었는데요, 간단하게 몇 가지 VSCode와 WebStorm의 개인적으로 느낀 차이점 간단하게 정리해 보도록 하겠습니다. VSCode 장점 (WebStorm과 비교) 1) 메모리를 적게 차지하고, 파일 검색 속도가 빠르다. Webstorm은 프로젝트를 몇 개만 새창으로 띄워놓아도 금세 메모리가 몇 기가씩 금방 넘쳐버립니다. WebStorm에서 옵션을 통해 메모리를 많이 추가적으로 할당해놓지 않으면 프로젝트 규모가 커질 때 아예 프로그램이 버벅거리는 걸 넘어서 멈춰버.. 2024. 11. 28.
SQLite : Sqlite DB 테이블 Json으로 변환하기 (+ SQLite 개념) 개요 최근에 사이드 프로젝트를 진행하던 도중 SQLite의 DB를 firebase의 firestore DB로 옮겨야 하는 상황이 발생하였습니다. firestore에 DB를 이전하기 위해서는 SQLite로 되어있는 DB를 Json 파일로 변환해야 하는 일이 생겼습니다. 웹에서 여러 SQLite => JSON 변환사이트도 돌려보았지만 에러가 계속 나서 방법을 찾던 중 가장 간단한 방법이 있어서 한번 공유드립니다. (실패한 변환 사이트 => https://mygeodata.cloud/converter/sqlite-to-json) SQLite란? 먼저 SQLite란 무엇인지 간단하게 살펴보겠습니다. SQLite는 서버가 아닌 응용프로그램에 넣어 사용하는 비교적 가벼운 데이터 베이스입니다. PostgreSQL이나.. 2023. 3. 13.
Webstorm : 마지막 개행문자 자동으로 지워지는 옵션 끄기 문제점 WebStorm에서 프로젝트를 진행하던 중에 마지막 개행 문자가 자동으로 지워지는 현상을 발견하였습니다. 파일을 바꾸지 않았는데도 마지막 개행문자가 자동으로 지워지는 바람에 이전 소스코드와 비교했을 때 Git에서 계속 바뀐 파일로 체크되어 불편함을 겪었습니다. 즉 예전 소스코드에서 마지막 개행문자가 있었는데, 소스코드를 수정하거나 단순 저장만 해도 Webstorm에서 마지막 개행문자를 지워주는 옵션 때문에 계속 Diff가 표시된 것입니다. 문제의 소스파일 Show Diff 해결법 아래와 같이 이동하셔서 Preperence > Editor > General > On Save > Remove trailling blank lines at the end of saved files 체크 해제 이렇게 해주시.. 2022. 5. 27.
Webstorm : React의 styled components 플러그인 설치 React에서 Css를 스타일링할때 쓰이는 라이브러리중 Styled Component라이브러리가 유용합니다. 이때 Styled Components를 사용하여 React 컴포넌트에 CSS를 쉽게 디자인 할수 있습니다. 그런데 기본적으로 Styled Component를 사용할때 아래와 같이 WebStrom에서 가독성이 좋지 않습니다. 이때 Webstorm에서 Plugin으로 Styled Components 플러그인을 설치하면 좀 더 쉽게 Styled Components를 사용하실 수 있습니다. 설치방법은 다음과 같습니다. 1. Preference => Plugins => Browse repositories 로 이동 2. Styled Components & Styled JSX 플러그인 설치 3. 설치후 Plu.. 2021. 1. 14.
WebStrom - 메모리 늘리기 WebStorm을 사용하다 보면 메모리가 부족할 때가 많습니다. Node를 개발할 때 terminal로 node server를 돌린다던지, npm으로 webpack-dev-server를 띄운다던지, 전체 코드에서 특정 문자열을 검색한다던지 이러한 무거운 작업을 수행할 때, WebStorm이 버벅거리면서 심지어 멈추거나 재실행을 해야 할 때도 있습니다. 결국 CPU가 WebStorm에 대한 작업 스레드를 처리할 때 시간이 오래 걸린다던지, 아니면 웹스톰에서 메모리를 많이 점유한다던지 하는 이유로 WebStorm이 느려지는데요, 보통 제 생각에는 메모리 문제가 많았던 것 같습니다. 그래서 웹스톰에 대한 메모리를 어떻게 늘리는지 찾아보니 간단하게 WebStrom의 메모리를 늘릴 수 있다는 것을 알게 되었습니다.. 2020. 12. 14.