본문 바로가기
반응형

전체 글81

기본 노드(global nodejs) 버전 변경 하기 node js 버전 확인 및 변경하는 방법은 아래 포스팅을 참고해주세요 NVM을 이용한 Node JS 버전 변경하기 Node JS 버전 확인하기 $ node -v NVM 설치하기(brew 이용하여 설치 https://brew.sh/index_ko) brew를 설치한 후 아래 코드 실행 $ brew install nvm NVM 환경변수 설정하기(zsh) $ vi ~/.zshrc zshrc 설정 파일.. hyung1.tistory.com NVM으로 노드 기본 버전 변경하기 nvm alias default v12.22.1 명령어를 이용하여 사용하고자 하는 노드 버전을 설정해주면 새로운 터미널을 열 때마다 새로 설정해둔 노드버전으로 적용된다 2022. 3. 29.
에러메시지 error: Command failed with exit code 1 프로젝트 시작시 발생한 에러 error: Command failed with exit code 1 1. yarn 으로 생성된 node_modules, yarn.lock 지우기 rm -rf node_modules rm -rf yarn.lock 2. yarn 공유 캐시 파일 지우기 yarn cache clean 3. yarn 재설치 후 시작하기 yarn yarn start or 1. yarn 업데이트 후 yarn 시작하기 yarn update yarn start 2022. 3. 28.
NVM을 이용한 Node JS 버전 변경하기 Node JS 버전 확인하기 $ node -v NVM 설치하기(brew 이용하여 설치 https://brew.sh/index_ko) brew를 설치한 후 아래 코드 실행 $ brew install nvm NVM 환경변수 설정하기(zsh) $ vi ~/.zshrc zshrc 설정 파일에 아래 코드를 복붙한다 export NVM_DIR=~/.nvm source $(brew --prefix nvm)/nvm.sh 아래 명령어로 환경변수 파일 적용한다 $ source ~/.zshrc NVM 설치 확인하기 $ nvm --version // or $ nvm -v 특정 버전의 node.js 설치하기 $ nvm install 16.13.0 설치된 특정 버전의 node.js 사용하기 먼저 설치되어 있는 node.js 버전.. 2022. 3. 21.
React-query 시작하기 새 프로젝트에 React에서 비동기 로직을 쉽게 다루게 해주는 라이브러리 React-query를 사용하기로 결정이 났다 그래서 React-query를 공부하면서 블로그에 끄적여본다 개요 React Query는 종종 누락된 데이터 가져오는 라이브러리로 설명되지만, 보다 기술적인 용어로 말하면 React 애플리케이션에서 fetching(가져오기), caching(캐싱), synchronizing and updating server state(동기화 및 서버상태 업데이트)를 수행한다 기본 코드 import { QueryClient, QueryClientProvider, useQuery } from 'react-query' const queryClient = new QueryClient() export defa.. 2022. 3. 16.
크리스마스 트리로 크리스마스 분위기 제대로 내보자! 트리 구매 추천! 크리스마스 트리로 크리스마스 분위기 제대로 내보자! 트리 구매 추천! 🎄 따뜻하고 행복한 크리스마스를 위한 특별한 트리 몇가지를 소개합니다 🎄 하우쎈스 크리스마스 트리 풀세트 9% 35,920원 32,660원 아웃팅 크리스마스트리 전구 장식 풀세트 1% 33,900원 33,400원 이즈휴 데이홈 LED 리프 조명 벽트리 패키지 39% 37,140원 22,620원 뷰티풀데코센스 로맨틱 벽트리 6단 + 오너먼트 세트 44% 35,000원 19,460원 조아트 LED 감성트리 + 원형털러그 38% 65,200원 40,240원 인크리코 앵두전구 크리스마스 스티커 벽트리 세트 31% 30,400원 20,780원 해당 카드를 클릭하면 구매 및 상세페이지로 이동합니다~ 2021. 12. 13.
퍼블리셔와 프론트엔드 개발자가 알면 좋은 추천 크롬 확장프로그램! 해당 크롬 확장프로그램은 내가 써보고 괜찮다고 생각했던 것들 위주로 작성함~ 이 밖에도 추천하고 싶은 크롬 확장프로그램이 있다면 댓글에 남겨주세요😉 크롬 웹 스토어 바로가기 CSSViewer CSS뷰어는 간단한 CSS 속성 뷰어 확장프로그램! 마우스를 올린 영역의 폰트, 텍스트, 색상, 박스, 위치 등에 대한 정보를 보여준다 간단하고 빠르게 CSS 속성을 볼 수 있어 아주 유용한 확장프로그램~ CSSViewer A simple CSS property viewer. chrome.google.com HeadingsMap 페이지 Heading 구조를 보여주는 확장프로그램! 이 확장프로그램은 전에 한번 소개글을 쓴 적이 있으니 자세한 설명은 해당 글에서 확인~🙂 (HeadingsMap 소개글로 이동) Headi.. 2021. 12. 10.
SSR vs CSR [SSR] - 서버에서 랜더링을 끝내고 데이터를 HTML 파일로 내려주는 방식 - 초기 로딩 속도가 빨라 사용자가 컨텐츠를 빨리 볼 수 있다 - 서버에 매번 요청을 하기 때문에 서버 부담이 커진다 - 매번 페이지를 요청할 때마다 새로고침 되기 때문에 사용자 UX가 떨어진다 - SEO(검색엔진 최적화)가 가능하다 [CSR] - 최초 요청시에 HTML과 CSS, Javascript 등 각종 리소스를 받아와 서버에 데이터만 요청하고 자바스크립트로 뷰를 컨트롤하는 방식 - 초기 요청 때SSR보다 많은 리소스를 요청하기 때문에 빠르게 랜더링하기 하여 사용자 UX가 뛰어나다 - 서버에 요청하는 횟수가 적기 때문에 서버 부담이 덜하다 - 모든 HTML과 CSS, Javascript 등 각종 리소스가 로드될 때까지 기.. 2021. 8. 26.
HTML input number 화살표를 없어보자! input number를 쓰면 우측에 숫자를 증가/감소 해주는 화살표가 나온다 디자인적으로 우측 화살표가 이쁘지 않아서 없애고 싶다면 CSS에 아래 코드를 추가하면 된다! input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; } 출처 https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp 2021. 8. 8.
랜선여행으로 해외로 떠나보자✈️ (feat. 윈도우스왑 windowswap) 코시국이라 해외여행을 못 간지도 꽤 된 듯 코시국 전에는 그래도 1년에 한 번씩은 다녀왔었던 해외여행이었는데 못 간 지 꽤 되다 보니 슬슬 몸이 근질근질.. 해외여행이 너무 마렵다 마려워!!! 그래서 간접적으로라도 해외여행을 가봐야지 하고 구글맵 거리뷰로 떠돌아다녔었는데 최근에 아주 좋은 서비스 발견!!! 어느 나라 어느 도시 누구 씨의 집 창문 뷰를 내 방에서 감상할 수 있는 서비스, 윈도우스왑(windowswap)이다 아래 링크를 타고 가면 윈도우스왑 링크 및 이용 후기가 있으니 궁금하다면 아래 링크 고고~ 코시국에는 랜선여행이지! 내방에서 떠나는 해외여행! windowswap(윈도우스왑) #코시국 #랜선여행 #언텍트여행 #해외여행 #윈도우스왑 #windowswap 코시국에는 랜선여행이지! 내방에서 .. 2021. 7. 15.
반응형

티스토리툴바