노드 버전의 문제가 계속 일어나서 다시 노드를 재설치하기로 마음을 먹었다.새로운 노드 버전을 설치 전에 nvm을 통해서 노드를 설치하면 노드 버전 관리하기 좋다고 해서 homebrew 설치부터 시작했다.lsbom -f -l -s -pf /var/db/receipts/o

npm ERR! code 1npm ERR! path /Users/...npm ERR! command failednode 버전을 업데이트 하고, 프로젝트를 클론받고, npm install 하는데 에러가 발생했다.검색 해 보니 package.json 파일 안을 수정해야 한

error TS18003: No inputs were found in config file ...기존 프로젝트 안에서 타입스크립트를 설치하는 과정에 오류가 생겼다.분명히 npm install -g typescript를 해서 설치했고, npm typescript -v 버

stack overflowgit remote url 을 변경해야 하는 경우vs code 편집기에 들어가서 remote 위치를 확인한다소스관리 할 레파지토리 주소를 복사해서 붙여넣는다.생성한 레파지토리에 커밋하고 푸쉬한다.

custom hook은 반복되는 로직을 재사용하는 방법으로 꼭 함수명을 use로 시작하고, 그 안에 함수를 작성한다.그 안에 useState, useEffect, useReducer, useCallback 등 Hooks를 사용하여 원하는 기능을 구현한다.다른 페이지에서

클라이언트에서 렌더링을 하는 방식으로 유저가 페이지에 들어오면 클라이언트가 서버로 데이터를 요청한다. 그 사이 빈 html로 먼저 렌더가 되고, 그 후에 서버로부터 데이터를 받아 페이지를 그려낸다. 데이터(HTML, JS)를 받을 때까지 화면은 빈화면만 띄워진다.그래서

검색창에 입력한 검색어 및 키워드를 클릭 시, 최근 검색어에 저장하고 불러오기로컬스토리지에 저장된 검색어들을 배열에 저장하고,브라우저가 모두 랜더링된 상태에서 실행하도록 설정 \* 로컬스토리지에서 배열을 가져올 때는 JSON.parse(localStorage key)로

검색 페이지에서 특수문자 입력 시, 입력한 특수문자 전부 검색 결과 페이지에 받아오기.검색 페이지에서 입력한 검색어를 쿼리로 검색 결과 페이지로 넘겨준다.검색어에 \`\*\*\*cut_query검색창에 입력한 값은 url에 있는 것과 같이 !@그러나 화면에 찍히는 값은

pathname이 일치하면 GNB tab color 유지하기전 글에서 보다시피 GNB에 따른 페이지 이동 시, color 변경은 해결되었지만 문제가 있었다.예를 들어 검색페이지가 있고, 검색결과페이지가 있다면 이 둘 모두 GNB에 있는 검색탭이 변동없이 color가 유

현재 사용자가 어느 페이지에 있는지 표시하기 위해 페이지 이동 할 때마다 GNB color 변경페이지 이동은 Link로, color 변경은 onClick 으로 단순하게 생각했었다.페이지에 머무르는 동안에는 GNB color를 유지해야 하고, 페이지 이동 할 때마다 co

디버깅포트주소

제품 상세 페이지에서 "결제하기" 를 눌렀을 때, 결제페이지로 이동하면서 데이터를 전달해야 한다.다음주 월요일까지 프론트에서 주문정보를 보내서 서버에 저장되고 난 다음에 결제하는 외부 API 호출한 후, 결제를 하고.. 또 결제정보를 서버로 보낼 수 있도록 해야한다..

에러를 읽으면 답이 보인다.그렇지만 어디에 에러가 났는지 정확하게 알 수가 없는 경우도 있다.Link component에 관련해서 에러가 두 번이나 났다.경로가 잘못 지정되면 하기와 같은 에러문구들이 뜬다!.properties of nullLink error이 경우에는

React Router 화면 전환하는 Router CSS 전처리기 Sass SPA 란? single page application : 페이지가 1개인 애플리케이션 페이지 수만큼 html 파일이 존재 (mpa방식)하지만 리액트 프로젝트에서 .html 파일은 1개

리액트 프로젝트를 시작하는데 필요한 개발환경을 세팅해주는 도구 (Toolchain)CRA뿐만 아니라 Next.js / Gatsby 등이 있다.TypeScript 과제를 수행하기 위해 초기세팅을 혼자서 했다.로컬 컴퓨터에서 폴더을 만들어서 react 설치 후 깃허브와 연

구현기능상품수량수정TableBody.js구현 영상최근까지는 functional component를 사용했어서 오랜만에 class component를 쓰려니 헷갈렸다. useState의 편리함을 다시금 알게된..?현재 백엔드서버 없이 추가구현하고 있기 대문에 백엔드에서

동기 비동기

내 깃허브에 잔디가 안심어진 이유 기업협업 나간 이후 약 1달 동안의 잔디가 심어지지 않은 걸 바로 일주일 전에 알았다. 그동안에는 커밋 & 푸쉬를 열심히 했고, 그리고 프로젝트에 잘 반영되었기에 의심하지 않았다. 하지만 한번이라도 봤어야 했다. 의심되지 않았어도

위코드의 2개월과 기업협업 1개월이 끝나 현재 시점에서 되돌아 보는 회고 내가 생각하는 나 다른사람을 배려하고 존중하자 위코드에서의 나 팀원들에게 피해주지말고 책임감을 갖고 적극적으로 참여하자 위코드의 커리큘럼을 잘 따라갈 수 있을까 하는 생각이 제일 컸습니다. 전

Error handling > title / option 을 입력하는 input 창에 값이 안 들어갔을 경우에 비어있는 input창에 Error message 띄우기