반응형 분류 전체보기137 History모드 : SPA, SSR, CSR SPA: (Single Page Application)각 UI는 javascript 코드로 만들어서 하나의 페이지( html 문서) 에 마운트 시킨다.페이지를 따로 로딩하지 않아도 되기 때문에 UI를 빠르게 사용할 수 있다. SSR: 서버측에서 각 페이지 UI에 보여질 리소스를 생성해서 화면으로 내려주는 방식CSR: 클라이언트에서 javascript코드로 html생성해서 보여주는 방식 [운영서버에 배포할 때 차이점] History모드: 전체 경로를 포함해서 리소스를 요청한다.하지만 히스토리 모드로 서버에 배포를 하게 되면 404 NotFound 페이지가 보여지게 된다. 즉 히스토리 모드로 서버에 배포를 할 때는 추가로 사용하는 서버에 맞게 설정을 해줘야 한다. hash모드: 해시모드로 서버에 자원.. 2024. 8. 5. vue3 ref와 reactive 사용법과 차이점 Options API는 data, methods, mounted 와 같은 옵션을 사용. (vue3 이전 버전)Composition API는 반응형 코드를 작성하는 단일 setup 함수가 있음. (vue3)composition api는 vue 컴포넌트를 작성할 수 있는 api세트이다. 그 중 ref와 reactive는 컴포넌트와 별개로 사용할 수 있는 반응형 데이터를 생성할 수 있다. ref는 premity type(string, number, object) 어떠한 타입도 사용할 수 있고,reactive는 object, array, map, set과 같은 타입에서만 사용할 수 있다. 객체를 선언할때 둘 다 사용할 수 있는데, ref를 사용하면 객체를 한꺼번에 객체 할당할 수 있다.반대로 reactive.. 2024. 8. 5. vue router 이동 // 리터럴 문자열 경로router.push('/users/eduardo')// 경로가 있는 개체router.push({ path: '/users/eduardo' })// 이름을 가지는 라우트router.push({ name: 'user', params: { username: 'eduardo' } })// 쿼리와 함께 사용, 결과적으로 /register?plan=private가 됩니다.router.push({ path: '/register', query: { plan: 'private' } })// 해시와 함께 사용, 결과적으로 /about#team가 됩니다.router.push({ path: '/about', hash: '#team' }) 2024. 8. 3. javascript에서 this 컨트롤 하기 * 해당 글은 정리가 잘 된 포스팅 글 전체를 가져온 글입니다. (공부를 위해 타이핑..) 같은 글이니 아래 링크에서 포스팅 확인하세요 :) https://poiemaweb.com/js-this this는 매개변수로 전달되는 인자값 이외에 argument객체와 this를 암묵적으로 전달 받는다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로터피나 메서드를 참조할 수 있다. 크게보면 전역에서 사용할 때와 함수안에서 사용할 때로 나눌 수 있다. 자바스크립트에서 this는 함수 호출 방식에 따라 바인딩되는 객체가 달라진다. 1. 전역에서 선언된 함수에서의 this는 global(window, global)이다. 2. 함수 내부에서 사용하는 this - 엄격모드에서 일반 내부함수의 thi.. 2024. 4. 1. 이전 1 2 3 4 5 6 ··· 35 다음 728x90 반응형