나의 블로그

GOALReact를 사용하여 컴포넌트의 태그를 클릭했을 때 Login.jsx로 이동하도록 설정하기=> React Router 사용=> 라우팅을 설정하여 클릭 시 Login.jsx 컴포넌트를 렌더링하기1. React Router 설치npm install react-router-dom2. 라우터 설정// index.jsimport React from 'react';import ReactDOM from 'react-dom/client';import './App.css';import App from './App';import { BrowserRouter as Router } from 'react-router-dom';const root = ReactDOM.createRoot(document.getEleme..

프로젝트 생성Node.js 최신 버전 설치Visual Studio Code 설치미리 생성해둔 폴더 오픈 "File" → "Open Folder..."React 프로젝트 생성"View" → "Terminal"에 npx create-react-app 프로젝트명 입력진행할 것이냐고 물어보면 y 입력npx : 라이브러리 설치 도와주는 명령어 (nodejs 설치가 되어야 이용가능)create-react-app :  React 세팅이 다 된 boilerplate를 만들기 쉽게 도와주는 라이브러project_01 : project_01 라는 이름이 프로젝트를 만들것이다. 프로젝트 생성 중 오류 발생  프로젝트 오픈 및 탐색"File" → "Open Folder..." →  project_01 폴더 선택  node_m..

Node.js 미설치npm 디렉토리 미생성 Node.js 설치가 되어있지 않음Node.js 설치하여 오류 해결npm이 C:\Users\my\AppData\Roaming\npm 디렉토리를 찾지 못함 npm이 제대로 설치되지 않았거나 디렉토리 구조가 변경된 경우에 발생1. npm과 Node.js 설치 확인터미널이나 명령 프롬프트에서 위 명령어를 입력명령어들이 버전 번호를 반환하지 않는다면, Node.js 다시 설치Node.js를 설치하면 npm도 함께 설치됨2. 누락된 디렉토리 생성관리자 권한으로 명령 프롬프트 열기다음 명령어를 입력하여 누락된 디렉토리 생성디렉토리를 생성해도 문제가 해결되지 않으면,npm 재설치npm install -g npmnpm 캐시 정리npm cache clean --force Nod..