깃랩에서는 ssh 키를 기입해주어야된다. 한번 더 입력cat ~/.ssh/id_rsa.pub입력하면 키값이 나오고 해당 키 값을 gitlab에 붙여넣으면된다!

ReactDOM.createPotal 사용 시 해당 에러가 뜨면서 document.getElementById 를 읽지못했다.해당 에러를 수정하려면 ! 를 붙여주면 된다타입스크립트는 document.getElementById("modal-root") 가 null 일 수

Error message "error:0308010C:digital envelope routines::unsupported" 라는 에러는 노드 모듈이 적합하지 않아서 (지원되지 않는 기능들이 존재하기 때문에) 뜨는 문제이기 때문에 노드 버전을 낮춰주면 간단하게 해결된다

👉 next.config.js 👉 package.json 👉 .prettierrc 👉 tsconfig.json 👉 .babelrc 👉 .eslintrc.json

유데미 강의를 듣던 중 npm start가 제대로 실행되지 않는 현상이 발생했다.thow err 라는 문구와 함께 밑에 경고메세지들이 출력되었음.간단히 보니 node 버전 업데이트 사항과 직결된 문제였다. (이래서 안전한 버전을 사용하는 것이 좋다)package.jso

팀단위 프론트 작업중👉 에러사항를 실행했는데 Need to specify how to reconcile divergent branches. 라는 에러가 발생하면서 pull 작업이 제대로 진행되지 않았다.이런 경우는 충돌나는 부분이 있고 pull 을 제대로 진행할 수

\* nvm 설치 진행sudo curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash \* nvm 버전 확인(제대로 설치되었는지)nvm --version \* 설치된

제플린이 업데이트를 진행하면서 계속해서 세션만료가 뜨면서 로그인이 되지않는 현상이 일어났다.이런경우 제플린 캐쉬들을 지워주면 쉽게 해결된다상단 프로필 메뉴에서 로그아웃Zeplin Mac 앱 종료Finder를 열고 상단 메뉴에서 "이동 > 폴더로 이동..."을 선택합니다

api가 필요한 경우가 매우매우! 많다... 결국 오픈 api 를 활용하거나 직접 배우는게 가장 좋다.직접 배우는게 정말 도문이 될 것같지만, 아직 프론트도 익숙하지 않은데 api까지 손대면 정말 큰일날것 같아서 , 공공데이터 포털을 활용해보기로 했다!https&#x3

깃 초기세팅에 맞게 해봤지만 ㅠㅠ 도무지 뭐가 문젠지 몰라서 서칭해보니 데이터 유실문제때문에 git push --set-upstream origin main 가 먹히지 않는거라고 한다 git push -u origin +main 를 해주면된다고 한다.오류 해결 끝!

분명 종속성 문제인데 개발을 하다보면 작업하다 중간에 버전문제때문에 열받는 경우가 너무 많다...npm install --forcenpm install --legacy-peer-depsnpm config set legacy-peer-deps true버전이 달라 종속성에

mac은 기본적으로 특정 버전 이상이 되어야 설치 및 실행이 가능하기 때문에 윈도우 컴을 사용하게 되었다. (mac 홈브류 설치시 지속적으로 에러가 발생한다면... 새로 사야 한다는...ㅎㅎㅎ)현재 버전이 아닌 LTS버전을 다운로드 받는다. (최신버전은 공식버저이긴 하

구글에서 제공해주는 squoosh 사이트를 활용해 기존 이미지를 웹이미지로 변환하여 이미지사이즈를 최적화시켜줄 수 있다.https://squoosh.app/해당 squoosh 사이트를 활용하면오른쪽 하단에 축소한 퀄리티의여부와 사이즈 여부가 나타난다.기존 kB

여러이미지나 다중이미지 또는 영상을 사용할경우, 스크롤에 따라 감지하는 방법은 너무나도 원초적인 방법이라 오히려 최적화된 화면구현에 방해가 될 수 있다.이럴때 사용하는 것이 바로IntersectionObserver라는 기능이다.IntersectionObserver는 뷰

모든페이지에서 여러가지 라이브러리가 전부 필요하지 않다.라이브러리는 많은 데이터를 쓰게되고, 렌더링시간이 더 오래걸리기 때문에 페이지별로 라이브러리를 나눠서 사용해주는것이 최적화에 용이하다.페이지를 로드하다보면 왜 ?뭐 때문에? 로딩이 오래걸리는지 의문이 들때가 많다.

말 그대로 '게으른 이미지'를 뜻한다!즉, 서버나 사이트가 실행될 때 모든 이미지들을 한번에 불러오는 것이 아닌, 페이지 렌딩에 따라 천천히 불러오는 방식이다.이미지 최적화를 사용하면 초기 진입시 유저가 페이지를 더 빨리 접할 수 있고, 데이터의 낭비를 줄일 수 있다.

수많은 에러를 접하면서 그리고 그 해결과정을 겪으면서, 스스로가 조금 더 성장했단 것에 뿌듯함과 욕심이 더 생기기 시작했다. 처음엔 전공자도 아닌 쩌리가 뭘 할 수 있겠냐는 식의 무시가 싫어서 더 찾아보고 파헤치고 노력했던 건데, 어느순간 '무시'가 '인정'으로 바뀌었

깃 클론작업을 하던 중npm ci를 눌렀을 뿐인데 갑자기 설치중 오류가 났다node-sass npm ERR! command failed해당 오류는 sass 버전이 호환되지 않아서 일어나는 문제라고 하기에 node를 새로 설치하거나 그냥 node-sass 를 업데이트 해

이메일 (@) 형식을 체크한는 정규식 표현정규식 표현을 regEmail에 담아준 후 test를 활용해 이메일의 유효성을 검사해주면 된다

scroll-behavior 항목에 smooth를 넣어주면전체 스크롤이동 화면이 부드럽게 이어진다.예시>