NGINX Reverse Proxy | NGINX DocumentationNGINX Reverse Proxy Configure NGINX as a reverse proxy for HTTP and other protocols, with support for modifying request headers and fine-tuned buffering of responses. This article describes the basic configuration of a proxy server. You will learn how to pdocs.nginx.com 1. 리버스 프록시 설정법 위와 같이 path가 /일 경우는 react를 빌드한 정적인 파일을 주고 path가 /api/v1인 경우 8080 포트의 Spr..

1. Nginx란? Nginx - 위키백과, 우리 모두의 백과사전위키백과, 우리 모두의 백과사전.ko.wikipedia.org Nginx는 웹 서버 소프트웨어이다. 기본적인 웹 서버 기능을 제공할 뿐만 아니라, 리버스 프록시, 로드 밸런서, http 캐싱 그리고 메일 프록시 기능을 제공한다. HTTP 프록시와 웹 서버 기능정적 파일과 인덱스 파일 표현, 자동 인덱싱 기능.캐싱을 통한 리버스 프록시로드 밸런싱고장 진단SSL 지원캐싱을 통한 FastCGI 지원Name-, IP-기반 가상서버FLV 스트리밍MP4 스트리밍 모듈을 이용한 MP4 스트리밍웹페이지 접근 인증gzip 압축10000개의 동시 접속을 처리할 수 있는 능력URL 다시 쓰기 (URL rewriting)맞춤 로깅서버 사이드 기능 포함WebDAV..

1. 상태 관리  Vue.jsVue.js - The Progressive JavaScript Frameworkvuejs.org 모든 Vue 컴포넌트 인스턴스는 이미 자체 반응형 상태를 관리한다. 상태(State) : 앱 구동에 필요한 기본 데이터뷰(View) : 상태를 선언적으로 매핑하여 시각화기능(Actions) : 뷰에서 사용자 입력에 대해 반응적으로 상태를 변경할 수 있게 정의된 동작  이때 단방향 데이터 흐름을 가진다. 하지만 이런 상태 관리의 단순성이 무너지는 시점이 오는데… 여러 컴포넌트가 상태를 공유할 때 단순성이 무너지기 시작한다. 가. 여러 뷰가 동일한 상태에 종속된 경우 여러 뷰가 하나의 상태의 변화에 따라 복잡하게 상호작용 할 수 있다. 공유하는 상태를 공통 조상 컴포넌트로 끌어올린 ..

Vue Router v3.router.vuejs.org 시간이 없는 관계로 따로 정리하진 않지만 중요해서 따로 링크를 남긴다. 아래에 언급한 내용은 특히 중요하다.라우터 사용법중첩된 라우트프로그래밍 방식 내비게이션Navigation guard

Vue.jsVue.js - The Progressive JavaScript Frameworkvuejs.org Vue.jsVue.js - The Progressive JavaScript Frameworkvuejs.org 1. Props  Props: 컴포넌트에 등록할 수 있는 사용자 정의 속성.: 상위 컴포넌트가 하위 컴포넌트에게 전달하는 값. 가. defineProps() {{ title }}defineProps는 Props의 이름뿐 아니라 다양한 옵션도 추가할 수 있다. 나. 정적 Props 다. 동적 Props 라. 주의점 식 컴포넌트 내부에서 props를 변경하려 하면 안 된다. Props는 읽기 전용입니다! 모든 props는 자식 속성과 부모 속성 사이에 하향식 단방향 바인딩을 형성한다. 부모 ..

Components Basics  Vue.jsVue.js - The Progressive JavaScript Frameworkvuejs.org 1. Component?  컴포넌트를 사용하면 UI를 독립적이고 재사용 가능한 단위로 분할하고 사용할 수 있다. 하나의 앱은 중첩된 컴포넌트의 트리로 구성된다. 가. Vite Vite는 기존의 복잡한 설정 없이 빠르게 Vue 프로젝트를 시작하기 위해서 사용한다.  ViteVite, 차세대 프런트엔드 개발 툴ko.vitejs.dev 나. vue file SFC의 파일명은 항상 PascalCase로 작성한다. (첫 단어를 대문자로 시작하는 표기법) 단, 대소문자를 구분하지 않는 파일 시스템에서는 kebab-case로 작성한다. 다. SFC 당신은 {{ count }..

Vue.jsVue.js - The Progressive JavaScript Frameworkvuejs.org 1. 왜 씀? Computed Properties는 getter에서 발생할 수 있는 사이드 이펙트를 방지하기 위해서 getter는 순수함수여야 한다.  앞서 Computed Propertyis를 배우면서 위와 같이 배웠다. 상태 변경에 대한 반응으로 사이드 이펙트(ex. DOM을 변경하거나 비동기 작업의 결과를 기반으로 다른 상태를 변경하는 것)를 수행해야 하는 경우 어떻게 해야 할까? 2. watch function Composition API를 사용한다면 wathch 함수를 사용해서 반응형 속성이 변경될 때마다 함수를 실행할 수 있다. Ask a yes/no question: ..

Vue.jsVue.js - The Progressive JavaScript Frameworkvuejs.org 시간이 없는 관계로 따로 정리하진 않지만 중요해서 따로 링크를 남긴다. 아래 내용은 특히 중요하다. v-on directive@ symbol.prevent