한 줄 설명vite로 배포중인 리액트 프로젝트 모바일로 localhost 접속해서 확인하기문제 상황웹앱을 개발하면서 모바일 환경에 맞춰 화면을 구성하다 보니, 계속해서 개발자 도구를 이용해 모바일 화면을 확인해야 했다. 이 과정이 상당히 번거로웠고, 특히 아이폰의 노치 때문에 실제 배포된 화면을 직접 핸드폰으로 확인하고 수정해야 했다. 그래서 개발 중인 localhost를 내 핸드폰에서 바로 확인할 수 있으면 좋겠다고 생각하게 되었다.  시도했던 첫번째 방법일단 검색해서 나온 첫번째 방법으로 시도했다기존에는 npm run dev로 했다면, 뒤에 --host를 붙인다(-가 두개다)npm run dev -- --host또는vite --host로 개발 서버 실행해준다그러나.. 트러블 슈팅근데 나는 안 됐다. ..

더보기진로를 프론트엔드로 정하고 공부했었다.그동안 프론트엔드를 공부하면서 노션에 정리해둔 개념을 블로그에 올리고자 한다대부분 혼자 공부한 내용이라 틀린 부분이 있을수도 있다. 댓글로 알려주시면 바로 고치겠습니다!   컴포넌트란?컴포넌트는 재사용 가능한 코드조각이다(UI의 함수)엘리먼트와의 차이는 엘리먼트는 컴포넌트에 포함되어 있다 사용자 정의 함수=컴포넌트둘이 같은 말이다 리액트를 통해 사용자 정의 함수를 만들어보자이때 사용자 정의 함수는 대문자로 작성한다    사용자 정의 함수(컴포넌트) 만들기함수니까 function을 사용하여 정의하자  이렇게.  그리고 이 함수를 가져다 쓸 때는이런식으로 작성하면 된다  코드 예시컴포넌트 정의를 하고 function Header() { return ( ..

🎲 문제 상황vs code를 통해 react를 설치하려고 했는데 에러가 '우수수' 쏟아졌다.모두 동일하게npm ERR! code EEISTnpm ERR! syscall mkdir 등등이 떴다일주일 내내 react를 설치하려고 구글링을 해서, 해결 방법 두가지를 찾았다 🎲 해결 방법1. npm modules 삭제가 가능할 때npm install EEXIST: file already exists 에러가 날때 사용할 수도 있는 방법이다 1-1 node_modules 삭제 비주얼 스튜디오 왼쪽에 있는 node_modules 를 삭제(delete)해준다  1-2 npm 재설치아래 코드로 npm을 재설치 해준다npm install npm audit fix  끝!!!! 이면 좋겠지만,,,       나의 경우 n..