무럭무럭

웹 페이지에 줌/이동 가능한 지도(인터랙티브 지도) 를 넣고 싶은데,카카오 지도 JS SDK(키 발급) 방식이 부담스럽고 “간단히 지도만” 넣고 싶어서카카오 RoughMap을 React에서 안정적으로 렌더하는 방법을 정리1) 정식 API(JS SDK) vs 지도 퍼가기(RoughMap) 차이✅ 정식 지도 API (JS SDK / REST API)카카오 Developers에서 앱 생성 → JS 키 발급 필요지도에 마커/오버레이/이벤트/좌표 검색/동적 제어 등 커스터마이징 가능대신 초기 셋업(키/도메인 등록/CORS 등)이 필요하고 구현 난이도가 올라감✅ 지도 퍼가기 (RoughMap / embed)카카오맵에서 “공유/퍼가기”로 생성된 코드를 넣으면 끝보통 키 발급 없이도 동작하는 케이스가 많음장점: 구현..

Node.js 설치 Vite를 사용하기 위해서는 먼저 Node.js가 설치되어 있어야 한다.nodejs.org에서 LTS 버전 다운로드 및 설치설치 후 터미널(또는 명령 프롬프트)에서 버전 확인node -vnpm -v Vite로 React 프로젝트 생성 원하는 작업 폴더에서 터미널을 열고, 아래 명령어를 실행npm create vite@latest my-vite-app -- --template reactmy-vite-app : 생성할 프로젝트 폴더 이름 (원하는 이름으로 변경 가능)--template react : React 템플릿을 사용하겠다는 의미 (TypeScript를 사용하고 싶다면 --template react-ts도 가능) 프로젝트 폴더로 이동 & 패키지 설치 cd my-vite-app..

React로 프로젝트를 시작할 때 예전에는 거의 무조건 **Create React App(CRA)**를 사용했지만,요즘은 많은 개발자들이 Vite로 넘어가고 있는 추세그래서 Vite와 CRA가 무엇인지, 어떤 차이가 있는지, 그리고 왜 Vite를 선택하게 되는지 개념 위주로 정리 해보기React Vite란? Vite는 빠르고 가벼운 프론트엔드 빌드 도구최신 브라우저의 ESM(ECMAScript Modules)를 적극적으로 활용해서, 매우 빠른 개발 서버와 최적화된 번들링을 제공React 프로젝트에서 Vite를 사용하면:개발 서버가 거의 바로 실행되고,코드 수정 시 **HMR(Hot Module Replacement)**로 변경 사항이 즉시 화면에 반영되며,빌드(배포용 번들) 속도도 매우 빠르게 처리됩니..