본문 바로가기

Books123

[Vue.js 프로젝트 투입 일주일 전] 13장 - 미니프로젝트: 로그인 처리 13.1 카카오 계정으로 로그인하기 - 카카오 개발자 센터 가입 - 애플리케이션 등록 - 앱 키 - 네이티브 앱 키: Android, iOS SDK에서 API 호출할 때 사용 - JavaScript 키: 자바스크립트 SDK에서 API를 호출할 때 사용 - REST API 키: REST API를 호출할 때 사용 - Admin 키: 모든 권한을 가지고 있는 키 - 플랫폼 설정하기 - 카카오 로그인 활성화 - 동의항목 설정 - 카카오 JavsScript SDK 및 앱 키 등록 - 로그인 컴포넌트 구현 - window.Kakao.Auth.login 함수 호출 => 카카오 계정으로 로그인 팝업 호출 - window.Kakao.Auth.logout 함수 호출 => 로그아웃 13.2 네이버 아이디로 로그인하기 - 오.. 2022. 5. 2.
[Vue.js 프로젝트 투입 일주일 전] 12장 - 프로젝트 배포하기 12.1 프로젝트 빌드(build) 하기 - npm run build 명령어 - 호스팅 서버에 dist 폴더의 파일을 업로드 해서 서비스 구동 - index.html이 Vue 프로젝트의 실행 파일이 됨 2022. 4. 30.
[Vue.js 프로젝트 투입 일주일 전] 11장 - Vuex (v4.x) 11.1 Vuex란? - Vuex: Vue.js 애플리케이션을 위한 상태관리 패턴 + 라이브러리 - 모든 컴포넌트에 대한 중앙집중식 저장소 역할, 예측 가능한 방식으로 상태 변경 가능 11.2 Vuex 설치 - npm install vuex@next 명령어 11.3 시작하기 - store(저장소): 애플리케이션 상태를 저장하고 있는 컨테이너 - 반응형 - 저장소의 state에 정의된 값 변경 여부 바로 알 수 있음, 직접적으로 상태 값 변경은 불가 - commit를 통해서만 변경 가능 - 모든 상태에 대한 추적이 가능한 기록이 남을 수 있음 11.4 State - state: 프로젝트 전체에서 공통으로 사용할 변수 정의 - Vue 컴포넌트에서 computed 속성을 이용하여 변경사항 항상 추적 가능 11.. 2022. 4. 30.
[Vue.js 프로젝트 투입 일주일 전] 10장 - Proxy 사용하기 10.1 프록시(proxy) 서버 - 프록시 서버: 클라이언트가 자신을 통해서 다른 네트워크 서비스에 간접적으로 접속 가능하게 해주는 응용 프로그램 - 클라이언트와 서버 사이에서 HTTP 요청과 응답을 대신 처리해주는 역할을 하는 서버 10.2 CORS란 - CORS: 웹 애플리케이션에서 도메인, 포트, 프로토콜이 다른 곳으로 HTTP 요청을 보낼 수 없도록 브라우저가 요청을 막는 보안 정책 10.3 CORS 해결방법 - 서버에서 접근 허용 - 프록시 서버 이용 10.4 Proxy 설정하기 - Vue에서 proxy 설정하고 클라이언트에서 HTTP 요청 (포트: 8080)하면 Proxy 서버가 웹 서버로 HTTP 요청 (포트: 3000)을 대신 함으로써 CORS 문제 해결 - 운영 환경에서는 제대로 실행 .. 2022. 4. 30.
반응형