전체 글46 2. Vue.js 개발 환경 구축 1. 개발 환경 구성의 필요성Vue.js는 간단히 태그를 통해 바로 쓸 수 있지만,대부분의 실제 프로젝트에서는 Vue CLI를 사용하여 모듈화, 빌드, 핫 리로딩 등 개발 편의 기능을 활용합니다.2. Node.js 설치Vue CLI는 Node.js 환경에서 동작하기 때문에먼저 Node.js를 설치해야 합니다.Node.js 다운로드👉 https://nodejs.orgLTS(Long Term Support) 버전을 권장합니다.설치가 끝나면 터미널(명령 프롬프트)에서 다음으로 버전을 확인해 보세요.node -vnpm -v3. Vue CLI 설치Vue CLI는 Vue 공식 커맨드라인 툴입니다.아래 명령어로 설치할 수 있습니다.npm install -g @vue/cli설치 후 버전 확인:vue --versio.. 2025. 7. 3. 1. Vue.js란? 왜 사용하는가? 1. Vue.js의 정의Vue.js는 사용자 인터페이스(U)를 만들기 위해 설계된 프로그래시브 자바스크립트 프레임워크 입니다."프로그래시브" 라는 말은 점진적으로 적용 가능하다는 의미로,조금씩 필요한 부분만 Vue로 개발하다가 점점 더 큰 프로젝트로 확장할 수 있는 유연성을 갖추고 있습니다.Vue는 특히 데이터와 DOM을 연결(양방향 데이터 바인딩) 하는 방식을 매우 직관적으로 제공하며,컴포넌트 기반 아키텍처 덕분에 코드의 재사용성과 유지보수성이 뛰어납니다.2. Vue.js의 특징반응형(Reactive) 데이터 바인딩데이터가 바뀌면 화면도 자동으로 업데이트되는 구조컴포넌트 기반 구조UI를 잘게 쪼개어 독립적인 블록으로 개발 -> 유지보수와 재사용이 쉬움가벼움다른 프레임워크(React, Angular)에 .. 2025. 7. 3. 19. CORS란? 왜 발생하고 어떻게 해결하는가? ✅ 1. CORS란?CORS (Cross-Origin Resource Sharing) 는다른 출처(Origin)의 리소스 요청을 제한하는 브라우저의 보안 정책이다. 간단히 말해:"서버 도메인과 요청 도메인이 다르면 브라우저가 요청을 막는다."🧩 2. Origin이란?출처(Origin) = 프로토콜 + 도메인 + 포트 번호의 조합이다.예시http://localhost:3000 ← 프론트엔드 개발 서버http://localhost:8080 ← 백엔드 API 서버→ 포트가 다르면 출처가 다름🔒 3. CORS 정책이 왜 필요한가?보안상 이유로 브라우저는 다른 출처의 요청이 민감한 정보를 가져오는 걸 막는다.예:악성 사이트가 사용자의 쿠키나 데이터를 훔치는 걸 방지 → 그래서 브라우저는 자바스크립트로 다른 출.. 2025. 6. 23. 18. REST API 보안 원칙 정리 ✅ 1. REST API에서 왜 보안이 중요한가?REST API는 주로 웹/앱/서버 간 통신에 사용되며,로그인, 결제, 데이터 요청 등 중요한 정보를 다루기 때문에보안이 취약하면 정보 유출, 계정 탈취, 시스템 해킹으로 이어질 수 있다.✅ 2. 인증(Authentication)과 권한(Authorization) 1️⃣ 인증(Authentication)사용자가 누구인지 확인하는 절차→ 로그인 처리, 토큰 발급 등대표 방식세션 기반 인증 (쿠키 + 세션)JWT(Json Web Token) 기반 인증OAuth2 (카카오, 네이버, 구글 로그인 등) 2️⃣ 권한(Authorization)인증된 사용자가 무엇을 할 수 있는지 판단하는 절차예시관리자만 글 삭제 가능일반 사용자는 자신의 글만 수정 가능→ 인증 후.. 2025. 6. 23. 이전 1 2 3 4 5 ··· 12 다음