https://developmii.tistory.com/ 비전공자 개린이는 성장중 (•̀ᴗ•́)و ̑̑ ko Wed, 20 May 2026 15:47:58 +0900 TISTORY 100 develop_mii https://tistory1.daumcdn.net/tistory/8124767/attach/a1b25a4ea214495c93728ae87007b6e8 https://developmii.tistory.com https://developmii.tistory.com/94 웹 페이지에 줌/이동 가능한 지도(인터랙티브 지도) 를 넣고 싶은데,카카오 지도 JS SDK(키 발급) 방식이 부담스럽고  “간단히 지도만” 넣고 싶어서 카카오 RoughMap을 React에서 안정적으로 렌더하는 방법을 정리 1) 정식 API(JS SDK) vs 지도 퍼가기(RoughMap) 차이 ✅ 정식 지도 API (JS SDK / REST API) 카카오 Developers에서 앱 생성 → JS 키 발급 .. Project/Project02.GreenUniv develop_mii https://developmii.tistory.com/94 https://developmii.tistory.com/94#entry94comment Mon, 29 Dec 2025 00:55:50 +0900 https://developmii.tistory.com/92   Node.js 설치   Vite를 사용하기 위해서는 먼저 Node.js가 설치되어 있어야 한다. nodejs.org에서 LTS 버전 다운로드 및 설치 설치 후 터미널(또는 명령 프롬프트)에서 버전 확인 node -v npm -v        Vite로 React 프로젝트 생성   원하는 작업 폴더에서 터미널을 열고, 아래 명령어를 실행 npm create vite@latest my-v.. Project/Project02.GreenUniv develop_mii https://developmii.tistory.com/92 https://developmii.tistory.com/92#entry92comment Thu, 4 Dec 2025 16:19:43 +0900 https://developmii.tistory.com/91 React로 프로젝트를 시작할 때 예전에는 거의 무조건 **Create React App(CRA)**를 사용했지만, 요즘은 많은 개발자들이 Vite로 넘어가고 있는 추세 그래서 Vite와 CRA가 무엇인지, 어떤 차이가 있는지, 그리고 왜 Vite를 선택하게 되는지 개념 위주로 정리 해보기 React Vite란?     Vite는 빠르고 가벼운 프론트엔드 빌드 도구최신 브라우저의 ESM(ECMAScript Modules)를 적극적으.. Project/Project02.GreenUniv develop_mii https://developmii.tistory.com/91 https://developmii.tistory.com/91#entry91comment Thu, 4 Dec 2025 14:03:30 +0900 https://developmii.tistory.com/90 한 줄 요약 예전: Spring Security formLogin() + HttpSession 기반 인증 서버가 세션을 들고 있고, 브라우저는 JSESSIONID 쿠키로만 인증 프론트/백이 한 몸(같은 도메인 기준)일 때 편하지만, S3 + EC2 분리, JWT 기반 SPA에는 안 어울림 지금: /api/auth/login 에서 JWT 발급 → 프론트(localStorage)에 저장 이후 모든 요청에 Authorization: Bear.. Project/Project01.MailBuddy develop_mii https://developmii.tistory.com/90 https://developmii.tistory.com/90#entry90comment Thu, 27 Nov 2025 23:09:28 +0900 https://developmii.tistory.com/89  <details> / <summary>   HTML 기본 요소 중 하나, <details> <summary>제목</summary> 내용 내용 내용... </details>   브라우저가 자동으로 제목(summary) 부분은 항상 보이게 하고 그 아래 내용은 접힌 상태로 숨겨두었다가 사용자가 제목을 클릭하면 열렸다 닫혔다 하는 토글 UI를 만들어줌 &n.. Project/Project01.MailBuddy develop_mii https://developmii.tistory.com/89 https://developmii.tistory.com/89#entry89comment Mon, 24 Nov 2025 10:39:10 +0900 https://developmii.tistory.com/88 문제 상황 Cannot read properties of null (reading 'type') TypeError: Cannot read properties of null (reading 'type') at onEdit (CalendarWriteForm.js:xx) Memo 영역에서 “날짜 없는 일정”을 선택하고 → “수정” 버튼을 누르면CalendarWriteForm 팝업이 열리고 , 기존 .. Project/Project01.MailBuddy develop_mii https://developmii.tistory.com/88 https://developmii.tistory.com/88#entry88comment Fri, 21 Nov 2025 11:58:40 +0900 https://developmii.tistory.com/87   이미 구현된 CalendarNav 중 AI 요약 관련 부분  const CalendarNav = ({ loadSummaries }) => { const [aiLoading, setAiLoading] = useState(false); const [aiError, setAiError] = useState(null); ... // AI 요약 버튼 const handleSummarize = async () =>.. Project/Project01.MailBuddy develop_mii https://developmii.tistory.com/87 https://developmii.tistory.com/87#entry87comment Thu, 20 Nov 2025 14:56:31 +0900 https://developmii.tistory.com/86 # 사용 가이드 페이지 구현 const GUIDE_NAV = [ { id: "start", label: "시작하기" }, { id: "mail-to-schedule", label: "메일 → 일정 변환" }, { id: "calendar", label: "캘린더 사용법" }, { id: "todo", label: "할 일(Todo)" }, { id: "addressbook", label: "주소록" }, ]; function.. Project/Project01.MailBuddy develop_mii https://developmii.tistory.com/86 https://developmii.tistory.com/86#entry86comment Thu, 20 Nov 2025 10:54:38 +0900 https://developmii.tistory.com/84 이미 연동한 Google Id 다른 아이디에 연동 시도시 에러페이지 이동 해결해보기   # 다른 아이디를 회원가입해서 연동시도 시 보여지는 에러페이지       원인 : 왜 에러가 나지? @Column(unique = true) private String googleEmail; // 구글 이메일 연동 → User 엔티티 - googleEmail에 Unique 제약     연동 흐름보기 .. Project/Project01.MailBuddy develop_mii https://developmii.tistory.com/84 https://developmii.tistory.com/84#entry84comment Tue, 18 Nov 2025 12:48:17 +0900 https://developmii.tistory.com/82 1. 들어가기 React를 배우면 제일 먼저 나오는 게 useState 여기서 두 가지 방법을 비교해보자.     2. 코드 예시 Body.js import { useState } from "react"; import "./Body.css"; function Body({ name, age, favorList = [], children }) { const [count, setCount] = useState(0); fun.. Write it/Java Script develop_mii https://developmii.tistory.com/82 https://developmii.tistory.com/82#entry82comment Mon, 10 Nov 2025 14:12:03 +0900