개발 공부하는 빙빙

안드로이드 스튜디오 프로그램 사용중 에뮬레이터가 무한 로딩이 되며 안뜰 때!! Waiting for target device to come online 이런 문구를 보셨을 것입니다! 해결 방법은 AVD Manager를 클릭 안되는 에뮬레이터 이름 위에서 오른쪽 마우스를 클릭하면 Wipe Data가 나온다! 그걸 누르면 정상 작동된다!!!

CORS 교차 출처 자원 공유(동일출처: 프로토콜/호스트/포트) 추가적인 HTTP header를 이용하여 다른 출처의 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제 다른 출처의 리소스를 불러오려면 그 출처에서 올바른 CORS header를 포함한 응답을 반환 SOP(Single-origin policy) 동일 출처 정책(포트와 호스트가 모두 같아야 동일) 잠재적으로 해로울 수 있는 문서를 분리 -> 공격받을 수 있는 경로를 줄임

서버 정보제공 디비와 통신하며 데이터를 crud 요청을 보낸 클라이언트에게 정보를 응답 클라이언트 서버에게 서비스 요청하고 서버가 원하는 방식에 맞게 제공 사용자에게 적절한 방식으로 표현 ex) postman

브라우저의 로컬 스토리지에 힘을 빌려서 저장이 됨 (유효기간은 1년정도?) 명령어 npm i vuex-persistedstate 등록을 해줘야 할 플러그인 index.js에 안에 작성해주기 import createPersistedState from "vuex-persistedstate" Vuex.Store 안에 작성해줄 것 export default new Vuex.Store({ plugins:[ createPersistedState(), ],

Emit & Props 각 컴포넌트는 개별적으로 데이터를 관리해야한다. 데이터는 단방향 흐름, 자식간에만 전달이 가능 장점: 데이터의 흐름이 직관적임 단점: 컴포넌트의 중첩이 많아질 경우 로직이 복잡,불편해짐 Vuex 프로젝트 규모가 커질 때 자연스럽게 사용한다. 상태관리 패턴 + 라이브러리 상태를 전역에서 관리하도록 하는 라이브러리 모든 컴포넌트에 대한 중앙 집중식 저장소 역할-> 규모가 큰 프로젝트에(컴포넌트 중첩이 많은) 좋음 Mutations가 State를 변경 시킨다 Vuex의 구성요소 State : 데이터의 역할.어플리케이션마다 하나의 저장소를 관리(data), State에 접근하는 방삭 : this.$store.state.data_name Actions : computed와 같은 역할. St..

Router라우터: 길을 만들어 주는 애 index.js 파일에 정의한 경로에 특정한 컴포넌트와 매핑 SPA등장 이후에 모든 요청에 대한 처리는 서버가 하지 않고 HTML 위에서 자바스크립트 코드를 활용해 진행된다. 서버는 index.html만 제공한다. Vue로 개발하는 SPA의 단점은 페이지의 이동이 없다라는 점을 개선하기위해 url는 바뀌지만 페이지는 실제로 이동하지 않는 방법. 브라우저의 history api를 이용하여 라우터가 동작을 한다. 명령어 vue add router

SFC( Single File Component) vue의 컴포넌트 기반 개발의 핵심 특징 화면의 특정 영역에 대한 여러 코드를 하나의 파일(.vue)에서 관리 component: 재사용 가능한 코드를 캡슐화 하는데 도움을 줌 Vue 인스턴스 === Vue 컴포넌트 Vue CLI를 사용하기 위해서 Node.js설치가 필요하다. Node.js: 자바스크립트를 브라우저에서만 사용하는게 아닌 SSR에서도 사용 가능하도록 함 python 에서 pip가 있다면 node.js에서는 NPM. 다양한 패키지 관리자. 명령어 설치 공식문서 https://cli.vuejs.org/guide/installation.html npm install -g @vue/cli 프로젝트 이름이 my-first-vue-app일 때 npm..

AJAX (새로고침을 안하고 바로 html페이지에 반영하기 위해 사용) 비동기식 자바스크립트와 xml가 있다. 서버와 통신하기 위해 XMLHttpRequest 객체를 활용한다. 동기식과 비동기식 통신을 모두 지원한다. * 비동기성 = 전체페이지를 reload안하고도 수행 됨 event가 있으면 전체 페이지말고 일부분만을 업데이트한다. 동기식 순차적, 직렬적으로 일을 수행한다. 요청을 보낸 후 응답을 받아야만 다음 동작이 이루어짐(blocking) 비동기식

DOM (Documnet Object Model) html 태그 트리구조화된 형태 HTML,XML 등과 같은 문서를 다루기 위한 독립적인 문서 모델 인터페이스 문서가 구조화되어 있으며 각 요소는 객체로 취급 DOM이 있으면 자바스크립트로 동적인 구현이 가능 html과 javascript의 연결을 해줌 BOM(Browser Object Model) 자바스크립트가 브라우저와 소통하기 위한 모델 브라우저나 윈도우 웹페이지 일부를 제어 가능 브라우저 윈도우 자체를 지칭 window를 제어한다. 메소드 = window(웹 브라우저 창 객체), location, history(뒤로가기 몇 번남았는지), screen(화면 해상도정보) 같은 것들이 있다. ex : window.open() , window.close()..

API 프로그래밍 언어가 제공하는 기능을 이용할 수 있게 하는 인터페이스 REST(Representational State Transfer) :라이브러리 웹 설계 상의 장점을 최대한 활용할 수 있는 아키텍쳐 방법론 => 사용하면 좋은 규약정도 URI :통합 자원 식별자. URI의 하위개념으로 URL, URN URL:통합 자원 위치, 어디에 있는지(주소) 알려주기 위한 역할 URN :통합 자원 이름 URL과 달리 자원의 위치에 영향을 받지 않는 유일한 이름 서버에서 알아서 이루어짐 URN은 자원의 id URL은 자원을 찾는 방법 제공 HTTP Method 종류 GET : 특정 자원의 표시를 요청하며, 오직 데이터를 받기만 함 POST : 서버로 데이터를 전송하며, 서버에 변경사항을 만듦 PUT : 요청한 ..