쿠키(Cookie) 사용자가 어떠한 웹 사이트를 방문할 경우 사용자의 컴퓨터에 저장하는 작은 기록 정보 파일이다. 사용자가 따로 요청하지 않아도 브라우저가 Request시에 Request Header를 넣어서 자동으로 서버에 전송한다. 사용자의 상태 정보를 로컬에 저장했다가 필요시 정보를 참조하거나 재사용 한다. 사용자 인증이 유효한 시간을 명시...
RESTful API 이란
RESTful API란? REST를 기반 API를 의미합니다. REST은 무엇인지, REST API는 무엇인지, RESTful API는 무엇인지 알아보려고합니다. 1. RESTful API에서 REST 란? REST는 Representational State Transfer의 약자로써 풀어서 설명하자면 자원을 이름으로 구분해 해당 자...
통신을 위한 라이브러리, Axios
“Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리입니다.” Axios 공식문서에 나와 있는 Axios의 정의이다. 자바스크립트의 Fetch API와 비슷한 기능을 가지고 있다. axios vs fetch 요청 객체에 URL을 가지고 있다. 요청 개체에 URL이 ...
Vue Lifecycle 이해하기
Vue Lifecycle 이해하기 모든 Vue 앱은 Vue 함수로 새 Vue 인스턴스를 만드는 것부터 시작한다. var vm = new Vue({ // 옵션 }) Vue 인스턴스는 생성될 때, 일련의 초기화 단계를 거친다. 예를들어 아래와 같은 경우가 있다. 데이터 관찰 설정이 필요한 경우 템플릿을 컴파일 하는 경우 인스턴...
Vuex가 무엇인가?
Vuex가 무엇인가? Vue.js에 대한 상태 관리 패턴이자 라이브러리이다. 모든 컴포넌트에 대한 중앙 집중식 저장소 역할을 하며 예측 가능한 방식으로 상태를 변경할 수 있다. 상태 관리란? 간단한 Vue 코드로 확인해보겠다. new Vue({ // 상태 data () { return { count : 0 ...
Vue Router 사용하기
Vue Router 란 ‘Vue 라우터는 Vue.js (opens new window)의 공식 라우터이며, Vue.js를 사용한 싱글 페이지 앱(SPA)을 쉽게 만들 수 있도록 Vue.js의 코어와 긴밀히 통합되어 있다.’ 라고 공식문서에 설명되어있다. 싱글 페이지 앱(SPA)는 최초에 한번 페이지를 로드하고 이후부터는 특정 부분만 변경하여 페...
Vue-CLI
Vue-CLI 란 Vue CLI은 Vue.js의 개발 환경을 쉽고 빠르게 구축할 수 있도록 도와주는 도구이다. cli를 이용하면, 짧은 시간내에 프로젝트의 환경을 설정할 수 있다. 사용자가 조금 더 개발에 집중할 수 있도록 도와준다. CLI란 Command Line Interface의 약자로 터미널을 통해 사용자와 컴퓨터가 상호 작용하는 방식...
Vue.js란
Vue.js 란 무엇인가? Vue.js의 공식문서에서는 ‘사용자 인터페이스를 만들기 위한 프로그레시브 프레임워크’ 라고 설명하고 있다. 즉, 보여지는 화면을 만드는 자바스크립트 프레임워크 중의 하나이다. Vue.js는 진입장벽이 낮으며 쉽고 빠르게 개발을 할 수 있다는 것이 가장 큰 장점으로 가지고 있다. Vue.js 공식사이트 장점 ...
나를 괴롭히는 CORS
🚨 Access to XMLHttpRequest at ‘http:// [A] ‘ from origin ‘http:// [B] ‘ has been blocked by CORS policy : No ‘Access-Control-Allow-Origin’ header is present on the requested resource. 웹 프로젝트를 ...
GET과 POST 방식
웹 브라우저로 어떤 사이트에 접속한다고 했을 때, 사용자는 URL을 입력하여 접근한다. HTTP 프로토콜을 통하여 사용자는 요청을 보내고 서버는 그 요청에 맞게 응답한다. 그리고 그 요청의 방식에는 크게 2가지 방식이 있고 그것이 바로 GET방식과 POST방식이다 GET GET 방식은 서버로부터 어떠한 정보를 조회하기 위해서 사용되는 방식이다....