URL.createObjectURL(Blob) 이란? : Blob 객체(이미지, 동영상 등 대용량 바이너리 객체)를 가상의 URL을 부여하여 접근할수 있게 한다. : 생성된 주소는 메모리에 올라가 있다. : createObjectURL(Blob)을 사용한 브라우저가 종료될 경우 메모리에 올라간 가상 URL은 사라지게 된다. ​ 예) Vue 환경 ​ View x Javascript methods: { imageUpload() { this.pdf_files = [ { file: this.$refs.files.files[0], preview: URL.createObjectURL(this.$refs.files.files[0]) } ] } } ​ * Blob(Binary Large Objects) 대용량 바이너리..

Javascript Prototype 자바스크립트는 프로토타입 기반 언어라고 불린다. 객체지향언어 즉, Java에서 사용하는 Class라는 개념과 비슷하지만 자바스크립트에서는 Class라는게 없습니다. 그래서 사용하는게 프로토타입입니다. 클래스가 없으니 상속기능도 없지만 프로토타입을 사용하여 상속이라는걸 흉내내도록 구현해 사용한다. Person 함수를 생성하게 되면 Person 함수의 프로토타입 객체가 생성된다. Person 함수는 내부적으로 prototype 이라는 멤버를 갖게 되는데 해당 prototype 멤버는 Person 함수의 프로토타입 객체를 참조한다. Person 함수의 프로토타입 객체는 constructor 라는 멤버를 갖는데 Person 함수를 참조한다. Person 함수의 prototy..

Vuex : vue는 컴포넌트 기반 프레임워크 : 컴포넌트간의 통신이나 데이터 전달을 유기적으로 관리하기 위해 vuex라는 저장소를 사용한다. : state, mutations, actions, getters : Vue.js 어플리케이션에 대한 상태 관리 패턴 + 라이브러리 입니다. : 어플리케이션의 모든 컴포넌트의 중앙 집중식 저장소 역할, 예측 가능한 방식으로 상태 변경 가능 : Vue의 공식 devtools 확장 프로그램과 통합되어 설정 시간이 필요 없는 디버깅 및 상태 스냅샷 내보내기/가져오기와 같은 고급 기능을 제공한다. ​ ​ * 상태 관리(State Managerment)는 왜 필요한가 : 컴포넌트 기반 프레임워크(Vue)에서는 작은 단위로 쪼개진 여러개의 컴포넌트 화면을 구성합니다. 이에따..

v-if : 지정한 뷰 데이터 값의 참, 거짓여부에 따라 html 태그를 처리, 화면에 보여줄것인가 아닌가 ex) ​ v-for : vue에서 html 태그 반복문 : 지정한 뷰 데이터 개수만큼 html 태그 반복 ​ ex) 사용예시 : v-for="(변수명, index명) in 배열" :key="index명" ​ v-show : v-if 와 비슷하게 참, 거짓 여부에 따라 html을 보여줄것인지 안보여줄것인지 판단 * v-if와 차이점 : v-show는 태그 자체를 숨김처리(display-)지만, v-if는 태그자체를 삭제한다. ​ v-bind : html 태그에 설정된 기본속성 및 데이터와 vue 데이터 속성과 연결 : 줄임말 ":" 가능 ex) :for ​ ​ v-on : 이벤트 감지 처리 : 줄임..

Vue js 에서 사용하는 vue-cli를 사용하여 프로젝트 생성 ​ 1. vue-cli 설치 : npm install -g @vue-cli * vue-cli란 ​vue-cli는 기본 vue 개발 환경을 설정해주는 도구입니다. vue-cli가 기본적인 프로젝트 설정을 해주기 때문에 폴더 구조에 대한 고민, build, 라이브러리 구성, 배포를 위한 webpack 등 고민할 필요가 없다. 설치됐는지 확인하기 : vue 해당 화면이 뜰경우 설치가 완료된거다. -g(global) 명령어를 사용했기때문에 환경변수가 적용되어 명령어 사용이 가능한거다. ​ 2. Vue 프로젝트 생성 * vue init webpack 프로젝트명 ​ : vue init webpack my-obo ​ ********* * vue ini..

Angularjs 1. login.js 및 login.html 생성 * run method를 이용하여 로그인 인증정보를 확인한다. * angular의 run 메소드는 java의 main 함수 역할 * run 메소드(java에서 main 함수 역할) app/views/components/login/login.js angular.module('AuthCheck', []) .run(['$rootScope', '$window', '$http', function($rootScope, $window, $http){ if($window.sessionStorage.getItem('currentUser')){ $http.defaults.headers.common.Authorization = 'Bearer'+$window..